
/* Layout: Leineneinband oben (Regal mit Buchrücken als Signatur), darunter weißes Papier mit linksbündigem Satzspiegel, Verzeichnis wie ein gedrucktes Verlagsprogramm. */
:root{
  --paper:#fdfbfb; --paper-2:#f5eff0; --ink:#241a1d; --muted:#6c5d62; --line:#e5dadd;
  --cloth:#6b1c2a; --cloth-deep:#4f1320; --cloth-ink:#f8ecee; --cloth-muted:#dcbfc5;
  --foil:#a8813a; --plank:#3a2a20; --link:#7a1f30;
  --f-text:"Literata", Georgia, "Times New Roman", serif;
  --f-ui:"Archivo", "Helvetica Neue", Arial, sans-serif;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:72px; --s9:112px;
  --wrap:1180px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --paper:#161113; --paper-2:#1f181a; --ink:#f1e8ea; --muted:#b7a6ab; --line:#3a2e32;
  --cloth:#521522; --cloth-deep:#3a0e18; --cloth-ink:#f6e7ea; --cloth-muted:#d2b2b9;
  --foil:#cfa95f; --plank:#120c0a; --link:#e5a3b0; color-scheme:dark}}
:root[data-theme="dark"]{
  --paper:#161113; --paper-2:#1f181a; --ink:#f1e8ea; --muted:#b7a6ab; --line:#3a2e32;
  --cloth:#521522; --cloth-deep:#3a0e18; --cloth-ink:#f6e7ea; --cloth-muted:#d2b2b9;
  --foil:#cfa95f; --plank:#120c0a; --link:#e5a3b0; color-scheme:dark}

*{box-sizing:border-box}
[hidden]{display:none!important}
body{background:var(--paper); color:var(--ink); font-family:var(--f-text); font-size:18px; line-height:1.6; font-optical-sizing:auto}
body::before{content:""; position:fixed; inset:0 0 auto; height:env(safe-area-inset-top,0px); z-index:10; background:var(--cloth)}
a{color:var(--link); text-underline-offset:3px; text-decoration-thickness:1px}
a:focus-visible, button:focus-visible{outline:3px solid var(--foil); outline-offset:3px; border-radius:2px}
.wrap{max-width:var(--wrap); margin:0 auto; padding-left:max(16px, env(safe-area-inset-left,0px)); padding-right:max(16px, env(safe-area-inset-right,0px))}
h1,h2,h3,h4{font-weight:600; line-height:1.12; text-wrap:balance; margin:0}
p{margin:0}
.skip{position:absolute; left:-999px; top:0; background:var(--ink); color:var(--paper); padding:8px 12px; z-index:20}
.skip:focus{left:16px}

/* Kopf */
.top{background:var(--cloth); color:var(--cloth-ink); position:sticky; top:env(safe-area-inset-top,0px); z-index:5; border-bottom:1px solid color-mix(in srgb, var(--cloth-ink) 14%, transparent)}
.top .wrap{display:flex; align-items:center; justify-content:space-between; gap:var(--s5); padding-block:var(--s3)}
.brand{display:flex; align-items:center; gap:var(--s3); color:inherit; text-decoration:none}
.brand i{width:42px; height:37px; background:var(--cloth-ink)}}) center/contain no-repeat; mask:url(data:image/png;base64,{{MARK}}) center/contain no-repeat}
.brand b{font-family:var(--f-text); font-weight:700; font-size:21px; letter-spacing:.06em}
.nav{display:flex; gap:var(--s5); font-family:var(--f-ui); font-size:15px; font-stretch:90%}
.nav a{color:var(--cloth-ink); text-decoration:none; padding-block:10px}
.nav a:hover{text-decoration:underline}

