@font-face{font-family:"Bodoni Moda";src:url(/fonts/bodoni-moda-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Bodoni Moda";src:url(/fonts/bodoni-moda-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Bodoni Moda";src:url(/fonts/bodoni-moda-latin-500-normal.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url(/fonts/hanken-grotesk-latin-300-normal.woff2) format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url(/fonts/hanken-grotesk-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url(/fonts/hanken-grotesk-latin-600-normal.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}

/* Layout: Galeriewand. Werke stehen allein, mit viel Wand, Text daneben wie ein Werkschild. Markenwelt Eve Loreen. */
:root{
  --grund:#efebe3; --grund-hell:#f8f5ef; --haarlinie:#c9c1b4; --tinte:#1f2a27; --tinte-leise:#55605b;
  --petrol:#374846; --petrol-tief:#1f2a27; --auf-petrol:#efebe3; --nebel:#8c948e; --oxid:#9b3e20; --ocker:#b17e4a; --blattgold:#b8954f;
  --font-display:"Bodoni Moda","Didot","Bodoni 72",Georgia,serif;
  --font-text:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;
  --r1:4px;--r2:8px;--r3:16px;--r4:24px;--r5:40px;--r6:64px;--r7:104px;--r8:168px;
  --breite:1240px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --grund:#1a2220; --grund-hell:#232d2a; --haarlinie:#3d4946; --tinte:#ede7dc; --tinte-leise:#a6aea8;
  --petrol:#4f6663; --petrol-tief:#121816; --auf-petrol:#efebe3; --nebel:#6f7974; --oxid:#dc8462; --ocker:#c89463; --blattgold:#cdae6c; color-scheme:dark}}
:root[data-theme="dark"]{
  --grund:#1a2220; --grund-hell:#232d2a; --haarlinie:#3d4946; --tinte:#ede7dc; --tinte-leise:#a6aea8;
  --petrol:#4f6663; --petrol-tief:#121816; --auf-petrol:#efebe3; --nebel:#6f7974; --oxid:#dc8462; --ocker:#c89463; --blattgold:#cdae6c; color-scheme:dark}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{background:var(--grund);color:var(--tinte);font-family:var(--font-text);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--grund)}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:var(--breite);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
@media (min-width:760px){.wrap{padding-left:max(40px,env(safe-area-inset-left,0px));padding-right:max(40px,env(safe-area-inset-right,0px))}}
.label{font-size:11px;line-height:1.4;font-weight:600;letter-spacing:.22em;text-transform:uppercase}
.angabe{font-size:13px;line-height:1.5;color:var(--tinte-leise)}
.lead{font-size:clamp(17px,1.6vw,20px);line-height:1.55;font-weight:300}
.disp{font-family:var(--font-display);font-weight:400;text-wrap:balance}
.werktitel{font-family:var(--font-display);font-style:italic;font-weight:400}
.nr{color:var(--oxid);font-variant-numeric:tabular-nums}
:focus-visible{outline:2px solid var(--oxid);outline-offset:3px}
.akz{fill:var(--oxid)} .hl{fill:var(--haarlinie)}

/* Kopf */
header.kopf{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--grund);border-bottom:1px solid var(--haarlinie)}
.kopf .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--r4);padding-block:14px}
.kopf .lockup{height:44px;width:auto;color:var(--tinte)}
.kopf nav{display:flex;align-items:center;gap:var(--r5)}
.kopf nav a{text-decoration:none;padding-block:6px;border-bottom:3px solid transparent}
.kopf nav a:hover{border-color:var(--haarlinie)}
.kopf nav a.on{border-color:var(--oxid)}
.anfrage-knopf{font:inherit;cursor:pointer;background:var(--tinte);color:var(--grund);border:0;padding:10px 16px;display:inline-flex;gap:10px;align-items:center}
.anfrage-knopf .zahl{font-variant-numeric:tabular-nums;letter-spacing:0;min-width:20px;height:20px;padding:0 6px;border-radius:9999px;background:var(--oxid);color:var(--grund-hell);display:inline-flex;align-items:center;justify-content:center;font-size:11px}
@media (max-width:900px){
  .kopf .wrap{flex-wrap:wrap;row-gap:8px}
  .kopf nav{order:3;width:100%;gap:14px;overflow-x:auto;padding-bottom:2px;letter-spacing:.12em;justify-content:space-between}
  .kopf nav a{white-space:nowrap}
}
@media (max-width:420px){
  .kopf nav a[data-nav="kaufen"]{display:none}
  .kopf .wrap{column-gap:12px}
  .kopf .lockup{height:29px}
  .anfrage-knopf{padding:9px 12px;gap:8px}
  .kopf .lockup{height:36px}
}

/* Einstieg */
.hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:var(--r6);align-items:end;padding-block:var(--r7) var(--r6)}
.hero .kicker{color:var(--tinte-leise);margin-bottom:var(--r4)}
.hero h1{font-size:clamp(52px,8.4vw,112px);line-height:.95;letter-spacing:-.01em;margin:0 0 var(--r5)}
.hero .lead{max-width:30em;margin:0 0 var(--r5)}
.pfeil{display:inline-flex;align-items:center;gap:10px;text-decoration:none;border-bottom:1px solid var(--tinte);padding-bottom:4px}
.pfeil::after{content:"\2192";color:var(--oxid);font-size:15px;letter-spacing:0}
.hero figure{margin:0;min-width:0}
.hero figure img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;max-height:78vh}
.hero figcaption{margin-top:var(--r2)}
@media (max-width:760px){.hero .wrap{grid-template-columns:minmax(0,1fr);padding-block:var(--r6) var(--r5);gap:var(--r5)}}

/* Abschnitte */
section{scroll-margin-top:90px}
.kapitel{border-top:1px solid var(--haarlinie);padding-block:var(--r7) var(--r5)}
.kapitel-kopf{display:flex;justify-content:space-between;align-items:end;gap:var(--r4);flex-wrap:wrap;margin-bottom:var(--r6)}
.kapitel-kopf h2{font-size:clamp(40px,5vw,60px);line-height:1;margin:var(--r3) 0 0}
.kapitel-kopf .label{color:var(--tinte-leise)}
.filter{display:flex;gap:var(--r2)}
.filter button{font:inherit;cursor:pointer;background:transparent;color:var(--tinte);border:1px solid var(--haarlinie);padding:8px 14px}
.filter button[aria-pressed="true"]{border-color:var(--tinte);background:var(--tinte);color:var(--grund)}

/* Werke */
.werkliste{display:flex;flex-direction:column;gap:var(--r8)}
.werk{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:var(--r6);align-items:end}
.werk:nth-child(even){grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)}
.werk:nth-child(even) .bildflaeche{order:2}
.bildflaeche{background:var(--grund-hell);padding:clamp(16px,4vw,56px);display:flex;justify-content:center;cursor:zoom-in;border:0;font:inherit;width:100%}
.bildflaeche img{max-height:72vh;width:auto;object-fit:contain;box-shadow:0 1px 0 var(--haarlinie)}
.schild{display:flex;flex-direction:column;gap:var(--r2);max-width:26em}
.schild .werktitel{font-size:clamp(26px,2.6vw,34px);line-height:1.15;margin:0}
.schild p{margin:var(--r2) 0 0}
.preiszeile{display:flex;align-items:baseline;justify-content:space-between;gap:var(--r3);border-top:1px solid var(--haarlinie);margin-top:var(--r4);padding-top:var(--r3)}
.preis{font-family:var(--font-display);font-size:24px;font-variant-numeric:lining-nums tabular-nums}
.status{display:inline-flex;align-items:center;gap:8px}
.status::before{content:"";width:8px;height:8px;border-radius:9999px;background:var(--petrol)}
.status.res::before{background:var(--ocker)}
.status.privat::before{background:var(--nebel)}
.privathinweis{color:var(--tinte-leise);font-size:15px}
.aktionen{display:flex;gap:var(--r3);flex-wrap:wrap;margin-top:var(--r3)}
.knopf{font:inherit;cursor:pointer;border:1px solid var(--tinte);background:transparent;color:var(--tinte);padding:12px 18px;text-decoration:none;display:inline-flex;align-items:center;gap:10px}
.knopf.voll{background:var(--tinte);color:var(--grund)}
.knopf[aria-pressed="true"]{background:var(--oxid);border-color:var(--oxid);color:var(--grund-hell)}
.knopf:hover{border-color:var(--oxid)}
@media (max-width:760px){
  .werk,.werk:nth-child(even){grid-template-columns:minmax(0,1fr);gap:var(--r4)}
  .werk:nth-child(even) .bildflaeche{order:0}
  .werkliste{gap:var(--r7)}
}

