/* Abseits der Buchwelten – eigenständiger Stil */
:root {
    color-scheme: light;
    --papier: #f5f1e9;
    --papier-dunkel: #e9e5dc;
    --weiss: #fffdfa;
    --text: #353b3b;
    --gedaempft: #655f58;
    --kupfer: #936b54;
    --kupfer-dunkel: #704c38;
    --linie: #d8d0c5;
    --breite: 1040px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background: var(--papier);
    color: var(--text);
    font: 1rem/1.75 system-ui, -apple-system, "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
}
a { color: var(--kupfer-dunkel); text-underline-offset: .2em; }
a:hover { color: var(--kupfer); }
a:focus-visible { outline: 3px solid var(--kupfer); outline-offset: 4px; }
.seitenbreite { width: min(calc(100% - 3rem), var(--breite)); margin-inline: auto; }
.skip-link {
    position: absolute; z-index: 10; top: -100px; left: 1rem;
    padding: .5rem 1rem; background: var(--weiss); color: var(--text);
}
.skip-link:focus { top: 1rem; }
h1, h2, h3 { font-family: Georgia, "Times New Roman", serif; font-weight: 400; line-height: 1.16; }
h2 { font-size: clamp(2rem, 4vw, 3rem); margin: .35rem 0 1.4rem; }
h3 { font-size: clamp(1.6rem, 3vw, 2.15rem); margin: .2rem 0 .8rem; }
p { margin: 0 0 1.1rem; }