/* Leinen-Band mit Regal */
.cloth{background:
  repeating-linear-gradient(0deg, color-mix(in srgb, #000 7%, transparent) 0 1px, transparent 1px 3px),
  repeating-linear-gradient(90deg, color-mix(in srgb, #fff 4%, transparent) 0 1px, transparent 1px 4px),
  var(--cloth); color:var(--cloth-ink)}
.hero{display:grid; grid-template-columns:minmax(0,7fr) minmax(0,4fr); gap:var(--s7); padding-block:var(--s8) var(--s7); align-items:end}
.hero h1{font-size:clamp(40px, 6.2vw, 78px); font-weight:600; letter-spacing:-.015em; line-height:1.02; font-variation-settings:"opsz" 72}
.hero .lead{font-size:20px; color:var(--cloth-muted); max-width:34em}
.hero .lead strong{color:var(--cloth-ink); font-weight:600}
.btn{display:inline-flex; align-items:center; min-height:48px; padding:0 22px; font-family:var(--f-ui); font-weight:600; font-size:16px; text-decoration:none; border-radius:2px}
.btn-foil{background:var(--foil); color:#1d1408; margin-top:var(--s5)}
.btn-foil:hover{filter:brightness(1.08)}
.shelf-wrap{padding-bottom:var(--s6)}
.shelf-scroll{overflow-x:auto; overflow-y:hidden; scrollbar-width:thin; padding-top:28px}
.shelf{display:flex; align-items:flex-end; gap:22px; height:262px; min-width:max-content; padding-inline:2px}
.shelf-group{display:flex; align-items:flex-end; gap:3px; height:100%}
.spine{--w:31px; position:relative; display:flex; flex-direction:column; justify-content:space-between; align-items:center; width:var(--w); height:var(--h); background:var(--c); color:var(--t);
  text-decoration:none; padding:14px 0 10px; border-radius:2px 2px 0 0;
  box-shadow:inset 3px 0 0 color-mix(in srgb,#fff 16%,transparent), inset -4px 0 0 color-mix(in srgb,#000 22%,transparent);
  transition:transform .18s ease}
.spine::before,.spine::after{content:""; position:absolute; left:5px; right:5px; height:1px; background:color-mix(in srgb, var(--t) 45%, transparent)}
.spine::before{top:8px} .spine::after{bottom:10px}
.spine span{writing-mode:vertical-rl; transform:rotate(180deg); font-family:var(--f-ui); font-stretch:80%; font-weight:600; font-size:12.5px; line-height:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-height:calc(100% - 30px)}
.spine small{font-family:var(--f-ui); font-stretch:75%; font-size:8.5px; letter-spacing:.02em; opacity:.85; writing-mode:vertical-rl; transform:rotate(180deg); max-height:22px; overflow:hidden}
.spine:hover,.spine:focus-visible{transform:translateY(-18px)}
.plank{height:14px; background:linear-gradient(var(--plank), color-mix(in srgb, var(--plank) 70%, #000)); box-shadow:0 6px 12px -6px #000a; min-width:max-content}
.shelf-note{font-family:var(--f-ui); font-size:15px; color:var(--cloth-muted); margin-top:var(--s3); min-height:1.6em}

/* Abschnitte */
.sec{padding-block:var(--s9) var(--s8)}
.sec h2{font-size:clamp(30px, 3.6vw, 44px); letter-spacing:-.01em}
.sec .intro{color:var(--muted); max-width:38em; margin-top:var(--s3)}
.tint{background:var(--paper-2)}
.cv{display:block; width:100%; height:auto; aspect-ratio:5/8; object-fit:cover; max-width:100%; box-shadow:0 1px 0 var(--line), 6px 8px 0 -2px color-mix(in srgb, var(--ink) 8%, transparent)}
.cv-type{container-type:inline-size; display:flex; flex-direction:column; justify-content:space-between; padding:14% 10%; background:var(--c); color:var(--t); font-family:var(--f-ui); font-weight:700; line-height:1.1}
.cv-type span{font-size:15cqi} .cv-type small{font-weight:500; font-size:8cqi}

/* Neu */
.neu{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:var(--s8); margin-top:var(--s7); align-items:start}
.feat{display:grid; grid-template-columns:minmax(0,200px) minmax(0,1fr); gap:var(--s5); align-items:start}
.feat h3{font-size:28px} .feat .sub{color:var(--muted); font-style:italic; margin-top:var(--s2)}
.feat p.d{margin-top:var(--s3)}
.feat .when{font-family:var(--f-ui); font-size:14px; color:var(--muted); margin-bottom:var(--s2)}
.neu-list{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:var(--s6) var(--s4)}
.neu-item{display:grid; gap:var(--s3); text-decoration:none; color:var(--ink)}
.neu-item strong{display:block; font-size:16px; line-height:1.3; font-weight:600}
.neu-item em{display:block; font-family:var(--f-ui); font-style:normal; font-size:14px; color:var(--muted); margin-top:2px}
.neu-item:hover strong{text-decoration:underline; text-underline-offset:3px}

/* Verhandeln */
.vh{display:grid; grid-template-columns:minmax(0,4fr) minmax(0,8fr); gap:var(--s8); margin-top:var(--s7)}
.vh-who p+p{margin-top:var(--s4)}
.vh-who .note{font-family:var(--f-ui); font-size:15px; color:var(--muted); border-top:1px solid var(--line); padding-top:var(--s4); margin-top:var(--s5)}
.finder h3{font-family:var(--f-ui); font-size:17px; font-weight:600}
.sits{list-style:none; padding:0; margin:var(--s4) 0 0; display:grid; gap:6px}
.sit{width:100%; text-align:left; font:inherit; font-size:17px; line-height:1.4; color:var(--ink); background:transparent; border:1px solid var(--line); border-left:4px solid var(--line); padding:12px 16px; cursor:pointer; min-height:48px; border-radius:2px}
.sit:hover{border-left-color:var(--muted)}
.sit[aria-pressed="true"]{border-color:var(--cloth); border-left-color:var(--cloth); background:var(--paper)}
.sit-panel{margin-top:var(--s5); display:grid; gap:var(--s5)}
.pick{display:grid; grid-template-columns:96px minmax(0,1fr); gap:var(--s5); align-items:start}
.pick h4{font-size:22px} .pick .sub{color:var(--muted); font-style:italic; font-size:16px; margin:4px 0 var(--s2)}
.pick .links{margin-top:var(--s2); font-family:var(--f-ui); font-size:15px}
.deeper{font-family:var(--f-ui); font-size:15px; color:var(--muted)}

/* Verzeichnis */
.chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:var(--s6)}
.chip{font-family:var(--f-ui); font-size:15px; min-height:44px; padding:0 14px; border:1px solid var(--line); background:var(--paper); color:var(--ink); border-radius:22px; cursor:pointer}
.chip span{color:var(--muted); font-variant-numeric:tabular-nums; margin-left:4px}
.chip[aria-pressed="true"]{background:var(--ink); color:var(--paper); border-color:var(--ink)} .chip[aria-pressed="true"] span{color:inherit; opacity:.7}
.prog{margin-top:var(--s8)}
.prog h3{font-size:26px; padding-bottom:var(--s3); border-bottom:2px solid var(--ink)}
.rows{list-style:none; margin:0; padding:0}
.row{display:grid; grid-template-columns:52px minmax(0,1fr) 250px 110px; gap:var(--s5); align-items:center; padding-block:var(--s4); border-bottom:1px solid var(--line); scroll-margin-top:90px}
.row:target{background:color-mix(in srgb, var(--foil) 14%, transparent)}
.row h4{font-size:19px; font-weight:600}
.row .sub{font-size:15px; color:var(--muted); line-height:1.4; margin-top:2px}
.row .by{font-family:var(--f-ui); font-size:14px; margin-top:4px}
.row-meta{margin:0; display:grid; grid-template-columns:auto 1fr; gap:2px var(--s3); font-family:var(--f-ui); font-size:14px}
.row-meta div{display:contents} .row-meta dt{color:var(--muted)} .row-meta dd{margin:0; font-variant-numeric:tabular-nums}
.row-buy{font-family:var(--f-ui); font-size:15px; font-weight:600; justify-self:end; min-height:44px; display:inline-flex; align-items:center}

/* Zwei Spalten unten */
.duo{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--s8)}
.duo h2{font-size:clamp(26px, 2.8vw, 34px)}
.duo p{margin-top:var(--s4); max-width:34em}

.foot{background:var(--cloth-deep); color:var(--cloth-ink); padding-block:var(--s8) var(--s7); font-family:var(--f-ui); font-size:15px}
.foot .wrap{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--s6); align-items:end}
.foot a{color:var(--cloth-ink)} .foot p+p{margin-top:var(--s2)} .foot .muted{color:var(--cloth-muted)}
.foot nav{display:flex; gap:var(--s5); flex-wrap:wrap}

@media (max-width: 900px){
  .hero,.neu,.vh,.duo{grid-template-columns:minmax(0,1fr)}
  .hero{gap:var(--s5)}
  .row{grid-template-columns:52px minmax(0,1fr); }
  .row-meta{grid-column:2} .row-buy{grid-column:2; justify-self:start}
  .nav{display:none}
  .neu-list{grid-template-columns:repeat(3, minmax(0,1fr))}
}
@media (max-width: 480px){
  body{font-size:17px}
  .feat{grid-template-columns:minmax(0,1fr)} .feat .cv{max-width:180px}
  .pick{grid-template-columns:72px minmax(0,1fr)}
  .foot .wrap{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion: reduce){ .spine{transition:none} html{scroll-behavior:auto} }
html{scroll-behavior:smooth}

/* Schriften lokal */
@font-face{font-family:"Literata";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/literata-normal-latin.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:"Literata";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/literata-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,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:"Literata";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/literata-italic-latin.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:"Literata";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/literata-italic-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,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:"Archivo";font-style:normal;font-weight:400 700;font-stretch:75% 100%;font-display:swap;src:url(fonts/archivo-normal-latin.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:"Archivo";font-style:normal;font-weight:400 700;font-stretch:75% 100%;font-display:swap;src:url(fonts/archivo-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,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}

.brand i{-webkit-mask:url(img/mark.png) center/contain no-repeat; mask:url(img/mark.png) center/contain no-repeat}
body{margin:0}
.nav a[aria-current="page"]{text-decoration:underline; text-decoration-color:var(--foil); text-decoration-thickness:2px}
.menu{display:none; position:relative; font-family:var(--f-ui)}
.menu summary{list-style:none; cursor:pointer; min-height:44px; display:flex; align-items:center; padding:0 12px; border:1px solid color-mix(in srgb, var(--cloth-ink) 35%, transparent); border-radius:2px; color:var(--cloth-ink)}
.menu summary::-webkit-details-marker{display:none}
.menu nav{position:absolute; right:0; top:52px; background:var(--cloth-deep); padding:8px 0; min-width:230px; box-shadow:0 12px 24px -8px #0008; display:grid}
.menu nav a{color:var(--cloth-ink); text-decoration:none; padding:12px 18px}
@media (max-width:900px){ .menu{display:block} }

/* Seitenkopf auf Unterseiten */
.crumbs{font-family:var(--f-ui); font-size:14px; color:var(--cloth-muted); padding-top:var(--s5)}
.crumbs a{color:var(--cloth-muted)}
.crumbs span{padding:0 6px; opacity:.6}
.phead{padding-block:var(--s7) var(--s8)}
.phead h1{font-size:clamp(36px, 5vw, 62px); line-height:1.05; letter-spacing:-.01em; max-width:16em}
.phead .lead{font-size:20px; color:var(--cloth-muted); max-width:36em; margin-top:var(--s4)}

/* Buchseite */
.bhero{display:grid; grid-template-columns:minmax(0,280px) minmax(0,1fr); gap:var(--s8); padding-block:var(--s6) var(--s8); align-items:start}
.bhero .cv{box-shadow:10px 14px 0 -4px color-mix(in srgb,#000 30%,transparent)}
.bhero .prog-link{font-family:var(--f-ui); font-size:15px; color:var(--cloth-muted)}
.bhero h1{font-size:clamp(34px, 4.6vw, 58px); line-height:1.05; letter-spacing:-.01em; margin-top:var(--s3)}
.bhero .sub{font-style:italic; font-size:21px; color:var(--cloth-muted); margin-top:var(--s3); max-width:32em; line-height:1.4}
.bhero .by{font-family:var(--f-ui); font-size:16px; margin-top:var(--s4)}
.bhero .by a{color:var(--cloth-ink)}
.bhero .lead{margin-top:var(--s5); font-size:19px; max-width:36em}
.buy{display:flex; flex-wrap:wrap; align-items:center; gap:var(--s4) var(--s6); margin-top:var(--s6)}
.buy .btn-foil{margin-top:0}
.isbn{font-family:var(--f-ui); font-size:15px; color:var(--cloth-muted); display:flex; flex-wrap:wrap; align-items:center; gap:8px}
.isbn b{color:var(--cloth-ink); font-weight:600; font-variant-numeric:tabular-nums; letter-spacing:.01em}
.copy{font:inherit; font-size:14px; min-height:36px; padding:0 10px; background:transparent; color:var(--cloth-ink); border:1px solid color-mix(in srgb, var(--cloth-ink) 40%, transparent); border-radius:2px; cursor:pointer}
.copy:hover{background:color-mix(in srgb, var(--cloth-ink) 10%, transparent)}

.bbody{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,300px); gap:var(--s8); padding-block:var(--s8)}
.bbody > div{min-width:0}
.kurz{border-left:3px solid var(--foil); padding:var(--s2) 0 var(--s2) var(--s5); font-size:19px}
.kurz h2{font-family:var(--f-ui); font-size:15px; font-weight:600; color:var(--muted); margin-bottom:var(--s2)}
.twocol{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s7); margin-top:var(--s8)}
.twocol h2,.art h2,.faq h2,.about h2,.more h2{font-size:26px}
.ticks{list-style:none; margin:var(--s4) 0 0; padding:0; display:grid; gap:var(--s3)}
.ticks li{padding-left:22px; position:relative; line-height:1.5}
.ticks li::before{content:""; position:absolute; left:0; top:.62em; width:10px; height:2px; background:var(--cloth)}
.quote{margin:var(--s8) 0 0; font-size:clamp(24px, 2.6vw, 32px); line-height:1.3; font-weight:500; font-style:italic; max-width:24em; color:var(--cloth)}
.art{margin-top:var(--s8)}
.art section+section{margin-top:var(--s7)}
.art h2{margin-bottom:var(--s4)}
.art p{max-width:38em} .art p+p{margin-top:var(--s4)}
.faq{margin-top:var(--s8)}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-of-type{border-top:1px solid var(--line); margin-top:var(--s4)}
.faq summary{cursor:pointer; padding:var(--s4) 0; font-weight:600; list-style-position:outside; min-height:44px}
.faq details p{padding-bottom:var(--s4); max-width:38em}
aside.side{display:grid; gap:var(--s5); align-content:start}
.box{border:1px solid var(--line); padding:var(--s5); background:var(--paper)}
.box h2{font-family:var(--f-ui); font-size:16px; font-weight:600}
.box p{font-size:16px; margin-top:var(--s2); line-height:1.5}
.box a.go{display:inline-flex; margin-top:var(--s3); font-family:var(--f-ui); font-size:15px; font-weight:600}
.box.dark{background:var(--cloth); color:var(--cloth-ink); border-color:var(--cloth)}
.box.dark a{color:var(--cloth-ink)}
.about{margin-top:var(--s8); padding-top:var(--s7); border-top:2px solid var(--ink)}
.about .who + .who{margin-top:var(--s6)}
.about h3{font-size:20px; margin-bottom:var(--s2)}
.about p+p{margin-top:var(--s3)}
.about p{max-width:38em}
.more{padding-block:var(--s8)}
.more-list{list-style:none; margin:var(--s5) 0 0; padding:0; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:var(--s5)}

/* Allgemeine Textseiten */
.prose{max-width:44em; padding-block:var(--s8)}
.prose h2{font-size:28px; margin-top:var(--s7)}
.prose h3{font-size:21px; margin-top:var(--s6)}
.prose h4{font-size:18px; margin-top:var(--s5)}
.prose p,.prose ul,.prose ol{margin-top:var(--s3)}
.prose li+li{margin-top:var(--s2)}
.steps{counter-reset:s; list-style:none; padding:0; display:grid; gap:var(--s5); margin-top:var(--s5)}
.steps li{counter-increment:s; display:grid; grid-template-columns:44px minmax(0,1fr); gap:var(--s4); align-items:baseline}
.steps li::before{content:counter(s); font-family:var(--f-ui); font-weight:700; font-size:20px; color:var(--cloth); border:2px solid var(--cloth); width:36px; height:36px; display:grid; place-items:center; border-radius:50%}
.mailcta{display:inline-flex; margin-top:var(--s5)}
.btn-ink{background:var(--cloth); color:var(--cloth-ink)}
.btn-ink:hover{background:var(--cloth-deep)}
.cards{list-style:none; margin:var(--s6) 0 0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:var(--s5)}
.cards li{border-top:2px solid var(--ink); padding-top:var(--s4)}
.cards h3{font-size:21px; margin-top:0}
.cards p{font-size:16px; margin-top:var(--s2)}
.cards .meta{font-family:var(--f-ui); font-size:14px; color:var(--muted)}
.cards a.go{display:inline-flex; margin-top:var(--s3); font-family:var(--f-ui); font-size:15px; font-weight:600}
.authors .who{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:var(--s7); padding-block:var(--s7); border-top:1px solid var(--line); scroll-margin-top:90px}
.authors .who h2{font-size:30px}
.authors .who p{margin-top:var(--s3)}
.authors .bk{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--s4)}
.audio{display:grid; gap:var(--s4); margin-top:var(--s5)}
.audio audio{width:100%}
.audio-list{list-style:none; padding:0; margin:var(--s5) 0 0; display:grid; gap:0}
.audio-list li{border-bottom:1px solid var(--line)}
.audio-list a{display:flex; justify-content:space-between; gap:var(--s4); padding:var(--s4) 0; text-decoration:none; color:var(--ink)}
.audio-list a span{font-family:var(--f-ui); font-size:14px; color:var(--muted)}
.audio-list a:hover strong{text-decoration:underline}
.brevo{width:100%; min-height:560px; border:0; background:var(--paper); margin-top:var(--s4)}
.foot .cols{display:grid; grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr)); gap:var(--s6); align-items:start}
.foot h2{font-size:15px; font-family:var(--f-ui); font-weight:600; color:var(--cloth-muted); margin-bottom:var(--s3)}
.foot ul{list-style:none; margin:0; padding:0; display:grid; gap:6px}
.foot a{text-decoration:none} .foot a:hover{text-decoration:underline}
.foot .small{margin-top:var(--s7); padding-top:var(--s4); border-top:1px solid color-mix(in srgb,var(--cloth-ink) 15%,transparent); color:var(--cloth-muted); font-size:14px}
.e404{padding-block:var(--s9)}

@media (max-width:900px){
  .bhero,.bbody,.twocol,.authors .who{grid-template-columns:minmax(0,1fr)}
  .bhero .cv{max-width:220px}
  .more-list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .foot .cols{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:480px){
  .more-list,.authors .bk{grid-template-columns:repeat(2,minmax(0,1fr))}
  .foot .cols{grid-template-columns:minmax(0,1fr)}
}
.about > h2{margin-bottom:var(--s5)}
.prose .more-list{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:480px){ .prose .more-list{grid-template-columns:repeat(2,minmax(0,1fr))} }
.lp-link{font-family:var(--f-ui); font-size:15px; color:var(--cloth-ink)}
.leseprobe{margin-top:var(--s8); padding:var(--s6) var(--s6) var(--s5); background:var(--paper-2); border-top:3px solid var(--cloth)}
.leseprobe h2{font-size:26px}
.lp-note{font-family:var(--f-ui); font-size:14px; color:var(--muted); margin-top:var(--s2)}
.lp-text{position:relative; max-height:520px; overflow:hidden; margin-top:var(--s5); font-size:18px; line-height:1.7}
.lp-text::after{content:""; position:absolute; left:0; right:0; bottom:0; height:140px; background:linear-gradient(transparent, var(--paper-2))}
.lp-text.open{max-height:none} .lp-text.open::after{display:none}
.lp-text p{max-width:36em} .lp-text p+p{margin-top:var(--s3)}
.lp-text h3{font-size:20px; margin:var(--s6) 0 var(--s3)} .lp-text h3:first-child{margin-top:0}
.lp-text p.li{padding-left:22px; position:relative} .lp-text p.li::before{content:""; position:absolute; left:0; top:.8em; width:10px; height:2px; background:var(--cloth)}
.lp-more{margin-top:var(--s4); font-family:var(--f-ui); font-weight:600; font-size:15px; min-height:44px; padding:0 18px; background:var(--cloth); color:var(--cloth-ink); border:0; border-radius:2px; cursor:pointer}
@media (max-width:480px){ .leseprobe{padding:var(--s5) var(--s4)} }