/* Material */
.material{background:var(--petrol-tief);color:var(--auf-petrol)}
.material .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--r6);align-items:center;padding-block:var(--r7)}
.material .ausschnitt{aspect-ratio:1/1;background:url(/werke/strauss-1800.webp) 46% 44%/290% auto no-repeat;max-width:100%}
.material blockquote{margin:0;font-family:var(--font-display);font-style:italic;font-size:clamp(28px,3.4vw,44px);line-height:1.2;text-wrap:balance}
.material .label{color:var(--blattgold);margin-bottom:var(--r4)}
.material p.lead{margin:var(--r5) 0 0;max-width:28em;opacity:.92}
@media (max-width:760px){.material .wrap{grid-template-columns:minmax(0,1fr);padding-block:var(--r6)}}

/* Editionen */
.editionen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--r5)}
.edition{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr);gap:var(--r4);align-items:start;border-top:1px solid var(--haarlinie);padding-top:var(--r4)}
.edition img{background:var(--grund-hell);padding:10px}
.edition h3{margin:var(--r2) 0 var(--r1);font-size:24px}
.edition .preiszeile{margin-top:var(--r3)}
@media (max-width:760px){.editionen{grid-template-columns:minmax(0,1fr)}.edition{grid-template-columns:minmax(0,96px) minmax(0,1fr)}}