/* Titel und Navigation */
.seitenkopf { background: var(--text); color: var(--weiss); }
.kopfzeile {
    display: flex; justify-content: space-between; align-items: center;
    gap: 1rem; padding-block: 1rem;
    border-bottom: 1px solid #ffffff30;
}
.kopfzeile a, .hauptnavigation a { color: var(--weiss); text-decoration: none; }
.autorenmarke { font-size: .88rem; text-transform: uppercase; letter-spacing: .16em; font-weight: 700; }
.zur-hauptseite { font-size: .88rem; opacity: .83; }
.kopfzeile a:hover, .hauptnavigation a:hover { color: #e8c5ae; }
.titelbereich { padding-block: clamp(1.25rem, 2.5vw, 2rem) clamp(1.25rem, 2.5vw, 2rem); }
.rubrik, .abschnittsmarke, .geschichte-kategorie {
    font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .18em;
}
.rubrik { color: #e1bda7; margin-bottom: 1rem; }
h1 { font-size: clamp(3.5rem, 9vw, 7.6rem); letter-spacing: -.045em; margin: 0 0 1.1rem; }
h1 span { color: #d9ad90; }
.untertitel { font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.2rem, 2.8vw, 1.65rem); color: #e8e2d9; margin: 0; }
.hauptnavigation { display: flex; flex-wrap: wrap; gap: .5rem 2rem; padding: .9rem 0; border-top: 1px solid #ffffff30; }
.hauptnavigation a { font-size: .93rem; }

/* Einleitung */
.einleitung { padding-block: clamp(4rem, 8vw, 7rem); max-width: 860px; }
.abschnittsmarke { color: var(--kupfer-dunkel); margin-bottom: 1rem; }
.einleitung > p:not(.abschnittsmarke) { font-size: 1.08rem; max-width: 73ch; }

/* Geschichten */
.geschichten-bereich { background: var(--weiss); border-block: 1px solid var(--linie); padding-block: clamp(4rem, 8vw, 6rem); }
.abschnittskopf { margin-bottom: 2.5rem; }
.abschnittskopf > p:last-child { color: var(--gedaempft); }
.geschichten-liste { border-top: 1px solid var(--linie); }
.geschichte {
    display: grid; grid-template-columns: 5rem minmax(0, 1fr);
    gap: clamp(1rem, 3vw, 3rem); padding: 2.25rem 0;
    border-bottom: 1px solid var(--linie);
}
.geschichte-nummer { color: var(--kupfer); font: 2rem/1.2 Georgia, "Times New Roman", serif; }
.geschichte-kategorie { color: var(--kupfer-dunkel); margin-bottom: .8rem; }
.geschichte-inhalt { max-width: 740px; }
.geschichte-inhalt p:not(.geschichte-kategorie) { margin-bottom: .8rem; }
.geschichte-autor { color: var(--gedaempft); font-size: .88rem; margin-top: -.45rem; }
.geschichte-hinweis { color: var(--gedaempft); font-size: .92rem; font-style: italic; }

/* Abschluss und Footer */
.abschluss { padding-block: clamp(4rem, 8vw, 6.5rem); }
.abschluss > p:not(.abschnittsmarke) { max-width: 65ch; }
.textlink { display: inline-block; margin-top: .6rem; font-weight: 650; text-decoration-thickness: 1px; }
.seitenfuss { background: var(--text); color: #e6e2db; padding-block: 2.5rem; font-size: .88rem; }
.fuss-inhalt { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 1rem 2rem; }
.fuss-inhalt p { margin: 0; }
.seitenfuss nav { display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; }
.seitenfuss a { color: #e6e2db; }
.seitenfuss a:hover { color: #e8c5ae; }
.seitenzaehler { color: #c3bcb3; }

@media (max-width: 650px) {
    .seitenbreite { width: min(calc(100% - 2rem), var(--breite)); }
    .kopfzeile { align-items: flex-start; }
    .titelbereich { padding-block: 1.1rem 1.5rem; }
    .hauptnavigation { gap: .7rem 1.4rem; }
    .geschichte { grid-template-columns: 1fr; gap: .5rem; padding-block: 2rem; }
    .geschichte-nummer { font-size: 1.4rem; }
    .einleitung > p:not(.abschnittsmarke) { font-size: 1rem; }
    .fuss-inhalt { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
}

/* Download-Aktionen unter den Geschichten */
.geschichte-aktionen {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .4rem 1rem;
    margin-top: 1.15rem;
}
.download-link {
    display: inline-block;
    padding: .6rem 1rem;
    border: 1px solid var(--kupfer);
    border-radius: .2rem;
    color: var(--kupfer-dunkel);
    font-weight: 650;
    text-decoration: none;
    line-height: 1.45;
}
.download-link:hover, .download-link:focus-visible {
    background: var(--kupfer-dunkel);
    color: var(--weiss);
}
.download-anzahl { color: var(--gedaempft); font-size: .85rem; }


/* Werkseiten */
.werk-kopf {background:var(--text);color:var(--weiss);padding-block:1.2rem 2.8rem;}
.werk-kopf .kopfzeile {margin-bottom:2rem;}
.werk-kopf .rubrik{margin-bottom:.6rem;}
.werk-titel {font-size:clamp(2.8rem,6.3vw,5.3rem);letter-spacing:-.035em;margin:0 0 .5rem;}
.werk-autor {color:#cfc7bd;font-size:.95rem;}
.werk-inhalt {padding-block:clamp(3rem,7vw,5rem);max-width:900px;}
.werk-inhalt .lead{font-family:Georgia,serif;font-size:clamp(1.2rem,2vw,1.48rem);line-height:1.55;}
.werk-layout{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:3rem;align-items:start;}
.werk-cover{display:block;width:100%;height:auto;box-shadow:0 10px 28px #0002;}
.werk-downloads{margin-top:2rem;padding:1.4rem;background:var(--weiss);border:1px solid var(--linie);}
.werk-downloads h2{font-size:1.65rem;margin:0 0 .9rem;}
.werk-downloads .download-link{margin:.2rem .5rem .2rem 0;}
.werk-hinweis{color:var(--gedaempft);font-size:.9rem;}
@media(max-width:650px){.werk-layout{grid-template-columns:1fr;gap:1.5rem}.werk-cover{max-width:210px}.werk-kopf .kopfzeile{margin-bottom:1.5rem}}
