@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/cormorant-garamond-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/cormorant-garamond-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/cormorant-garamond-latin-400-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/cormorant-garamond-latin-ext-400-italic.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/cormorant-garamond-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500;font-display:swap;src:url(fonts/cormorant-garamond-latin-500-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500;font-display:swap;src:url(fonts/cormorant-garamond-latin-ext-500-italic.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/cormorant-garamond-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:600;font-display:swap;src:url(fonts/cormorant-garamond-latin-600-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/hanken-grotesk-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/hanken-grotesk-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
*,*::before,*::after{box-sizing:border-box}body{margin:0}[hidden]{display:none!important}

/* Layout: Katalog-Raster – ein schmaler Kopf, große Werkflächen, Angaben in einer ruhigen Seitenspalte; Bilder immer ganz, nie beschnitten */
:root{
  --paper:#f5f5f2; --ink:#161615; --mute:#6b6a65; --line:#d9d8d2; --wall:#ebeae5; --focus:#2f47c9;
  --f-ui:"Archivo",ui-sans-serif,"Helvetica Neue",Arial,sans-serif;
  --f-text:"Newsreader",Georgia,"Times New Roman",serif;
  --gut:max(16px, env(safe-area-inset-left,0px)); --gutr:max(16px, env(safe-area-inset-right,0px));
  --hdr:56px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--paper:#121211;--ink:#e9e8e3;--mute:#9a9891;--line:#2e2d2a;--wall:#1b1b19;--focus:#9fb0ff;color-scheme:dark}}
:root[data-theme="dark"]{--paper:#121211;--ink:#e9e8e3;--mute:#9a9891;--line:#2e2d2a;--wall:#1b1b19;--focus:#9fb0ff;color-scheme:dark}
@media (min-width:900px){:root{--gut:max(40px, env(safe-area-inset-left,0px));--gutr:max(40px, env(safe-area-inset-right,0px))}}

html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr) + env(safe-area-inset-top,0px) + 12px)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
body{background:var(--paper);color:var(--ink);font:400 16px/1.5 var(--f-ui);-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--paper)}
a{color:inherit}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
img{display:block;max-width:100%;height:auto}
figure{margin:0}
.main-fig,.more figure,.pair figure{width:fit-content;max-width:100%}
main img{background:var(--wall)}
p{margin:0}
.wrap{padding-left:var(--gut);padding-right:var(--gutr)}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--paper);padding:8px 12px;z-index:50}
.skip:focus{left:16px}