/* Auftrag */
.auftrag{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--r6)}
.auftrag .disp{font-size:clamp(30px,3.4vw,42px);line-height:1.15;margin:0}
.auftrag ul{list-style:none;margin:var(--r4) 0 0;padding:0;display:grid;gap:0}
.auftrag li{display:flex;justify-content:space-between;gap:var(--r3);border-top:1px solid var(--haarlinie);padding-block:14px}
.auftrag li:last-child{border-bottom:1px solid var(--haarlinie)}
@media (max-width:760px){.auftrag{grid-template-columns:minmax(0,1fr);gap:var(--r5)}}

/* Kaufablauf */
.schritte{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--r5);counter-reset:s}
.schritte li{counter-increment:s;border-top:1px solid var(--tinte);padding-top:var(--r3)}
.schritte li::before{content:counter(s);font-family:var(--font-display);font-size:44px;line-height:1;display:block;margin-bottom:var(--r3);color:var(--oxid)}
.schritte h3{font-size:16px;font-weight:600;margin:0 0 var(--r2)}
.schritte p{margin:0;color:var(--tinte-leise);font-size:15px}
.zusicherung{margin-top:var(--r6);display:flex;flex-wrap:wrap;gap:var(--r2) var(--r5);color:var(--tinte-leise)}
@media (max-width:900px){.schritte{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.schritte{grid-template-columns:minmax(0,1fr)}}

/* Atelier und Kontakt */
.atelier{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1fr);gap:var(--r6);align-items:end}
.portrait{margin:0;background:var(--grund-hell);padding:clamp(12px,2.4vw,32px)}
.portrait img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.atelier .text{max-width:34em;min-width:0}
.atelier .text h2{font-size:clamp(40px,5vw,60px);line-height:1;margin:var(--r3) 0 var(--r5)}
.atelier .text p{margin:0 0 var(--r3)}
.warum{background:var(--grund-hell);border-top:1px solid var(--haarlinie);border-bottom:1px solid var(--haarlinie)}
.warum .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:var(--r5) var(--r6);padding-block:var(--r7)}
.warum-kopf .label{color:var(--oxid)}
.warum-kopf h2{font-family:var(--font-display);font-style:italic;font-weight:400;font-size:clamp(36px,4.4vw,56px);line-height:1.05;margin:var(--r3) 0 0}
.warum-text{max-width:36em;min-width:0}
.warum-text p{margin:0 0 var(--r4);font-size:clamp(16px,1.4vw,18px);line-height:1.7}
.warum-text p:first-child::first-letter{font-family:var(--font-display);font-size:4.2em;line-height:.8;float:left;margin:.06em .1em 0 0;color:var(--oxid)}
.warum-satz{grid-column:1/-1;margin:var(--r5) 0 0;border-top:1px solid var(--haarlinie);padding-top:var(--r5);font-family:var(--font-display);font-style:italic;font-size:clamp(30px,4.6vw,64px);line-height:1.1;text-wrap:balance;display:flex;flex-direction:column;gap:var(--r3)}
.warum-satz .label{font-family:var(--font-text);font-style:normal;color:var(--tinte-leise)}
.kontakt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--r6);align-items:end}
.adresse{font-family:var(--font-display);font-size:clamp(26px,3.2vw,40px);user-select:all;overflow-wrap:anywhere}
@media (max-width:760px){.atelier,.kontakt,.warum .wrap{grid-template-columns:minmax(0,1fr);gap:var(--r5)}.warum .wrap{padding-block:var(--r6)}}

.rechtlich{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--r6)}
.rechtlich h2{font-size:clamp(32px,3.6vw,44px);line-height:1;margin:var(--r3) 0 0}
.rtext address{font-style:normal;margin:var(--r3) 0}
.rtext p{margin:0 0 var(--r2)}
@media (max-width:760px){.rechtlich{grid-template-columns:minmax(0,1fr);gap:var(--r4)}}
footer{border-top:1px solid var(--haarlinie);margin-top:0}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--r3);padding-block:var(--r5)}
footer nav{display:flex;gap:var(--r4);flex-wrap:wrap}
footer a{text-decoration:none}
footer a:hover{text-decoration:underline}

/* Dialoge */
dialog{border:0;padding:0;background:var(--grund);color:var(--tinte);max-width:100vw;max-height:100dvh}
dialog::backdrop{background:rgba(18,24,22,.72)}
.schliessen{font:inherit;cursor:pointer;background:transparent;border:0;color:var(--tinte);padding:8px;display:inline-flex;gap:8px;align-items:center;white-space:nowrap;flex:none}
#werkdialog{width:min(1180px,100vw);height:min(860px,100dvh)}
#werkdialog .innen{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);height:100%}
#werkdialog .bilder{background:var(--grund-hell);display:flex;flex-direction:column;min-height:0}
#werkdialog .bildhaupt{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:var(--r5)}
#werkdialog .bildhaupt img{max-height:100%;width:auto;object-fit:contain}
#werkdialog .daumen{display:flex;gap:var(--r2);padding:0 var(--r5) var(--r4)}
#werkdialog .daumen button{border:1px solid transparent;padding:0;background:none;cursor:pointer;width:64px;height:64px}
#werkdialog .daumen button[aria-current="true"]{border-color:var(--oxid)}
#werkdialog .daumen img{width:100%;height:100%;object-fit:cover}
#werkdialog .info{padding:var(--r5);overflow:auto;display:flex;flex-direction:column;gap:var(--r2);padding-bottom:max(var(--r5),env(safe-area-inset-bottom,0px))}
#werkdialog .info h2{font-size:clamp(30px,3vw,40px);line-height:1.1;margin:var(--r2) 0 0}
#werkdialog dl{display:grid;grid-template-columns:auto 1fr;gap:6px var(--r4);margin:var(--r4) 0 0}
#werkdialog dt{color:var(--tinte-leise)}
#werkdialog dd{margin:0}
@media (max-width:760px){
  #werkdialog{width:100vw;height:100dvh}
  #werkdialog .innen{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,55%) auto;overflow:auto}
  #werkdialog .bildhaupt{padding:var(--r3)}
}
#anfrage{margin:0 0 0 auto;width:min(480px,100vw);height:100dvh;max-height:100dvh}
#anfrage .innen{display:flex;flex-direction:column;height:100%;padding:max(var(--r4),env(safe-area-inset-top,0px)) max(var(--r4),env(safe-area-inset-right,0px)) max(var(--r4),env(safe-area-inset-bottom,0px)) var(--r4);overflow:auto;gap:var(--r4)}
.dkopf{display:flex;justify-content:space-between;align-items:center}
.dkopf h2{font-family:var(--font-display);font-weight:400;font-size:32px;margin:0}
.posten{list-style:none;margin:0;padding:0}
.posten li{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:var(--r3);align-items:center;border-top:1px solid var(--haarlinie);padding-block:12px}
.posten li:last-child{border-bottom:1px solid var(--haarlinie)}
.posten img{width:56px;height:56px;object-fit:cover}
.posten .weg{font:inherit;font-size:13px;cursor:pointer;background:none;border:0;color:var(--tinte-leise);text-decoration:underline}
.summe{display:flex;justify-content:space-between;font-variant-numeric:tabular-nums}
.af-frage{margin:0 0 var(--r2)}
.af-opt{font-weight:400;letter-spacing:.08em;text-transform:none;color:var(--tinte-leise);font-size:12px;margin-left:6px}
.wahl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--r2)}
.wahl button{font:inherit;cursor:pointer;display:grid;grid-template-columns:44px minmax(0,1fr);gap:10px;align-items:center;text-align:left;background:var(--grund-hell);color:var(--tinte);border:1px solid var(--haarlinie);padding:6px}
.wahl button:hover{border-color:var(--tinte)}
.wahl img{width:44px;height:44px;object-fit:cover}
.wahl span{font-family:var(--font-display);font-style:italic;font-size:15px;line-height:1.2}
fieldset.feld{border:0;padding:0;margin:0}
fieldset.feld legend{padding:0;margin-bottom:6px}
.segment{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--haarlinie)}
.segment input{position:absolute;opacity:0;pointer-events:none}
.segment label{text-align:center;padding:12px 8px;cursor:pointer;background:var(--grund-hell)}
.segment label+input+label{border-left:1px solid var(--haarlinie)}
.segment input:checked+label{background:var(--tinte);color:var(--grund)}
.segment input:focus-visible+label{outline:2px solid var(--oxid);outline-offset:-2px}
.mehr summary{cursor:pointer;color:var(--tinte-leise);font-size:14px;text-decoration:underline;text-underline-offset:3px;list-style:none}
.mehr summary::-webkit-details-marker{display:none}
.mehr[open] summary{margin-bottom:var(--r3)}
.knopf.senden{width:100%;justify-content:center;padding-block:15px}
.ergebnis-titel{font-size:30px}
.haken{display:flex;gap:12px;align-items:flex-start;font-size:15px;cursor:pointer}
.haken input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--oxid);flex:none}
.sammlung{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--r5)}
.sammlung article{display:grid;grid-template-columns:minmax(0,180px) minmax(0,1fr);gap:var(--r4);align-items:end}
.sammlung .bildflaeche{padding:14px}
.sammlung .bildflaeche img{max-height:240px}
.sammlung .werktitel{font-size:24px;margin:var(--r1) 0}
.sammlung .werktitel a{text-decoration:none}.sammlung .werktitel a:hover{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.sammlung p{margin:var(--r2) 0 0}
.vormerken{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:var(--r6);align-items:end}
.h2gross-inline{font-size:clamp(40px,5vw,60px);line-height:1;margin:var(--r3) 0 0}
.vormerken .lead{margin:0 0 var(--r4);max-width:32em}
.vita{list-style:none;margin:var(--r4) 0;padding:0;border-top:1px solid var(--haarlinie)}
.vita li{display:grid;grid-template-columns:120px minmax(0,1fr);gap:var(--r3);padding-block:10px;border-bottom:1px solid var(--haarlinie);font-size:15px}
.vita .label{padding-top:3px}
@media (max-width:760px){.sammlung,.vormerken{grid-template-columns:minmax(0,1fr)}.sammlung article{grid-template-columns:minmax(0,130px) minmax(0,1fr)}.vita li{grid-template-columns:minmax(0,1fr);gap:2px}}
.fehler:empty{display:none}
#af-summe{margin-top:var(--r3)}
.ergebnis .knopf{justify-content:center}
@media (max-width:480px){.dkopf h2{font-size:26px}.s-text{display:none}.schliessen{font-size:18px;padding:8px 4px 8px 12px}}
form{display:grid;gap:var(--r3)}
.feld{display:grid;gap:6px}
.feld input,.feld textarea,.feld select{font:inherit;font-size:16px;color:var(--tinte);background:var(--grund-hell);border:1px solid var(--haarlinie);border-radius:2px;padding:13px 14px;width:100%}
.feld input:focus,.feld textarea:focus{outline:none;border-color:var(--tinte)}
.feld input:-webkit-autofill,.feld input:-webkit-autofill:hover,.feld input:-webkit-autofill:focus{-webkit-text-fill-color:var(--tinte);caret-color:var(--tinte);-webkit-box-shadow:0 0 0 100px var(--grund-hell) inset;box-shadow:0 0 0 100px var(--grund-hell) inset;transition:background-color 9999s}
.feld textarea{min-height:96px;resize:vertical}
.fehler{color:var(--oxid);font-size:13px;min-height:1em}
.ergebnis{background:var(--grund-hell);border:1px solid var(--haarlinie);padding:var(--r4);display:grid;gap:var(--r3)}
.ergebnis pre{white-space:pre-wrap;font:13px/1.55 var(--font-text);margin:0;max-height:220px;overflow:auto;user-select:all}
.ergebnis .zeile{display:flex;gap:var(--r2);flex-wrap:wrap}
.hinweis{font-size:13px;color:var(--tinte-leise)}
.schwebe{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:max(16px,env(safe-area-inset-bottom,0px));z-index:15;box-shadow:0 0 0 1px var(--grund)}

.leise{color:var(--tinte-leise)} .gr18{font-size:18px} .gr20{font-size:20px}
.h2gross{font-size:clamp(40px,5vw,60px);line-height:1}
.h2gross.mb4{margin:var(--r3) 0 var(--r4)} .h2gross.mb5{margin:var(--r3) 0 var(--r5)}
.bildzeile{margin-top:var(--r2);opacity:.8} .m0{margin:0} .mt3{margin:var(--r3) 0 0}
.kapitel-notiz{max-width:30em;margin:0}
.titel-klein{text-transform:none;letter-spacing:0;font-family:var(--font-display);font-size:14px;font-weight:400}
.markierbar{user-select:all} .platzhalter{display:block;width:56px;height:56px;background:var(--petrol)}
.preisfuss{margin-top:var(--r5);max-width:46em}
.skip{position:absolute;left:-9999px;top:0;z-index:50;background:var(--tinte);color:var(--grund);padding:10px 16px}
.skip:focus{left:max(16px,env(safe-area-inset-left,0px));top:calc(env(safe-area-inset-top,0px) + 8px)}

.schild .werktitel a{text-decoration:none}
.schild .werktitel a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.werkfuss{display:flex;flex-wrap:wrap;gap:6px var(--r4);width:100%;order:3}
.werkfuss a{text-decoration:none}.werkfuss a:hover{text-decoration:underline}
/* Werkseite */
.krumen{display:flex;gap:10px;padding-block:var(--r4) 0}
.krumen a{text-decoration:none}.krumen a:hover{text-decoration:underline}
.werk-gross{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:var(--r6);align-items:end;padding-block:var(--r5) var(--r6)}
.werk-gross figure{margin:0;background:var(--grund-hell);padding:clamp(16px,4vw,56px);display:flex;justify-content:center}
.werk-gross figure img{max-height:78vh;width:auto;height:auto}
.werk-gross h1{font-size:clamp(34px,4vw,52px);line-height:1.08;margin:var(--r2) 0 var(--r2)}
.werk-gross .schild p{margin:var(--r3) 0 0}
.werk-material{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--r6);align-items:center;border-top:1px solid var(--haarlinie);padding-block:var(--r6)}
.werk-material figure{margin:0}
.werk-material img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.werk-material h2,.werk-weitere h2,.werk-edition h2{font-family:var(--font-display);font-weight:400;font-size:clamp(28px,3vw,38px);line-height:1.1;margin:0 0 var(--r3)}
.werk-material.ohne-bild{grid-template-columns:minmax(0,1fr)}
.werk-material.ohne-bild>div{max-width:40em}
.werkdaten{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--r4);border-top:1px solid var(--haarlinie);padding-block:var(--r5);margin:0}
.werkdaten div{display:grid;gap:4px}
.werkdaten dt{color:var(--tinte-leise)}
.werkdaten dd{margin:0}
.werk-edition{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--r4);align-items:center;background:var(--grund-hell);border:1px solid var(--haarlinie);padding:var(--r5);margin-block:var(--r3) var(--r6)}
.werk-edition p{margin:0;max-width:36em}
.werk-weitere{border-top:1px solid var(--haarlinie);padding-block:var(--r6) var(--r7)}
.werk-weitere .reihe{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--r5)}
.werk-weitere a{text-decoration:none;display:grid;gap:6px}
.werk-weitere img{width:100%;height:240px;object-fit:contain;object-position:left bottom;background:var(--grund-hell);padding:12px}
.werk-weitere .werktitel{font-size:20px}
.werk-raum{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:var(--r6);align-items:center;border-top:1px solid var(--haarlinie);padding-block:var(--r6)}
.werk-raum h2{font-family:var(--font-display);font-weight:400;font-size:clamp(28px,3vw,38px);line-height:1.1;margin:var(--r2) 0 var(--r3)}
.werk-raum figure{margin:0}
.werk-raum svg{width:100%;height:auto;display:block}
.r-wand{fill:var(--grund-hell)} .r-boden{fill:var(--haarlinie)} .r-sofa{fill:var(--nebel)} .r-sofa2{fill:var(--petrol)} .r-fuss{fill:var(--tinte)}
.r-rahmen{fill:none;stroke:var(--tinte);stroke-width:.4}
@media (max-width:760px){.werk-raum{grid-template-columns:minmax(0,1fr);gap:var(--r4)}}
@media (max-width:760px){
 .werk-gross,.werk-material{grid-template-columns:minmax(0,1fr);gap:var(--r4)}
 .werkdaten{grid-template-columns:repeat(2,minmax(0,1fr))}
 .werk-edition{grid-template-columns:minmax(0,1fr)}
 .werk-weitere .reihe{grid-template-columns:minmax(0,1fr)}
 .werk-weitere img{height:auto;max-height:320px}
}

.rechtsseite .wrap{padding-block:var(--r7);max-width:820px}
.rechtsseite h1{font-family:var(--font-display);font-weight:400;font-size:clamp(40px,5vw,60px);line-height:1;margin:var(--r3) 0 var(--r5)}
.rechtsseite h2{font-family:var(--font-display);font-weight:400;font-size:24px;margin:var(--r5) 0 var(--r2)}
.rechtsseite p,.rechtsseite li{max-width:42em}
.rechtsseite address{font-style:normal;margin:var(--r3) 0}
a.anfrage-knopf{text-decoration:none}