/* Kopf */
.hdr{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.hdr-in{height:var(--hdr);display:flex;align-items:center;justify-content:space-between;gap:16px}
.name{font:600 19px/1 var(--f-ui);font-stretch:112%;letter-spacing:-.01em;text-decoration:none;margin:0}
.name a{text-decoration:none}
.menu-btn{appearance:none;border:0;background:none;color:inherit;width:44px;height:44px;margin-right:-10px;display:grid;place-items:center;cursor:pointer}
.menu-btn span{display:block;width:24px;height:1.5px;background:currentColor;box-shadow:0 7px 0 currentColor;transform:translateY(-3.5px)}

/* Menü */
.menu{position:fixed;inset:0;z-index:40;background:var(--paper);display:grid;grid-template-rows:auto 1fr;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility 0s linear .35s;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
.menu.open{opacity:1;visibility:visible;transition:opacity .35s ease}
.menu-top{height:var(--hdr);display:flex;align-items:center;justify-content:space-between}
.close-btn{appearance:none;border:0;background:none;color:inherit;width:44px;height:44px;margin-right:-10px;cursor:pointer;position:relative}
.close-btn::before,.close-btn::after{content:"";position:absolute;left:10px;right:10px;top:50%;height:1.5px;background:currentColor;transform:rotate(45deg)}
.close-btn::after{transform:rotate(-45deg)}
.menu-body{overflow:auto;display:grid;grid-template-columns:minmax(0,1fr);gap:40px;padding-block:24px 48px}
@media (min-width:900px){.menu-body{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}}
.menu ul{list-style:none;margin:0;padding:0}
.menu-works a{display:inline-block;text-decoration:none;font:400 clamp(26px,4.2vw,52px)/1.12 var(--f-text);letter-spacing:-.01em;padding-block:2px;transform:translateY(8px);opacity:0;transition:transform .5s ease,opacity .5s ease,color .2s}
.menu-works a strong{font-weight:400}
.menu.open .menu-works a{transform:none;opacity:1}
.menu-works a:hover{color:var(--mute)}
.menu-side{display:flex;flex-direction:column;gap:28px;align-self:end}
.menu-side a{text-decoration:none;font:500 14px/1.4 var(--f-ui);letter-spacing:.08em}
.menu-side a:hover{text-decoration:underline}
.menu-preview{display:none}
@media (hover:hover) and (min-width:900px){.menu-preview{display:block;position:sticky;top:0;align-self:start;max-height:56vh}.menu-preview img{max-height:56vh;width:auto;margin-left:auto;opacity:0;transition:opacity .3s}.menu-preview img.on{opacity:1}}

/* Einstieg */
.hero{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;padding-block:8px 72px}
.hero-fig{display:flex;justify-content:center;background:var(--wall)}
.hero-fig img{max-height:calc(100svh - var(--hdr) - 80px);width:auto}
.hero-cap{font:400 13px/1.4 var(--f-ui);display:flex;justify-content:space-between;gap:16px}
.hero-cap a{text-decoration:none}
.hero-cap a:hover{text-decoration:underline}

/* Text */
.bio{display:grid;grid-template-columns:minmax(0,1fr);padding-block:24px 112px}
.bio-text{font:300 clamp(19px,1.8vw,24px)/1.45 var(--f-text);max-width:34em;display:grid;gap:1em}
.bio-text strong{font-weight:500}
@media (min-width:900px){.bio{grid-template-columns:repeat(12,minmax(0,1fr))}.bio-text{grid-column:5/12}}

/* Übersicht */
.idx{padding-block:0 120px}
.idx-bar{display:flex;justify-content:flex-end;gap:4px;border-top:1px solid var(--line);padding-top:10px;margin-bottom:32px}
.view-btn{appearance:none;background:none;border:0;color:var(--mute);width:40px;height:40px;display:grid;place-items:center;cursor:pointer}
.view-btn[aria-pressed="true"]{color:var(--ink)}
svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.4}
.tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:56px 24px;align-items:start}
@media (min-width:700px){.tiles{grid-template-columns:repeat(12,minmax(0,1fr))}
  .c7{grid-column:span 7}.c6{grid-column:span 6}.c5{grid-column:span 5}.c4{grid-column:span 4}
  .dn{margin-top:clamp(40px,8vw,120px)}.dn2{margin-top:clamp(80px,14vw,200px)}}
.tile a{text-decoration:none;display:grid;gap:10px}
.tile img{width:auto;max-height:88svh;transition:opacity .3s}
.tile a:hover img{opacity:.86}
.tile-cap{font:400 13px/1.4 var(--f-ui)}
.tile-cap strong{font-weight:600}
.rows{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.rows a{display:block;padding:14px 0;border-bottom:1px solid var(--line);text-decoration:none;font:400 clamp(20px,2.4vw,30px)/1.2 var(--f-text);transition:padding .25s}
.rows a strong{font-weight:400}
.rows a:hover{padding-left:12px}

/* Werke */
.works{display:grid;gap:clamp(96px,14vw,200px);padding-block:40px 160px}
.work{display:grid;gap:clamp(24px,4vw,56px)}
.work-head{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:end}
@media (min-width:900px){.work-head{grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:40px}}
.main-fig img{max-height:calc(100svh - var(--hdr) - 48px);width:auto}
.credit{font:400 11px/1.3 var(--f-ui);color:var(--mute);margin-top:6px;text-align:right}
.work-info{display:grid;gap:20px;align-content:end;max-width:30em}
.caption{font:400 14px/1.45 var(--f-ui)}
.caption .cap-title strong{font-weight:600}
.work-text{font:300 18px/1.5 var(--f-text)}
.work-text strong{font-weight:500}
.more{display:grid;grid-template-columns:minmax(0,1fr);gap:28px 24px;align-items:end}
@media (min-width:700px){.more{grid-template-columns:repeat(2,minmax(0,1fr))}.more.n3{grid-template-columns:repeat(3,minmax(0,1fr))}.more.n1{grid-template-columns:minmax(0,8fr) minmax(0,4fr)}}
.more img{max-height:80svh;width:auto}
.pair{display:grid;grid-template-columns:minmax(0,1fr);gap:40px 24px;align-items:start}
@media (min-width:700px){.pair{grid-template-columns:repeat(2,minmax(0,1fr))}}
.pair .caption{margin-top:14px}
.work-nav{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:6px}
.work-nav a{width:44px;height:44px;display:grid;place-items:center;color:var(--mute)}
.work-nav a:hover{color:var(--ink)}

/* CV */
.cv{display:grid;grid-template-columns:minmax(0,1fr);gap:48px 64px;padding-block:24px 140px;border-top:1px solid var(--line)}
@media (min-width:900px){.cv{grid-template-columns:repeat(2,minmax(0,1fr))}}
.cv-col{display:grid;gap:36px;align-content:start;min-width:0}
.cv-mail{font:400 12px/1.4 var(--f-ui);color:var(--mute);padding-top:24px}
.cv-title{font:400 clamp(30px,3.6vw,46px)/1.05 var(--f-text);margin:0;text-wrap:balance}
.cv-sec h3{font:600 12px/1.3 var(--f-ui);letter-spacing:.08em;text-transform:uppercase;margin:0 0 14px}
.cv dl{margin:0;display:grid;gap:12px}
.cv-row{display:grid;grid-template-columns:5.5em minmax(0,1fr);gap:16px;font-size:14px;line-height:1.45}
.cv dt{font-variant-numeric:tabular-nums;color:var(--mute)}
.cv dd{margin:0;display:grid;gap:8px}

/* Fuß */
.ftr{border-top:1px solid var(--line);padding-block:32px calc(40px + env(safe-area-inset-bottom,0px));display:grid;grid-template-columns:minmax(0,1fr);gap:32px}
@media (min-width:700px){.ftr{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ftr h2{font:600 12px/1.3 var(--f-ui);letter-spacing:.08em;margin:0 0 10px}
.ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ftr p,.ftr a{font-size:14px}
.ig{display:inline-flex;gap:8px;align-items:center;text-decoration:none}
.ig:hover{text-decoration:underline}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---- Edle Ebene: Galerieweiß, Antiqua für Name, Titel und Text, feine Grotesk nur für Angaben ---- */
:root{--paper:#fbfbf9;--ink:#1d1c1a;--mute:#8b8881;--line:#e7e5e0;--wall:#f2f1ed;
  --f-disp:"Cormorant Garamond","Cormorant",Garamond,"Times New Roman",serif;
  --f-ui:"Hanken Grotesk",ui-sans-serif,"Helvetica Neue",Arial,sans-serif;
  --f-text:"Cormorant Garamond",Garamond,"Times New Roman",serif; --hdr:76px}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--paper:#0e0e0d;--ink:#ecebe6;--mute:#8f8c85;--line:#262523;--wall:#161615}}
:root[data-theme="dark"]{--paper:#0e0e0d;--ink:#ecebe6;--mute:#8f8c85;--line:#262523;--wall:#161615}
@media (min-width:900px){:root{--gut:max(56px, env(safe-area-inset-left,0px));--gutr:max(56px, env(safe-area-inset-right,0px))}}
body{font:300 15px/1.6 var(--f-ui);letter-spacing:.005em}
.name{font:500 27px/1 var(--f-disp);font-stretch:normal;letter-spacing:.01em}
.hdr{background:color-mix(in srgb,var(--paper) 94%,transparent)}
.menu-btn span{width:30px;height:1px;box-shadow:0 8px 0 currentColor;transform:translateY(-4px)}
/* Menü dunkel und ruhig */
.menu{background:var(--ink);color:var(--paper)}
.menu .close-btn::before,.menu .close-btn::after{height:1px}
.menu-works{display:grid;gap:2px}
.menu-works a{font:400 clamp(30px,4.6vw,64px)/1.08 var(--f-disp);letter-spacing:0}
.menu-works a strong{font-weight:400;font-style:italic}
.menu-works a:hover{color:var(--mute)}
.menu-works li:nth-child(n){transition-delay:0s}
.menu-side a{font:400 12px/1.4 var(--f-ui);letter-spacing:.16em}
/* Einstieg: Werk frei auf der Wand */
.hero{padding-block:clamp(24px,5vh,56px) clamp(80px,14vh,160px);gap:18px;justify-items:center}
.hero-fig{background:none}
.hero-fig img{max-height:calc(100svh - var(--hdr) - 140px)}
.hero-cap{font:300 12px/1.4 var(--f-ui);letter-spacing:.08em;justify-content:center}
.hero-cap strong{font-weight:500}
/* Text */
.bio{padding-block:0 clamp(120px,18vh,200px)}
.bio-text{font:400 clamp(22px,2.15vw,30px)/1.42 var(--f-text);max-width:30em;gap:.9em}
.bio-text strong{font-weight:400;font-style:italic}
@media (min-width:900px){.bio-text{grid-column:4/11}}
/* Übersicht */
.idx-bar{border-top-color:var(--line)}
.tiles{gap:clamp(64px,9vw,128px) clamp(24px,3vw,48px)}
.tile a{gap:14px}
.tile img{transition:opacity .5s ease}
.tile a:hover img{opacity:.8}
.tile-cap{font:300 12px/1.5 var(--f-ui);letter-spacing:.06em}
.tile-cap strong{font-weight:500}
.rows a{font:400 clamp(24px,2.8vw,38px)/1.15 var(--f-disp);padding:18px 0}
.rows a strong{font-style:italic;font-weight:400}
/* Werke */
.works{gap:clamp(140px,20vw,280px)}
.work{gap:clamp(40px,6vw,96px)}
@media (min-width:900px){.work-head{grid-template-columns:minmax(0,8fr) minmax(0,3fr);gap:clamp(40px,5vw,88px)}}
.caption{font:300 13px/1.65 var(--f-ui);letter-spacing:.02em}
.caption .cap-title{font:400 22px/1.2 var(--f-disp);letter-spacing:0;margin-bottom:8px}
.caption .cap-title strong{font-weight:500;font-style:italic}
.work-text{font:400 20px/1.45 var(--f-text)}
.work-text strong{font-weight:400;font-style:italic}
.credit{font:300 10px/1.3 var(--f-ui);letter-spacing:.06em;margin-top:8px}
.more{gap:clamp(40px,5vw,72px) clamp(24px,3vw,48px)}
.work-nav{border-top:0;padding-top:0}
.work-nav a{color:var(--mute)}
svg{stroke-width:1}
/* CV */
.cv{border-top-color:var(--line)}
.cv-title{font:400 clamp(34px,4vw,54px)/1.05 var(--f-disp)}
.cv-sec h3{font:400 11px/1.3 var(--f-ui);letter-spacing:.18em}
.cv-row{font-size:14px}
.ftr h2{font:400 11px/1.3 var(--f-ui);letter-spacing:.18em}
/* Bilder blenden ruhig ein, sobald sie geladen sind */
.js main img{opacity:0;transition:opacity .9s ease}
.js main img.ld{opacity:1}
@media (prefers-reduced-motion:reduce){.js main img{opacity:1}}

/* ---- Menü als Ausstellungsverzeichnis ---- */
:root{--nv-bg:#f3f1ec;--nv-ink:#1b1a18;--nv-mute:#8d8a83;--nv-line:#e2dfd8}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--nv-bg:#f3f1ec;--nv-ink:#1b1a18;--nv-mute:#7f7c75;--nv-line:#dcd9d2}}
:root[data-theme="dark"]{--nv-bg:#f3f1ec;--nv-ink:#1b1a18;--nv-mute:#7f7c75;--nv-line:#dcd9d2}
[hidden]{display:none!important}
html.nv-lock,html.nv-lock body{overflow:hidden}
.nv{position:fixed;inset:0;z-index:40;background:var(--nv-bg);color:var(--nv-ink);display:grid;grid-template-rows:auto minmax(0,1fr);
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);opacity:0;transition:opacity .3s ease;color-scheme:light}
.nv.open{opacity:1}
.nv :focus-visible{outline:1px solid var(--nv-ink);outline-offset:4px}
.nv-top{height:var(--hdr);display:flex;align-items:center;justify-content:space-between}
.nv-name{font:500 27px/1 var(--f-disp);letter-spacing:.01em;text-decoration:none}
.nv-close,.nv-back{appearance:none;border:0;background:none;color:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:10px}
.nv-close{width:44px;height:44px;justify-content:center;margin-right:-10px;color:var(--nv-mute)}
.nv-close:hover{color:var(--nv-ink)}
.nv-body{display:grid;grid-template-columns:minmax(0,1fr);min-height:0}
@media (min-width:900px){.nv-body{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(40px,6vw,120px)}}
.nv-left{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-block:clamp(24px,7vh,88px) 48px;
  transform:translateY(10px);transition:transform .4s ease}
.nv.open .nv-left{transform:none}
.nv ul,.nv ol{list-style:none;margin:0;padding:0}
.nv-main{display:grid;gap:clamp(10px,2.2vh,22px)}
.nv-item{appearance:none;border:0;background:none;padding:0;color:inherit;cursor:pointer;text-align:left;text-decoration:none;
  font:400 clamp(40px,5.4vw,76px)/1 var(--f-disp);letter-spacing:-.005em;display:inline-block;transition:transform .25s ease,color .25s ease}
.nv-item:hover,.nv-item:focus-visible{transform:translateX(6px);font-style:italic}
.nv-sub{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:clamp(40px,9vh,96px)!important;padding-top:18px!important;border-top:1px solid var(--nv-line)}
.nv-sub a{font:400 11px/1.4 var(--f-ui);letter-spacing:.16em;text-decoration:none;color:var(--nv-mute)}
.nv-sub a:hover,.nv-sub a:focus-visible{color:var(--nv-ink)}
.nv-back{font:400 11px/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;padding:12px 0;margin-bottom:clamp(16px,3vh,32px)}
.nv-back svg{width:18px;height:18px}
.nv-back:hover{color:var(--nv-mute)}
/* Werkverzeichnis */
.nv-list{border-top:1px solid var(--nv-line)}
.nv-row{display:grid;grid-template-columns:2.4em minmax(0,1fr) auto;align-items:baseline;gap:0 16px;padding:11px 0;border-bottom:1px solid var(--nv-line);text-decoration:none;color:inherit}
.nv-num{font:400 11px/1 var(--f-ui);color:var(--nv-mute);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.nv-title{font:400 clamp(19px,1.7vw,24px)/1.2 var(--f-disp);display:flex;align-items:baseline;gap:10px;transition:transform .25s ease}
.nv-title em{font-style:normal}
.nv-arrow{width:14px;height:14px;flex:none;opacity:0;transform:translateX(-4px);transition:opacity .25s ease,transform .25s ease;align-self:center}
.nv-year{font:400 12px/1 var(--f-ui);color:var(--nv-mute);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;min-width:6.5em}
.nv-row:hover .nv-title,.nv-row:focus-visible .nv-title{transform:translateX(5px)}
.nv-row:hover .nv-title em,.nv-row:focus-visible .nv-title em{font-style:italic}
.nv-row:hover .nv-arrow,.nv-row:focus-visible .nv-arrow{opacity:1;transform:none}
.nv-row:focus-visible{outline-offset:2px}
.nv-row.is-current .nv-num::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:#9b3b2a;margin-right:6px;vertical-align:middle}
.nv-thumb{display:none}
/* große Bildvorschau rechts */
.nv-preview{display:none}
@media (min-width:900px){
  .nv-preview{display:block;position:relative;margin-block:clamp(24px,7vh,88px) 48px}
  .nv-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:right top;opacity:0;transition:opacity .45s ease}
  .nv-img.on{opacity:1}
}
/* mobil: Thumbnails neben den Titeln */
@media (max-width:899px){
  .nv-row{grid-template-columns:56px 1.8em minmax(0,1fr) auto;gap:0 12px;align-items:center;padding:10px 0}
  .nv-thumb{display:block;width:56px;height:56px;object-fit:contain;object-position:center;background:transparent}
  .nv-year{min-width:0}
  .nv-arrow{display:none}
  .nv-item{font-size:clamp(40px,11vw,56px)}
  .nv-left{padding-top:0}
  .nv-main{padding-top:clamp(24px,6vh,64px)}
  .nv-back{position:sticky;top:0;background:var(--nv-bg);width:100%;z-index:1;margin-bottom:0;padding:20px 0 14px}
}
@media (prefers-reduced-motion:reduce){.nv,.nv-left,.nv-img,.nv-item,.nv-title,.nv-arrow{transition:none!important}.nv-left{transform:none}}

/* Sandfläche: Canvas liegt hinter allen Menüinhalten und fängt keine Eingaben ab */
.nv{background-color:var(--nv-bg);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .4 0 0 0 0 .33 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.nv-sand{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;display:block}
.nv-top,.nv-body{position:relative;z-index:1}

/* ---- Überschriften in dünnem Chrom-Silber mit leichter Tiefe ---- */
:root{--chrome:linear-gradient(180deg,#f4f5f7 0%,#b9bdc4 22%,#6e737b 46%,#d7dadf 54%,#8b9098 72%,#4f545b 100%)}
.chrome,.nv-item,.nv-name,.name a,.cv-title{
  background-image:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.85)) drop-shadow(0 -.5px 0 rgba(40,38,34,.35)) drop-shadow(0 3px 3px rgba(40,38,34,.14))}
.nv-item{font-weight:400}
.cv-title{width:fit-content}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .name a,:root:not([data-theme="light"]) .cv-title{filter:drop-shadow(0 -1px 0 rgba(255,255,255,.18)) drop-shadow(0 2px 2px rgba(0,0,0,.6))}}
:root[data-theme="dark"] .name a,:root[data-theme="dark"] .cv-title{filter:drop-shadow(0 -1px 0 rgba(255,255,255,.18)) drop-shadow(0 2px 2px rgba(0,0,0,.6))}
@media (forced-colors:active){.nv-item,.nv-name,.name a,.cv-title{-webkit-text-fill-color:currentColor;color:CanvasText;background:none;filter:none}}
/* Lichtschein, der über den Namen im Menü fährt */
.nv-name{background-image:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.95) 50%,transparent 58%),var(--chrome);
  background-size:300% 100%,100% 100%;background-repeat:no-repeat;background-position:120% 0,0 0;animation:nv-shine 6.5s ease-in-out 1s infinite}
@keyframes nv-shine{0%{background-position:120% 0,0 0}28%{background-position:-20% 0,0 0}100%{background-position:-20% 0,0 0}}
.nv-name:hover{animation-duration:2.2s}
@media (prefers-reduced-motion:reduce){.nv-name{animation:none;background-position:120% 0,0 0}}

/* Startseite: dasselbe Werk füllt unscharf den Hintergrund, das Bild selbst bleibt unverändert */
.hero{position:relative;overflow:hidden;isolation:isolate;margin-top:calc(-1 * var(--hdr));padding-top:calc(var(--hdr) + clamp(24px,5vh,56px))}
.hero-bg{position:absolute;inset:-60px;z-index:-1;background-size:cover;background-position:center;filter:blur(70px) saturate(1.15);opacity:.55;transform:scale(1.1)}
.hero-cap{position:relative}
.hdr{background:color-mix(in srgb,var(--paper) 40%,transparent)}
/* Archiv: laufende Nummer, nüchterne Angaben */
.arch-no{font:400 11px/1 ui-monospace,"SF Mono",Menlo,Consolas,monospace;letter-spacing:.12em;color:var(--mute);border-top:1px solid var(--line);padding-top:10px}
.caption p:not(.cap-title){font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:11.5px;letter-spacing:.02em}
/* Maßstab: Linie proportional zur größten Abmessung (500 cm = volle Länge) */
.scale{display:block;height:1px;width:calc(var(--s) * 160px);background:var(--ink);margin-top:12px;position:relative;opacity:.55}
.scale::before,.scale::after{content:"";position:absolute;top:-3px;width:1px;height:7px;background:var(--ink)}
.scale::before{left:0}.scale::after{right:0}
/* Materialindex */
.idx-bar{justify-content:space-between;align-items:flex-start;gap:16px}
.views{display:flex;gap:4px;flex:none}
.mats{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 14px;min-width:0}
.mat{appearance:none;border:0;background:none;padding:6px 0;cursor:pointer;color:var(--mute);font:400 11px/1.3 ui-monospace,"SF Mono",Menlo,Consolas,monospace;letter-spacing:.04em}
.mat:hover,.mat[aria-pressed="true"]{color:var(--ink)}
.mat[aria-pressed="true"]{text-decoration:underline;text-underline-offset:4px}
.tile.off{display:none}
.rows li.off{display:none}

/* ---- Raum für Raum: jedes Werk ein eigener Ausstellungsraum ---- */
html{scroll-snap-type:y proximity}
.works{gap:0;padding-block:0}
.work{min-height:100svh;scroll-snap-align:start;position:relative;isolation:isolate;align-content:center;
  padding-block:calc(var(--hdr) + 32px) 72px;--room:var(--paper);background:var(--room);box-shadow:0 0 0 100vmax var(--room);clip-path:inset(0 -100vmax)}
.work:nth-child(even){--room:var(--wall)}
.work::before{content:attr(data-no);position:absolute;z-index:-1;right:-.02em;top:calc(var(--hdr) + 4px);pointer-events:none;
  font:300 min(40vw,520px)/.75 var(--f-disp);letter-spacing:-.04em;background-image:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;opacity:.32}
.work .main-fig img{max-height:calc(100svh - var(--hdr) - 150px)}
.work .caption .cap-title{font-size:clamp(26px,2.6vw,40px)}
.work-nav{margin-top:8px}
.room-count{position:fixed;z-index:15;right:var(--gutr);bottom:calc(18px + env(safe-area-inset-bottom,0px));font:400 11px/1 ui-monospace,"SF Mono",Menlo,Consolas,monospace;letter-spacing:.14em;color:var(--mute);opacity:0;transition:opacity .4s;pointer-events:none}
.room-count.on{opacity:1}
.room-count b{font-weight:400;color:var(--ink)}
@media (max-width:899px){.work::before{font-size:56vw}}
@media (prefers-reduced-motion:reduce){html{scroll-snap-type:none}}


/* Nummern klein und zurückhaltend oben rechts */
.work::before{font:400 11px/1 ui-monospace,"SF Mono",Menlo,Consolas,monospace;letter-spacing:.14em;top:calc(var(--hdr) + 14px);right:0;opacity:.5;
  background:none;-webkit-text-fill-color:var(--mute);color:var(--mute);filter:none}
#glitch::before{opacity:.5;filter:none}
@media (max-width:899px){.work::before{font-size:11px}}
.arch-no{display:none}
.room-count{opacity:0!important}

/* Werktitel in dunklem, sattem Chrom */
:root{--chrome-dark:linear-gradient(180deg,#9aa0a8 0%,#4a4f57 30%,#1f2228 48%,#6a7079 56%,#2c3036 78%,#121418 100%)}
.caption .cap-title{background-image:var(--chrome-dark);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.7)) drop-shadow(0 2px 2px rgba(20,18,16,.18));width:fit-content}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .caption .cap-title{background-image:var(--chrome);filter:drop-shadow(0 2px 2px rgba(0,0,0,.6))}}
:root[data-theme="dark"] .caption .cap-title{background-image:var(--chrome);filter:drop-shadow(0 2px 2px rgba(0,0,0,.6))}
@media (forced-colors:active){.caption .cap-title{-webkit-text-fill-color:currentColor;color:CanvasText;background:none;filter:none}}

/* Seite bleibt immer hell – auch wenn das Handy im Dunkelmodus ist */
:root,:root[data-theme="dark"]{color-scheme:light;--paper:#fbfbf9;--ink:#1d1c1a;--mute:#8b8881;--line:#e7e5e0;--wall:#f2f1ed}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){color-scheme:light;--paper:#fbfbf9;--ink:#1d1c1a;--mute:#8b8881;--line:#e7e5e0;--wall:#f2f1ed}
  :root:not([data-theme="light"]) .name a,:root:not([data-theme="light"]) .cv-title{filter:drop-shadow(0 1px 0 rgba(255,255,255,.85)) drop-shadow(0 -.5px 0 rgba(40,38,34,.35)) drop-shadow(0 3px 3px rgba(40,38,34,.14))}
  :root:not([data-theme="light"]) .caption .cap-title{background-image:var(--chrome-dark);filter:drop-shadow(0 1px 0 rgba(255,255,255,.7)) drop-shadow(0 2px 2px rgba(20,18,16,.18))}}
:root[data-theme="dark"] .name a,:root[data-theme="dark"] .cv-title{filter:drop-shadow(0 1px 0 rgba(255,255,255,.85)) drop-shadow(0 -.5px 0 rgba(40,38,34,.35)) drop-shadow(0 3px 3px rgba(40,38,34,.14))}
:root[data-theme="dark"] .caption .cap-title{background-image:var(--chrome-dark);filter:drop-shadow(0 1px 0 rgba(255,255,255,.7)) drop-shadow(0 2px 2px rgba(20,18,16,.18))}
