/* =========================================================================
   mvr-publikationen.css — Publikationsseite mvr-hamburg.de
   Reihe „Gesteuerter Vertrieb" · 22 Bände und ein Kompendium

   In sich geschlossen: keine Abhängigkeit von Bootstrap oder Cassiopeia,
   keine Verbindung zu fremden Servern. Alle Werte aus 20-MASSE-UND-FARBEN.md.
   ========================================================================= */

@font-face { font-family:"Source Serif 4"; src:url(../fonts/SourceSerif4-Regular.woff2) format("woff2");
  font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"Source Sans 3"; src:url(../fonts/SourceSans3-Regular.woff2) format("woff2");
  font-weight:400; font-style:normal; font-display:swap; }

.mvr-pub {
  --mvr-flaeche-dunkel:#1D3849;
  --mvr-grund-sand:#FBEAD4;
  --mvr-schrift-auf-dunkel:#FBEAD4;   /* 10,40:1 auf dunkel */
  --mvr-schrift-auf-dunkel-2:#D0B798; /* 6,36:1  auf dunkel */
  --mvr-zier:#AD906B;                 /* NUR Linien und Rahmen */
  --mvr-akzent:#725229;               /* 7,11:1 auf weiß */
  --mvr-text-stark:#1D3849;
  --mvr-text-2:#324958;
  --mvr-text-3:#475F6F;
  --mvr-serif:"Source Serif 4",Georgia,serif;
  --mvr-sans:"Source Sans 3","Helvetica Neue",Helvetica,Arial,sans-serif;
  --mvr-mono:ui-monospace,Menlo,Consolas,monospace;

  /* Coverbreite. Jede Covergröße wird allein über diese Variable gesetzt;
     alle Innenmaße rechnen daraus. */
  --B:300px;

  font-family:var(--mvr-sans); color:var(--mvr-text-2);
}
.mvr-pub *,.mvr-pub *::before,.mvr-pub *::after { box-sizing:border-box; }

/* =========================================================================
   DAS COVER — Rücken links, Deckel rechts, ein Schatten am Gesamtgebilde
   ========================================================================= */

.mvr-buch { display:flex; align-items:stretch; flex:none;
  box-shadow:calc(var(--B) * .04) calc(var(--B) * .04) 0 rgba(29,56,73,.22); }
/* Auf dunklem Grund braucht der Schatten mehr Deckkraft, sonst unsichtbar. */
.mvr-buch--auf-dunkel { box-shadow:calc(var(--B) * .04) calc(var(--B) * .04) 0 rgba(0,0,0,.5); }

/* --- Buchrücken ---------------------------------------------------------- */
.mvr-ruecken {
  width:calc(var(--B) * .0767);              /* 7,67 % — gesetzt, nicht gerechnet */
  height:calc(var(--B) * 205 / 135);
  background:var(--mvr-flaeche-dunkel);
  border-left:1px solid rgba(208,183,152,.55);
  display:flex; flex-direction:column; align-items:center; justify-content:space-between;
  padding:calc(var(--B) * .0467) 0; flex:none;
}
.mvr-ruecken-nr { font:400 calc(var(--B) * .0433)/1 var(--mvr-serif);
  color:var(--mvr-schrift-auf-dunkel); }
/* Gruppe ueber Nummer (III / 06), siehe _buchcover.php. */
.mvr-ruecken-nr-teil { display:block; text-align:center; white-space:nowrap; }
/* Rückentitel läuft von unten nach oben (DIN): vertical-rl plus 180°. */
.mvr-ruecken-titel { writing-mode:vertical-rl; transform:rotate(180deg);
  font:400 calc(var(--B) * .0333)/1 var(--mvr-serif);
  color:var(--mvr-schrift-auf-dunkel);
  white-space:nowrap; max-height:calc(var(--B) * .833); overflow:hidden; }
.mvr-ruecken-namenszug { position:relative; flex:none; overflow:hidden;
  width:calc(var(--B) * .0367); height:calc(var(--B) * .46); }
.mvr-ruecken-namenszug img { position:absolute; left:0; top:0;
  width:calc(var(--B) * .46); height:auto; max-width:none; display:block;
  transform-origin:0 0; transform:rotate(-90deg) translateX(-100%); }

/* --- Deckel -------------------------------------------------------------- */
.mvr-deckel {
  width:var(--B); height:calc(var(--B) * 205 / 135);
  background:#fff; position:relative; flex:none;
  display:flex; flex-direction:column;
  padding:calc(var(--B) * .1133);
}
.mvr-deckel-rahmen { position:absolute; inset:calc(var(--B) * .0667);
  border:1px solid var(--mvr-zier); z-index:1; }

/* Kopfzeile. flex-end statt space-between, sobald der Reihentitel entfällt —
   ein einzelnes Kind rutscht bei space-between nach links. */
.mvr-deckel-kopf { position:relative; z-index:2; flex:none;
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:calc(var(--B) * .04); }
.mvr-deckel-kopf--nur-nummer { justify-content:flex-end; }
.mvr-reihentitel { font-size:calc(var(--B) * .0267); letter-spacing:.2em;
  text-transform:uppercase; color:var(--mvr-akzent);
  padding-top:calc(var(--B) * .01); white-space:nowrap; }
.mvr-nummernfeld { width:calc(var(--B) * .18); height:calc(var(--B) * .18);
  background:var(--mvr-flaeche-dunkel);
  display:flex; align-items:center; justify-content:center; flex:none; }
.mvr-nummernfeld span { font:400 calc(var(--B) * .08)/1 var(--mvr-serif);
  color:var(--mvr-schrift-auf-dunkel); }
/* Zweiteilig (III / 01), siehe _buchcover.php: Gruppe klein ueber der Nummer. */
.mvr-nummernfeld--zweiteilig { flex-direction:column; gap:calc(var(--B) * .006); }
.mvr-nummernfeld--zweiteilig .mvr-nummernfeld-gruppe { font-size:calc(var(--B) * .036); letter-spacing:.08em; }
.mvr-nummernfeld--zweiteilig .mvr-nummernfeld-nr { font-size:calc(var(--B) * .07); }

/* Zeichnung. Die ovale Maske lässt sie weich auslaufen — kein Bildkasten.
   48 % ist der Höchstwert für diese Flächenhöhe; tiefer schneidet den Kopf an. */
.mvr-zeichnung { flex:1 1 auto; min-height:calc(var(--B) * .1467);
  margin:0 calc(var(--B) * -.1133); position:relative; z-index:0; overflow:hidden;
  -webkit-mask-image:radial-gradient(ellipse 58% 58% at 50% 36%, #000 36%, rgba(0,0,0,.5) 70%, transparent 100%);
          mask-image:radial-gradient(ellipse 58% 58% at 50% 36%, #000 36%, rgba(0,0,0,.5) 70%, transparent 100%); }
.mvr-zeichnung img { width:100%; height:100%; margin:0 auto; display:block;
  object-fit:cover; object-position:center 48%;
  filter:brightness(1.04) contrast(1.06); }
/* Arbeitsbuch: das BILD wird schmaler, damit die FIGUR kleiner wird. Eine
   kleinere Fläche würde sie bei object-fit:cover nur stärker anschneiden. */
.mvr-buch--arbeit .mvr-zeichnung img { width:84%; }

/* Textraum, feste Höhe — sonst kippt das Seitenverhältnis */
.mvr-deckel-text { position:relative; z-index:2; flex:none;
  height:calc(var(--B) * .46);
  display:flex; flex-direction:column; gap:calc(var(--B) * .0267); }
.mvr-thema { font-size:calc(var(--B) * .0267); letter-spacing:.16em;
  text-transform:uppercase; color:var(--mvr-akzent);
  white-space:nowrap; overflow:hidden; }
.mvr-bandtitel { font:400 calc(var(--B) * .07)/1.14 var(--mvr-serif);
  color:#000; text-wrap:pretty; }
.mvr-zierlinie { width:calc(var(--B) * .11); height:1px;
  background:var(--mvr-zier); flex:none; }
.mvr-untertitel { font-size:calc(var(--B) * .0367); line-height:1.45;
  color:var(--mvr-text-2); overflow:hidden; }
.mvr-autor { font:400 calc(var(--B) * .0367)/1 var(--mvr-serif);
  color:#000; margin-top:auto; }

/* Kennzeichnung der individualisierten Ausgabe */
.mvr-individualisiert { background:var(--mvr-grund-sand);
  border-left:2px solid var(--mvr-zier);
  padding:calc(var(--B) * .0233) calc(var(--B) * .03);
  display:flex; flex-direction:column; gap:calc(var(--B) * .0067); }
.mvr-individualisiert-marke { font-size:calc(var(--B) * .0233);
  letter-spacing:.14em; text-transform:uppercase; color:var(--mvr-akzent); }
.mvr-individualisiert-wert { font-family:var(--mvr-mono);
  font-size:calc(var(--B) * .03); color:var(--mvr-text-stark); }
.mvr-kundenlogo { max-width:calc(var(--B) * .26); max-height:calc(var(--B) * .10);
  width:auto; height:auto; display:block; }

/* Signet unten rechts. Der Namenszug ist eine Hell-auf-Dunkel-Datei und wird
   auf dem weißen Deckel schwarz durchgerechnet (21:1 statt 1,95:1). */
.mvr-deckel-signet { position:relative; z-index:2; flex:none;
  margin-top:calc(var(--B) * .0067);
  display:flex; flex-direction:column; align-items:flex-end;
  gap:calc(var(--B) * .0133); }
.mvr-deckel-signet .mvr-zeichen { height:calc(var(--B) * .10); width:auto; display:block; }
.mvr-deckel-signet .mvr-namenszug { height:calc(var(--B) * .0233); width:auto;
  display:block; filter:brightness(0); }

/* =========================================================================
   DAS KOMPENDIUM — gleiche Vorlage, dunkler Grund, Fuchs in Überblendung
   Es trägt keine Bandnummer: es ist kein Band, sondern das Dach über allen.
   ========================================================================= */

.mvr-deckel--kompendium { background:linear-gradient(160deg, var(--mvr-flaeche-dunkel) 0%, #324958 100%); }
.mvr-kompendium-fuchs { position:absolute; inset:0; display:block;
  background-image:url(../images/fuchs-scharf-840.webp);
  background-size:150% auto; background-position:62% 42%; background-repeat:no-repeat;
  mix-blend-mode:soft-light; opacity:.85; }
.mvr-kompendium-schleier { position:absolute; inset:0; display:block;
  background:linear-gradient(165deg, rgba(29,56,73,.72) 0%, rgba(29,56,73,.34) 52%, rgba(173,144,107,.28) 100%); }
.mvr-deckel--kompendium .mvr-deckel-rahmen { border-color:rgba(208,183,152,.55); }
.mvr-ruecken--kompendium { border-left-color:rgba(208,183,152,.55); }

/* Auf dunklem Grund wechselt jede Textfarbe — #725229 und #000 wären dort
   unlesbar. Die Werte sind dieselben wie in den dunklen Bahnen der Startseite. */
.mvr-reihentitel--hell,
.mvr-thema--hell,
.mvr-untertitel--hell { color:var(--mvr-schrift-auf-dunkel-2); }   /* 6,36:1 */
.mvr-bandtitel--hell,
.mvr-autor--hell { color:var(--mvr-schrift-auf-dunkel); }          /* 10,40:1 */
/* Das Signet ist für hellen Grund gezeichnet und wird aufgehellt; der
   Namenszug liegt als eigene helle Datei bereit und braucht keinen Filter. */
.mvr-zeichen--hell { filter:brightness(1.9) contrast(.85); }
.mvr-namenszug-hell { height:calc(var(--B) * .0233); width:auto; display:block; }

/* =========================================================================
   FILTER — muss vor allem anderen stehen
   `karte.hidden = true` allein wirkt NICHT: .mvr-band-karte trägt display:grid,
   und die Browserregel [hidden]{display:none} verliert gegen jede Autorenregel.
   ========================================================================= */
.mvr-pub [hidden] { display:none !important; }

/* =========================================================================
   SEITENBLÖCKE der Reihenübersicht
   ========================================================================= */

.mvr-block { padding:80px 160px; }
.mvr-block--kopf      { background:#fff; padding:76px 160px 56px; }
.mvr-block--idee      { background:var(--mvr-grund-sand); }
.mvr-block--kompendium,
.mvr-block--abschluss { color:var(--mvr-schrift-auf-dunkel);
  background:
    linear-gradient(100deg, var(--mvr-flaeche-dunkel) 0%, rgba(29,56,73,.96) 42%,
      rgba(29,56,73,.78) 72%, rgba(29,56,73,.6) 100%),
    url(../images/fuchs-scharf-840.webp) right center/cover no-repeat,
    var(--mvr-flaeche-dunkel); }
.mvr-block--kompendium { display:grid; grid-template-columns:auto 1fr; gap:64px;
  align-items:start; padding:88px 160px; }

.mvr-kicker { margin:0 0 20px; font-size:13px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--mvr-akzent); }
.mvr-kicker--hell { color:var(--mvr-schrift-auf-dunkel-2); margin:0; }
.mvr-block-titel { margin:0 0 14px; font:400 clamp(32px,4.2vw,58px)/1.1 var(--mvr-serif);
  color:var(--mvr-text-stark); text-wrap:pretty; }
.mvr-block--idee .mvr-block-titel { font-size:clamp(28px,3.2vw,40px); }
.mvr-zierbalken { display:block; width:72px; height:2px;
  background:var(--mvr-zier); margin:0 0 32px; }

.mvr-zweispalt { display:grid; grid-template-columns:1fr 1fr; gap:56px; max-width:1000px; }
.mvr-zweispalt p { margin:0; font-size:19px; line-height:1.7;
  color:var(--mvr-text-2); text-wrap:pretty; }
.mvr-zweispalt--wege { align-items:start; margin-bottom:48px; max-width:none; }
.mvr-weg { display:flex; flex-direction:column; gap:14px; }
.mvr-weg--unser p { color:var(--mvr-text-stark); }
.mvr-marke-klein { font-size:13px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--mvr-akzent); }

.mvr-kennzahlen { display:flex; flex-wrap:wrap; gap:56px; margin-top:44px;
  padding-top:28px; border-top:1px solid #D0B798; }
.mvr-kennzahl { display:flex; flex-direction:column; gap:6px; }
.mvr-kennzahl-wert { font:400 38px/1 var(--mvr-serif); color:var(--mvr-text-stark); }
.mvr-kennzahl-was { font-size:14px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--mvr-akzent); }

/* --- Kreislauf ----------------------------------------------------------- */
.mvr-kreislauf-kopf { margin:0 0 24px; display:flex; align-items:baseline;
  gap:16px; flex-wrap:wrap; }
.mvr-kreislauf-titel { font:400 26px/1.2 var(--mvr-serif); color:var(--mvr-text-stark); }
.mvr-kreislauf-zusatz { font-size:15px; color:var(--mvr-akzent); }

/* Die Bahn unten trägt den Rücklauf: 99 px, damit Eckpfeile und Balken
   frei stehen wie die Querpfeile zwischen den Karten. */
.mvr-kreislauf { position:relative; padding-bottom:99px; }
.mvr-schritte { display:grid; grid-template-columns:1fr 44px 1fr 44px 1fr;
  column-gap:20px; align-items:stretch; }
.mvr-schritt { background:#fff; border:1px solid #D0B798; padding:28px 30px;
  display:flex; flex-direction:column; gap:12px; }
.mvr-schritt--mitte { border-color:var(--mvr-zier); }
.mvr-schritt-titel { font:400 23px/1.3 var(--mvr-serif); color:var(--mvr-text-stark); }
.mvr-schritt-text { font-size:17px; line-height:1.65; color:var(--mvr-text-2); }

.mvr-pfeil-quer { align-self:center; width:40px; height:auto; display:block; }
.mvr-pfeil-quer path,
.mvr-pfeil-ecke path { fill:var(--mvr-akzent); }

/* Eine Kartenspalte ist (100% - 2×44px Pfeilspalten - 2×20px gap)/3 breit;
   die Pfeilmitte sitzt bei einem Sechstel der Restbreite. */
.mvr-pfeil-ecke { position:absolute; bottom:20px; display:block; }
.mvr-pfeil-ecke--rechts { right:calc((100% - 168px) / 6); width:53px; height:59px;
  margin-right:-4px; }
.mvr-pfeil-ecke--links  { left:calc((100% - 168px) / 6);  width:59px; height:59px;
  margin-left:-10px; }
.mvr-ruecklauf { position:absolute; bottom:0; height:60px;
  left:calc((100% - 168px) / 6 + 69px); right:calc((100% - 168px) / 6 + 69px);
  background:var(--mvr-flaeche-dunkel);
  display:flex; align-items:center; justify-content:center; padding:0 24px; }
.mvr-ruecklauf span { font-size:17px; line-height:1.4;
  color:var(--mvr-schrift-auf-dunkel); text-align:center; }
.mvr-kreislauf-schluss { margin:28px calc((100% - 168px) / 6 + 69px) 0;
  font-size:18px; line-height:1.7; color:var(--mvr-text-2); }

/* --- Die zwei Ausgaben --------------------------------------------------- */
.mvr-ausgaben { margin-top:48px; padding-top:36px; border-top:1px solid var(--mvr-zier); }
.mvr-ausgabe { display:grid; grid-template-columns:260px 1fr; gap:40px;
  align-items:baseline; padding-bottom:28px; border-bottom:1px solid #D0B798; }
.mvr-ausgabe--b { padding:28px 0 0; border-bottom:0; }
.mvr-ausgabe-kopf { display:flex; flex-direction:column; gap:6px; }
.mvr-ausgabe-name { font:400 28px/1.2 var(--mvr-serif); color:var(--mvr-text-stark); }
.mvr-ausgabe-text { margin:0; font-size:18px; line-height:1.7;
  color:var(--mvr-text-2); max-width:70ch; }
.mvr-ausgabe-inhalt { display:flex; flex-direction:column; gap:24px; }
.mvr-zweispalt--wann { gap:32px; max-width:none; }
.mvr-wann { display:flex; flex-direction:column; gap:10px;
  border-top:2px solid var(--mvr-zier); padding-top:16px;
  font-size:17px; line-height:1.65; color:var(--mvr-text-2); }

/* --- Kompendium-Block ---------------------------------------------------- */
.mvr-kompendium-spalte { display:flex; flex-direction:column; gap:18px; }
.mvr-kompendium-text { display:flex; flex-direction:column; gap:26px; padding-top:4px; }
.mvr-kompendium-text p { margin:0; font-size:17px; line-height:1.8;
  color:var(--mvr-schrift-auf-dunkel); max-width:64ch; text-wrap:pretty; }
.mvr-kompendium-titel { margin:0; font:400 clamp(34px,4.6vw,52px)/1.1 var(--mvr-serif);
  color:var(--mvr-schrift-auf-dunkel); max-width:22ch; text-wrap:pretty; }
.mvr-kompendium-marke { font-size:24px !important; line-height:1.4;
  color:var(--mvr-schrift-auf-dunkel-2) !important; }
.mvr-nebentext { font-size:16px !important; line-height:1.7;
  color:var(--mvr-schrift-auf-dunkel-2) !important; }
.mvr-tafel--kompendium { width:300px; background:rgba(251,234,212,.08); }
.mvr-tafel-kopf { padding:12px 16px; background:rgba(251,234,212,.12);
  font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--mvr-schrift-auf-dunkel-2); }

/* --- Abschlussblock ------------------------------------------------------ */
.mvr-abschluss-titel { margin:0 0 20px;
  font:400 clamp(28px,3.4vw,40px)/1.2 var(--mvr-serif);
  color:var(--mvr-schrift-auf-dunkel); max-width:32ch; text-wrap:pretty; }
.mvr-abschluss-text { margin:0 0 36px; font-size:18px; line-height:1.7;
  color:var(--mvr-schrift-auf-dunkel); max-width:62ch; }

/* --- Knöpfe -------------------------------------------------------------- */
.mvr-knoepfe { display:flex; gap:16px; flex-wrap:wrap; }
.mvr-knopf { display:inline-block; align-self:flex-start; text-decoration:none;
  padding:20px 48px; font-size:18px; letter-spacing:.1em; text-transform:uppercase;
  min-height:44px; box-sizing:border-box;
  transition:transform .16s ease, background-color .16s ease, color .16s ease; }
.mvr-knopf:hover { transform:translateY(-2px); }
.mvr-knopf--hell { background:var(--mvr-grund-sand); color:var(--mvr-text-stark); }
.mvr-knopf--hell:hover { background:var(--mvr-schrift-auf-dunkel-2); }
.mvr-knopf--umriss { border:1px solid #D0B798; color:var(--mvr-schrift-auf-dunkel);
  padding:19px 40px; }
.mvr-knopf--umriss:hover { background:#D0B798; color:var(--mvr-text-stark); }
/* Der Kompendium-Knopf steht im Fließtext, nicht in einer Knopfreihe. */
.mvr-kompendium-text .mvr-knopf { padding:19px 44px; font-size:17px;
  letter-spacing:.06em; text-transform:none; }

/* =========================================================================
   REIHENÜBERSICHT
   ========================================================================= */

.mvr-block--register { background:#fff; padding:80px 160px 88px; }
.mvr-register-kopf { display:flex; align-items:flex-end; justify-content:space-between;
  gap:40px; border-bottom:1px solid #D0B798; padding-bottom:18px; margin-bottom:24px; }
.mvr-block--register .mvr-block-titel { margin:0; font-size:clamp(26px,3vw,34px); }
.mvr-register-treffer { font-size:15px; color:var(--mvr-text-3); }

.mvr-filter { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px; }
.mvr-filter button { border:1px solid var(--mvr-zier); background:transparent;
  color:var(--mvr-akzent); font-family:inherit; font-size:15px;
  padding:11px 18px; min-height:44px; cursor:pointer;
  transition:transform .16s ease, background-color .16s ease; }
.mvr-filter button:hover { transform:translateY(-2px); }
.mvr-filter button[aria-pressed="true"] { background:var(--mvr-flaeche-dunkel);
  color:var(--mvr-schrift-auf-dunkel); }
.mvr-filter-hinweis { font-size:14px; font-style:italic; color:var(--mvr-akzent);
  max-width:80ch; margin-bottom:28px; }

.mvr-reihe { display:grid; grid-template-columns:repeat(auto-fill, minmax(480px, 1fr));
  gap:24px; }
.mvr-band-karte { --B:240px;
  display:grid; grid-template-columns:calc(var(--B) * 1.0767) 1fr; gap:24px;
  align-items:start; text-decoration:none;
  background:var(--mvr-grund-sand); border:1px solid var(--mvr-zier); padding:24px;
  transition:transform .16s ease, border-color .16s ease, background-color .16s ease; }
.mvr-band-karte:hover { transform:translateY(-2px); background:#FDF4E6; }
.mvr-band-karte-text { display:flex; flex-direction:column; gap:10px; }
.mvr-band-karte-thema { font-size:13px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--mvr-akzent); }
.mvr-band-karte-titel { font:400 21px/1.22 var(--mvr-serif);
  color:var(--mvr-text-stark); text-wrap:pretty; }
.mvr-band-karte-unter { font-size:16px; line-height:1.5; color:var(--mvr-text-2); }
.mvr-marken { display:flex; flex-wrap:wrap; gap:6px; margin-top:4px; }
.mvr-marke { border:1px solid var(--mvr-zier); color:var(--mvr-akzent);
  font-size:12px; letter-spacing:.1em; text-transform:uppercase; padding:5px 9px; }
.mvr-band-karte-umfang { font-size:14px; color:var(--mvr-text-3); margin-top:2px; }

/* =========================================================================
   EINZELBAND
   ========================================================================= */

.mvr-band-kopf { background:
    linear-gradient(100deg, var(--mvr-flaeche-dunkel) 0%, rgba(29,56,73,.96) 44%,
      rgba(29,56,73,.78) 74%, rgba(29,56,73,.6) 100%),
    url(../images/fuchs-scharf-840.webp) right center/cover no-repeat,
    var(--mvr-flaeche-dunkel);
  color:var(--mvr-schrift-auf-dunkel-2); padding:72px 0 80px; }
.mvr-band-kopf-innen { display:grid; grid-template-columns:auto 1fr; gap:56px;
  align-items:start; }
.mvr-band-kopf h1 { margin:0 0 18px;
  font:400 clamp(30px, 3.6vw, 44px)/1.14 var(--mvr-serif);
  color:var(--mvr-schrift-auf-dunkel); text-wrap:pretty; }

.mvr-reiter { display:flex; gap:8px; margin-bottom:42px; }
.mvr-reiter button { border:1px solid var(--mvr-zier); background:transparent;
  color:var(--mvr-schrift-auf-dunkel-2); font-family:inherit; font-size:15px;
  padding:11px 20px; min-height:44px; cursor:pointer;
  transition:transform .16s ease, background-color .16s ease; }
.mvr-reiter button:hover { transform:translateY(-2px); }
.mvr-reiter button[aria-pressed="true"] { background:var(--mvr-grund-sand);
  color:var(--mvr-text-stark); }

.mvr-tafel { border:1px solid var(--mvr-zier); }
.mvr-tafel-zeile { display:flex; align-items:baseline; justify-content:space-between;
  gap:24px; padding:12px 18px; border-bottom:1px solid rgba(173,144,107,.4); }
.mvr-tafel-zeile:last-child { border-bottom:0; }
.mvr-tafel-was { font-size:13px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--mvr-schrift-auf-dunkel-2); flex:none; }
.mvr-tafel-wert { font-size:15px; line-height:1.4;
  color:var(--mvr-schrift-auf-dunkel); text-align:right; }
.mvr-tafel-hinweis { padding:12px 18px; border-top:1px solid var(--mvr-zier);
  font-size:12px; line-height:1.55; color:var(--mvr-schrift-auf-dunkel-2); }

.mvr-inhalt { padding:80px 0; }
.mvr-inhalt h2 { margin:0; font:400 36px/1.2 var(--mvr-serif); color:var(--mvr-text-stark); }
.mvr-kapitel-liste { display:grid; grid-template-columns:1fr 1fr; column-gap:64px; }
.mvr-kapitel { display:grid; grid-template-columns:44px 1fr; gap:20px;
  align-items:baseline; padding:16px 0; border-bottom:1px solid var(--mvr-grund-sand); }
.mvr-kapitel-nr { font:400 20px/1 var(--mvr-serif); color:var(--mvr-akzent); }
.mvr-kapitel-name { font-size:17px; line-height:1.5; color:var(--mvr-text-2); }

/* =========================================================================
   TELEFON
   ========================================================================= */

@media (max-width:1023px) {
  .mvr-reihe { grid-template-columns:1fr; }
  .mvr-kapitel-liste { grid-template-columns:1fr; }
  .mvr-band-kopf-innen { grid-template-columns:1fr; gap:32px; }
}
@media (max-width:767px) {
  .mvr-band-karte { --B:120px; grid-template-columns:calc(var(--B) * 1.0767) 1fr;
    gap:18px; padding:16px; }
  .mvr-band-karte-titel { font-size:20px; }
  /* Unter 6 px ist Schrift kein Text mehr, sondern grauer Schmutz. */
  .mvr-band-karte .mvr-reihentitel,
  .mvr-band-karte .mvr-thema,
  .mvr-band-karte .mvr-untertitel,
  .mvr-band-karte .mvr-autor,
  .mvr-band-karte .mvr-namenszug { display:none; }
  .mvr-band-karte .mvr-deckel-kopf { justify-content:flex-end; }
  .mvr-band-kopf .mvr-buch { --B:200px; }

  /* Seitenblöcke: einspaltig, der Kreislauf senkrecht.
     Die Eckpfeile entfallen — untereinander gibt es keine Ecke zu umlaufen;
     der Rücklaufbalken bleibt und trägt die Aussage allein. */
  .mvr-block { padding:44px 20px; }
  .mvr-block--kopf { padding:44px 20px 32px; }
  .mvr-block--kompendium { grid-template-columns:1fr; gap:36px; padding:44px 20px; }
  .mvr-zweispalt, .mvr-zweispalt--wege, .mvr-zweispalt--wann { grid-template-columns:1fr; gap:28px; }
  .mvr-zweispalt p, .mvr-ausgabe-text, .mvr-kreislauf-schluss { font-size:17px; }
  .mvr-kennzahlen { gap:28px; }
  .mvr-kennzahl-wert { font-size:30px; }
  .mvr-schritte { grid-template-columns:1fr; row-gap:14px; }
  .mvr-schritt { padding:22px 20px; }
  .mvr-schritt-titel { font-size:20px; }
  .mvr-pfeil-quer { transform:rotate(90deg); justify-self:center; }
  .mvr-kreislauf { padding-bottom:76px; }
  .mvr-pfeil-ecke { display:none; }
  .mvr-ruecklauf { left:0; right:0; height:auto; padding:14px 18px; }
  .mvr-ruecklauf span { font-size:15px; }
  .mvr-kreislauf-schluss { margin-left:0; margin-right:0; }
  .mvr-ausgabe { grid-template-columns:1fr; gap:14px; }
  .mvr-tafel--kompendium { width:100%; }
  .mvr-knopf { width:100%; text-align:center; padding:18px 20px; font-size:17px; }
  .mvr-block--register { padding:44px 20px; }
  .mvr-register-kopf { flex-direction:column; align-items:flex-start; gap:8px; }
  .mvr-inhalt { padding:44px 0; }
  .mvr-inhalt h2 { font-size:28px; }
}

@media (prefers-reduced-motion:reduce) {
  .mvr-band-karte, .mvr-filter button, .mvr-reiter button { transition:none; }
  .mvr-band-karte:hover, .mvr-filter button:hover, .mvr-reiter button:hover { transform:none; }
}

@media print {
  .mvr-filter, .mvr-reiter { display:none; }
  .mvr-buch { box-shadow:none; }
}

/* =========================================================================
   NACHTRAG BEIM EINBAU — 06.09.2026

   ⚠ Am Telefon (375 px) stand die Seite 18 px über den Rand hinaus.
   Gemessen: die Bandkarte war 373 px breit in einem 335 px breiten
   Container, ihre Textspalte 192 statt der verfügbaren 156.

   Ursache ist `1fr` — das bedeutet `minmax(auto, 1fr)`, und `auto` als
   Minimum ist die MINDESTINHALTSBREITE. Eine Rasterspalte schrumpft damit
   nie unter das, was ihr Inhalt zusammengedrängt braucht; sie sprengt
   lieber den Container. `minmax(0, 1fr)` hebt das Minimum auf.

   Kein einzelnes Wort war zu breit — nachgemessen, alle brechen normal um.
   Es war die Summe der Mindestbreiten.
   ========================================================================= */
@media (max-width: 767px) {
  .mvr-band-karte { grid-template-columns: calc(var(--B) * 1.0767) minmax(0, 1fr); }
  .mvr-band-karte-text { min-width: 0; }
}

/* =========================================================================
   NACHTRAG BEIM EINBAU — Schiene der Website
   06.09.2026, vom Betreiber gemeldet und nachgemessen

   ⚠ Das Paket setzt einen FESTEN Seitenrand: `padding: 80px 160px`.
   Die uebrige Website zentriert dagegen eine Schiene von 1120 px:

       padding-inline: max(var(--mvr-rand), calc((100% - var(--mvr-inhalt)) / 2));

   Diese Regel steht in mvr.css an sechs Stellen und traegt auch die
   Kopfleiste (dort „Korrektur 22"). Beide Wege ergeben bei genau 1440 px
   dasselbe — darueber laufen sie auseinander:

       Fenster 1641 px : Kopf 261..1381 (1120)   Bloecke 160..1481 (1321)

   Der Inhalt stand also 101 px links und 100 px rechts NEBEN der Kante von
   Logo und Klapptaste. Sichtbar wird es erst auf breiten Bildschirmen —
   auf dem Entwurfsmass 1440 nicht.

   Geaendert wird nur das SEITLICHE Polster; die Hoehen des Pakets bleiben.
   `--mvr-rand` und `--mvr-inhalt` kommen aus mvr.css und gelten global,
   auch fuer die Telefonstufen (160 → 80 → 20).
   ========================================================================= */
.mvr-block,
.mvr-block--kopf,
.mvr-block--idee,
.mvr-block--kompendium,
.mvr-block--abschluss,
.mvr-block--register {
  padding-inline: max(var(--mvr-rand), calc((100% - var(--mvr-inhalt)) / 2));
}

/* =========================================================================
   NACHTRAG — Kompendium-Block nach dem Entwurf
   06.09.2026, vom Betreiber gemeldet, am Bildschirm nachgemessen

   ⚠ 1 · Der Text nutzte die Spalte nicht aus.
     Gemessen bei 1641 px Fenster: die Textspalte reicht bis zur Schiene
     (1381), die Absaetze darin endeten bei 1188 — 193 px blieben leer.
     Ursache: `max-width:64ch` an den Absaetzen und `22ch` am Titel.
     Der Entwurf zeigt den Text ueber die ganze Spalte.

     Damit steigt die Zeilenlaenge auf rund 86 Zeichen. Das liegt ueber der
     ueblichen Leseempfehlung von 45-75 — hier aber gewollt: der Block ist
     eine Werbeflaeche mit vier kurzen Absaetzen, kein Fliesstext zum
     Durchlesen, und die Absaetze sind einzeln kurz genug.

   ⚠ 2 · Die Beschriftungen der Ausstattungstafel standen in Versalien.
     `.mvr-tafel-was` traegt `text-transform:uppercase` mit .14em Sperrung.
     Der Entwurf schreibt sie normal: „Format", nicht „FORMAT". Die Sperrung
     machte die Beschriftungsspalte ausserdem so breit, dass der laengste
     Wert („steht mit der ersten Auflage fest") umbrach.

     Nur im Kompendium-Block geaendert — die Angabentafel der Bandseiten
     bleibt, wie sie ist; fuer sie liegt kein abweichender Entwurf vor.
   ========================================================================= */
.mvr-block--kompendium .mvr-kompendium-text p,
.mvr-block--kompendium .mvr-kompendium-titel { max-width: none; }

.mvr-tafel--kompendium .mvr-tafel-was {
  text-transform: none;
  letter-spacing: .01em;
  font-size: 14px;
}

/* =========================================================================
   NACHTRAG — verschenkte Breite in den uebrigen Bloecken
   06.09.2026

   Systematisch gesucht: jedes Element, das mehr als 60 px vor der Schiene
   endet. Fuenf Stellen, gemessen bei 1641 px Fenster (Schiene endet 1381):

     .mvr-zweispalt      max-width 1000px  -> endet 1261, 120 px frei
     .mvr-ausgabe-text   max-width  626px  -> endet 1187, 194 px frei
     .mvr-filter-hinweis max-width  536px  -> endet  797, 584 px frei
     .mvr-abschluss-titel/-text            -> endet  938 / 815

   Die ersten drei laufen im Entwurf bis zum Rand — hier aufgehoben.

   ⚠ Der ABSCHLUSSBLOCK bleibt schmal. Das ist keine verschenkte Breite,
     sondern Absicht: rechts steht der Fuchs. Laeuft der Text darueber,
     liegt heller Text auf dem hellen Fell und der Kontrast bricht ein.
     Dasselbe gilt fuer den Kompendium-Block — dort haelt die Textspalte
     ohnehin bei 1381, also genau auf der Schiene.
   ========================================================================= */
.mvr-block--kopf .mvr-zweispalt,
.mvr-block--idee .mvr-ausgabe-text,
.mvr-block--register .mvr-filter-hinweis { max-width: none; }

/* =========================================================================
   NACHTRAG — Kompendium-Cover nach dem Entwurf
   06.09.2026, Lage aller Bauteile am Bildschirm gegen den Entwurf gemessen

   Gemessen als Anteil der Coverhoehe:

     Bauteil              Entwurf   war      jetzt
     „Zum Nachdenken"      8,7 %    7,4 %    unveraendert, aber LINKS
     „Das Kompendium"     55,7 %   11,0 %    nach unten
     Titel                59,5 %   15,7 %
     Autor                84,0 %   38,8 %

   ⚠ URSACHE der Verschiebung: Bei den 22 Baenden steht zwischen Kopfzeile
     und Textblock die `.mvr-zeichnung` mit `flex:1 1 auto` — sie fuellt den
     Rest und drueckt den Text nach unten. Das Kompendium-Cover hat keine
     Zeichnung; der Fuchs liegt als absolute Flaeche darueber. Damit fehlte
     das dehnbare Glied, und der ganze Textblock rutschte nach oben.
     `margin-top:auto` uebernimmt diese Aufgabe.

   ⚠ Der Reihentitel stand RECHTS. `.mvr-deckel-kopf--nur-nummer` traegt
     `justify-content:flex-end` — gedacht fuer den Fall „nur Nummernfeld,
     kein Reihentitel". Beim Kompendium ist es genau umgekehrt: nur der
     Reihentitel, kein Nummernfeld. Er gehoert damit nach links.

   ⚠ Der Schatten war zu schwach. Das Cover steht auf dunklem Grund; die
     Vorgabe dafuer lautet `rgba(0,0,0,.5)` statt der 22 % fuer helle
     Flaechen (20-MASSE-UND-FARBEN.md, Abschnitt Schatten). Die Klasse
     `mvr-buch--auf-dunkel` traegt das Kompendium-Cover nicht, weil es
     ueber `_buchcover-kompendium.php` erzeugt wird — hier nachgeholt.
   ========================================================================= */

/* Ohne Ruecken ist der Deckel das ganze Buch. */
.mvr-buch--kompendium { box-shadow: 12px 12px 0 rgba(0, 0, 0, .5); }

/* Der Reihentitel steht allein — also links, nicht rechts. */
.mvr-deckel--kompendium .mvr-deckel-kopf--nur-nummer { justify-content: flex-start; }

/* Der Textblock sitzt unten; darueber bleibt die Flaeche mit dem Fuchs. */
.mvr-deckel--kompendium .mvr-deckel-text { margin-top: auto; }

/* =========================================================================
   NACHTRAG — Titelgroesse des Kompendium-Covers
   06.09.2026

   ⚠ Im Entwurf steht „Gesteuerter Vertrieb" in ZWEI Zeilen, auf der Seite
   stand es in einer. Der Umbruch ist kein Zufall, sondern Folge der
   Schriftgroesse — und die weicht ab.

   Hergeleitet, nicht geschaetzt: im Entwurfsbild ist das Wort
   „Gesteuerter" 46 % der Coverbreite breit, auf der Seite 39 %.
   Faktor 1,18 auf die 7 % der Masstabelle ergibt 8,3 % von B.

   Gegenprobe: bei 8,3 % misst „Gesteuerter Vertrieb" einzeilig 241 px,
   der Textbereich ist 232 px breit (77,3 % von B) — der Umbruch tritt
   also ein, mit 9 px Reserve.

   Nur das KOMPENDIUM-Cover. Die 22 Bandcover bleiben bei den 7 %, die
   20-MASSE-UND-FARBEN.md vorschreibt; fuer sie zeigt der Entwurf keine
   Abweichung.

   Nebenwirkung, die so gewollt ist: der zweizeilige Titel schiebt
   Zierlinie, Untertitel und Autor nach unten — naeher an die Lage, die
   der Entwurf zeigt (74 / 78 / 84 % der Coverhoehe).
   ========================================================================= */
.mvr-deckel--kompendium .mvr-bandtitel { font-size: calc(var(--B) * .083); }

/* =========================================================================
   NACHTRAG — Bandseite: der Kopfbereich kannte die Schiene nicht
   06.09.2026

   ⚠ `.mvr-band-kopf` traegt `padding: 72px 0 80px` — seitlich NULL.
   Gemessen bei 1885 px Fenster (Schiene 383..1503):

     Cover               0 .. 323     383 px zu weit links, klebt am Rand
     Reiter              0 .. 323     dito
     H1, Text, Tafel   379 .. 1885    382 px zu weit rechts
     „Aus dem Inhalt"  383 .. 1503    richtig

   Der untere Teil sass richtig, der Kopfbereich nicht — deshalb stand das
   Cover mit seinem Ruecken halb ausserhalb des Bildes, und die
   Angabentafel lief bis an den Fensterrand.

   Dieselbe Regel wie fuer die Bloecke der Uebersicht: die FLAECHE bleibt
   voll (der Fuchs soll ueber die ganze Breite laufen), nur der INHALT
   sitzt auf der Schiene. Darum das Polster am Kopf, nicht am Innenteil.
   ========================================================================= */
.mvr-band-kopf {
  padding-inline: max(var(--mvr-rand), calc((100% - var(--mvr-inhalt)) / 2));
}

/* =========================================================================
   NACHTRAG — Bandseite nach dem Entwurf
   06.09.2026

   Der Entwurf zeigt gegenueber dem Paket:
     · Kicker mit Bandnummer: „BAND 01 · 1X1 DES VERTRIEBS"
     · Ausstattungstafel LINKS unter dem Cover, nicht rechts neben dem Text
     · Richtungsmarken unter dem Klappentext
     · einen Kasten, der die gewaehlte Ausstattung erklaert
     · Knoepfe „Frage zu diesem Band stellen" / „Beratung zum Thema",
       darunter ein Satz, warum es zwei Wege gibt
     · beim Wechsel auf „Arbeitsbuch" aendert sich AUCH das Cover
   ========================================================================= */

/* Linke Spalte: Reiter, Cover, Tafel — alle auf einer Flucht. */
.mvr-band-spalte { display: flex; flex-direction: column; gap: 18px; }
.mvr-band-spalte .mvr-tafel { width: 100%; background: rgba(251, 234, 212, .06); }

/* Der Untertitel steht groesser als der Fliesstext, in Schrift auf Dunkel. */
.mvr-band-untertitel { margin: 0 0 4px; font-size: 21px; line-height: 1.5;
  color: var(--mvr-schrift-auf-dunkel-2); max-width: 46ch; }
.mvr-band-kopf .mvr-zierbalken { margin: 18px 0 26px; }

/* Richtungsmarken auf dunklem Grund — dieselbe Form wie auf den Karten,
   andere Farben, weil #725229 dort unlesbar waere. */
.mvr-marken--band { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; }
.mvr-marken--band .mvr-marke { border-color: rgba(208, 183, 152, .5);
  color: var(--mvr-schrift-auf-dunkel-2); background: transparent; }

/* Was die gewaehlte Ausstattung bedeutet. */
.mvr-ausgabe-kasten { margin: 26px 0 0; padding: 22px 26px;
  border: 1px solid rgba(208, 183, 152, .38);
  background: rgba(251, 234, 212, .06); }
.mvr-ausgabe-kasten p { margin: 0; font-size: 17px; line-height: 1.65;
  color: var(--mvr-schrift-auf-dunkel); }
.mvr-ausgabe-marke { margin: 0 0 10px !important; font-size: 11px;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--mvr-schrift-auf-dunkel-2) !important; }

/* Zwei Wege, zwei Gewichte: der erste Knopf traegt die Flaeche. */
.mvr-band-kopf .mvr-knoepfe { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.mvr-band-kopf .mvr-knopf { background: var(--mvr-grund-sand);
  border: 1px solid var(--mvr-grund-sand); color: var(--mvr-text-stark);
  padding: 17px 34px; font-size: 16px; }
.mvr-knopf--zweit { background: transparent !important;
  border: 1px solid rgba(208, 183, 152, .55) !important;
  color: var(--mvr-schrift-auf-dunkel) !important; }
.mvr-knoepfe-hinweis { margin: 14px 0 0; font-size: 14px; line-height: 1.6;
  color: var(--mvr-schrift-auf-dunkel-2); max-width: 62ch; }

/* Platzhalter fuer das Kundenlogo — gestrichelt, damit er als Leerstelle
   lesbar ist und nicht als Marke eines echten Kunden. */
.mvr-kundenlogo--platzhalter {
  display: flex; align-items: center; justify-content: center;
  width: calc(var(--B) * .28); height: calc(var(--B) * .11);
  border: 1px dashed var(--mvr-zier);
  font: 400 calc(var(--B) * .026)/1 var(--mvr-mono);
  color: var(--mvr-akzent); flex: none;
}

@media (max-width: 1023px) {
  .mvr-band-spalte { align-items: flex-start; }
  .mvr-band-spalte .mvr-tafel { width: auto; min-width: calc(var(--B) * 1.0767); }
}

/* ⚠ Die linke Spalte braucht eine FESTE Breite.
   `grid-template-columns: auto 1fr` gibt der ersten Spalte, was ihr Inhalt
   mindestens braucht — und die Ausstattungstafel mit `width:100%` ist darin
   zirkulaer: sie will 100 % einer Spalte, deren Breite sie selbst bestimmt.
   Gemessen: linke Spalte 829 px, rechte 220 px. Die laengste Tafelzeile
   („Ringbindung — empfohlen, damit das Buch beim Arbeiten flach liegt")
   hatte die Spalte aufgezogen.

   Die Breite ist die des Buches: Deckel plus Ruecken = 107,67 % von B.
   Das Kompendium hat keinen Ruecken, dort ist es genau B. */
.mvr-band-spalte { width: calc(var(--B) * 1.0767); flex: none; }
.mvr-band-spalte:has(.mvr-buch--kompendium) { width: var(--B); }

@media (max-width: 1023px) {
  .mvr-band-spalte,
  .mvr-band-spalte:has(.mvr-buch--kompendium) { width: 100%; max-width: 360px; }
}


/* =========================================================================
   „Literatur mit angrenzenden Themen" — aus dem Paket vom 06.09.2026
   uebernommen (40-NACHLIEFERUNG.md, Punkt 5).

   Woertlich aus css/mvr-publikationen.css des Pakets; nur der feste
   Seitenrand ist auf die Schiene der Website gezogen, wie bei allen
   anderen Bloecken auch.
   ========================================================================= */
.mvr-block--angrenzend { background:#fff; padding:0 160px 88px; }
.mvr-angrenzend-innen { border-top:1px solid #D0B798; padding-top:40px; }
.mvr-block--angrenzend .mvr-block-titel { margin:0 0 28px; font-size:30px; }
.mvr-angrenzend-reihe { display:grid; grid-template-columns:repeat(4,1fr); gap:28px; }
.mvr-angrenzend-karte { display:flex; flex-direction:column; gap:10px;
  text-decoration:none; border:1px solid #D0B798; padding:20px;
  transition:transform .16s ease, border-color .16s ease; }
.mvr-angrenzend-karte:hover { transform:translateY(-2px); border-color:var(--mvr-zier); }
.mvr-angrenzend-nr { font:400 22px/1 var(--mvr-serif); color:var(--mvr-akzent); }
.mvr-angrenzend-thema { font-size:12px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--mvr-akzent); }
.mvr-angrenzend-titel { font:400 19px/1.3 var(--mvr-serif); color:var(--mvr-text-stark); }

@media (max-width: 767px) {
  .mvr-block--angrenzend { padding:0 20px 44px; }
  .mvr-angrenzend-reihe { grid-template-columns:1fr 1fr; gap:14px; }
  .mvr-angrenzend-karte { padding:16px; }
  .mvr-angrenzend-titel { font-size:17px; }
}

/* Schiene statt festem Rand — siehe Nachtrag „Schiene der Website". */
.mvr-block--angrenzend {
  padding-inline: max(var(--mvr-rand), calc((100% - var(--mvr-inhalt)) / 2));
}

/* =========================================================================
   NACHTRAG — der Kopfbereich schliesst unten buendig ab
   06.09.2026, vom Betreiber gemeldet

   ⚠ Gemessen bei Band 01: linke Spalte 184..1055, rechte 184..982 —
   73 px Unterschied, und unter der rechten Spalte blieben 153 px leere
   Flaeche mit dem Fuchs darin. Das Raster stand auf `align-items:start`,
   also endete jede Spalte, wo ihr Inhalt endet.

   ⚠ Warum NICHT `space-between` ueber alle Kinder: die Klappentexte reichen
   von 218 bis 759 Zeichen. Bei den kurzen Baenden waere der Unterschied
   nicht 73, sondern gegen 240 px — verteilt auf acht Luecken faellt das
   als ungleicher Zeilenabstand auf. Der Abstand wandert darum an EINE
   Stelle, und zwar vor die Knopfzeile: dort trennt er zwei Bloecke, die
   ohnehin getrennt sind, und die Knoepfe stehen auf einer Linie mit dem
   Ende der Ausstattungstafel.
   ========================================================================= */
.mvr-band-kopf-innen { align-items: stretch; }
.mvr-band-kopf-innen > *:last-child { display: flex; flex-direction: column; }
/* ⚠ `margin-top: auto` schiebt die Knoepfe an den unteren Rand, damit sie mit
   dem Cover abschliessen. Das setzt voraus, dass die rechte Spalte kuerzer ist
   als die linke — sonst bleibt nichts zum Ausgleichen, und auto wird 0. Genau
   das trat ein, als der Fragenblock dazukam: die Knoepfe klebten am
   Ausgabe-Kasten. Das `padding-top` frisst auto nicht auf und sichert den
   Mindestabstand in beiden Faellen. */
.mvr-band-kopf-innen > *:last-child .mvr-knoepfe { margin-top: auto;
  padding-top: 26px; }

@media (max-width: 1023px) {
  /* Einspaltig gibt es nichts auszugleichen — der Abstand waere dann
     eine Luecke ohne Gegenueber. */
  .mvr-band-kopf-innen > *:last-child .mvr-knoepfe { margin-top: 26px; }
}

/* =========================================================================
   NACHTRAG — Ausstattungstafel der Bandseite
   06.09.2026, vom Betreiber gemeldet: „Ringbindung — empfohlen, damit das
   Buch beim Arbeiten flach liegt" bricht in DREI Zeilen statt in zwei.

   ⚠ Die Spaltenbreite war es NICHT. Aus der Gesamtansicht des Entwurfs
   gemessen: die linke Spalte nimmt dort 228 von 778 px Inhaltsbreite ein
   = 29,3 %; auf der Seite sind es 323 von 1105 = 29,2 %. Gleiche Proportion.

   Die Ursache ist die BESCHRIFTUNG. `.mvr-tafel-was` steht in gesperrten
   Versalien (.14em, uppercase) und ist damit 65 px breit; im Entwurf steht
   dort „Bindung" in normaler Schreibweise, umgerechnet rund 48 px. Die
   17 px fehlten dem Wert: er hatte 196 px, gebraucht werden 210.

   Dieselbe Aenderung wie beim Kompendium-Cover, dort schon am 06.09.
   Damit stehen beide Ausstattungstafeln der Seite gleich.
   ========================================================================= */
.mvr-band-spalte .mvr-tafel-was {
  text-transform: none;
  letter-spacing: .01em;
  font-size: 14px;
}

/* Nach der schmaleren Beschriftung fehlten noch ZWEI Pixel: der Wert hatte
   211 px, die laengere der beiden Zeilen („das Buch beim Arbeiten flach
   liegt") braucht 213. Auf Kante gebaut wuerde der Umbruch bei jeder
   Schriftaenderung zurueckkommen — darum Reserve an zwei Stellen:

     Cover und Spalte   300 -> 315 px  (+16 px Spaltenbreite)
     Abstand Beschriftung/Wert  24 -> 18 px  (+6 px)

   Der Wert bekommt damit 233 statt 211 px, 20 px mehr als noetig. Die linke
   Spalte kommt auf 30,7 % der Inhaltsbreite; der Entwurf zeigt 29,3 %.

   ⚠ Nur im Kopfbereich der Bandseite. Die Karten der Reihenuebersicht
   setzen ihr eigenes `--B` (240), das Kompendium-Cover der Uebersicht
   haengt dagegen am `--B` von `.mvr-pub` und bliebe sonst mitgewachsen. */
.mvr-band-kopf { --B: 315px; }
.mvr-band-spalte .mvr-tafel-zeile { gap: 18px; }


/* =========================================================================
   NACHTRAG — Rueckweg von der Bandseite zur Reihe
   06.09.2026, vom Betreiber gewuenscht

   Der Entwurf sieht keinen Rueckverweis vor; wer einen Band geoeffnet hat,
   kam nur ueber die Zuruecktaste des Browsers oder das Menue zurueck.

   Der Verweis zeigt auf `#die-baende`, also auf den Beginn der Bandliste —
   nicht auf den Seitenanfang. Davor liegen sechs Bloecke, an denen niemand
   ein zweites Mal vorbeiscrollen will.
   ========================================================================= */
.mvr-zurueck-zeile { margin: 0 0 26px; }
.mvr-zurueck {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 15px; letter-spacing: .02em; text-decoration: none;
  color: var(--mvr-schrift-auf-dunkel-2);
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
}
.mvr-zurueck::before { content: '\2190'; font-size: 17px; line-height: 1; }
.mvr-zurueck:hover,
.mvr-zurueck:focus-visible {
  color: var(--mvr-schrift-auf-dunkel);
  border-bottom-color: var(--mvr-zier);
}

/* Der angesprungene Block darf nicht unter der Kopfleiste liegen. */
#die-baende { scroll-margin-top: 24px; }


/* =========================================================================
   NACHTRAG — zweiter Rueckweg am Seitenende
   07.09.2026, vom Betreiber gemeldet

   ⚠ Der Rueckverweis stand nur im Kopfbereich. Weil die Kopfleiste der
   Website `sticky` ist, sieht ein Bildschirmfoto beim Scrollen wie der
   Seitenanfang aus — der Verweis ist aber laengst nach oben herausgelaufen.
   Wer unten angekommen ist, hatte nur noch das Menue.

   Der zweite steht nach dem Empfehlungsblock, also am Ende des Weges.
   Er liegt auf HELLEM Grund und braucht darum andere Farben als der obere.
   ========================================================================= */
.mvr-zurueck-zeile--unten {
  margin: 0;
  padding: 0 max(var(--mvr-rand), calc((100% - var(--mvr-inhalt)) / 2)) 72px;
  background: #fff;
}
.mvr-zurueck-zeile--unten .mvr-zurueck { color: var(--mvr-akzent); }
.mvr-zurueck-zeile--unten .mvr-zurueck:hover,
.mvr-zurueck-zeile--unten .mvr-zurueck:focus-visible {
  color: var(--mvr-text-stark);
  border-bottom-color: var(--mvr-zier);
}

/* Das Kompendium hat keinen Empfehlungsblock — dann traegt diese Zeile den
   Abschluss der Seite und braucht oben Luft. */
.mvr-inhalt + .mvr-zurueck-zeile--unten,
.mvr-band-kopf + .mvr-zurueck-zeile--unten { padding-top: 56px; }

@media (max-width: 767px) {
  .mvr-zurueck-zeile--unten { padding-bottom: 44px; }
}

/* =========================================================================
   NACHTRAG — Arbeitsbuch: Nummernfeld rechts unter das Logo
   19.09.2026, Hinweis des Betreibers

   ⚠ Beim Arbeitsbuch belegt das Kundenlogo („[Ihr Logo]") den Platz oben
   rechts, an dem in der Leseausgabe das Nummernfeld steht. Das Nummernfeld
   folgt deshalb als eigenes Element unter der Kopfzeile — dafuer gab es aber
   keine Regel, und es rutschte an den LINKEN Rand, unter den Reihentitel.

   Jetzt: rechtsbuendig, direkt unter dem Logo, mit kleinem Abstand. Die
   Kopfzeile bleibt unveraendert; nur das Feld wandert.
   ========================================================================= */
.mvr-nummernfeld--arbeit { align-self: flex-end; position: relative; z-index: 2;
  margin-top: calc(var(--B) * .03); }

/* NACHTRAG 19.09.2026 — Nachbarbaende am Telefon
   1fr hat als Mindestbreite die Inhaltsbreite: ein langes Wort im Titel
   dehnte die Spalte, die Seite wurde bis zu 45 px breiter als das Telefon.
   minmax(0,1fr) laesst die Spalten gleich breit, der Text bricht um. */
.mvr-angrenzend-reihe { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.mvr-angrenzend-karte { min-width: 0; overflow-wrap: anywhere; hyphens: auto; }
@media (max-width: 767px) {
  .mvr-angrenzend-reihe { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* =========================================================================
   NACHTRAG 19.09.2026 — weiche Schatten statt Blockschatten
   Wunsch des Betreibers: „die Schatten sind generell zu hart“ — bei den
   Bänden, beim Kompendium und in der Einzelansicht. Bisher Unschärfe 0
   (Blockschatten nach 20-MASSE-UND-FARBEN.md). Jetzt: das Buch liegt auf
   dem Tisch — wenig Versatz, breit verwischt, dazu eine feine Kontaktlinie.
   Bewusste Abweichung von der Designvorgabe.
   ========================================================================= */
.mvr-buch {
  box-shadow:
    0 calc(var(--B) * .006) calc(var(--B) * .012) rgba(29,56,73,.18),
    0 calc(var(--B) * .03)  calc(var(--B) * .09)  rgba(29,56,73,.16); }
.mvr-buch--auf-dunkel, .mvr-buch--kompendium {
  box-shadow:
    0 calc(var(--B) * .006) calc(var(--B) * .012) rgba(0,0,0,.30),
    0 calc(var(--B) * .03)  calc(var(--B) * .09)  rgba(0,0,0,.35); }
@media print { .mvr-buch, .mvr-buch--auf-dunkel, .mvr-buch--kompendium { box-shadow:none; } }  /* Druck ohne Schatten, wie oben */

/* NACHTRAG 19.09.2026, zweite Runde — „so wie das Kontaktformular“.
   Dieselbe Form wie .mvr-kontaktkarte (mvr.css): Licht von links oben,
   zwei weiche Schichten nach rechts unten (Verhaeltnis 26:19 und 54:39),
   auf die Buchbreite umgerechnet — ein Buch ist kleiner als die Karte.
   Auf dunklem Grund dieselben Deckkraefte wie die Karte, auf hellem Grund
   im Blauton der Website und etwas leichter. */
.mvr-buch {
  box-shadow:
    calc(var(--B) * .045) calc(var(--B) * .033) calc(var(--B) * .07)  calc(var(--B) * -.007) rgba(29,56,73,.45),
    calc(var(--B) * .094) calc(var(--B) * .068) calc(var(--B) * .156) calc(var(--B) * -.024) rgba(29,56,73,.35); }
.mvr-buch--auf-dunkel, .mvr-buch--kompendium {
  box-shadow:
    calc(var(--B) * .045) calc(var(--B) * .033) calc(var(--B) * .07)  calc(var(--B) * -.007) rgba(3,9,14,.72),
    calc(var(--B) * .094) calc(var(--B) * .068) calc(var(--B) * .156) calc(var(--B) * -.024) rgba(3,9,14,.58); }
@media print { .mvr-buch, .mvr-buch--auf-dunkel, .mvr-buch--kompendium { box-shadow:none; } }

/* =========================================================================
   FRAGEN, DIE DER BAND BEANTWORTET
   Steht im dunklen Bandkopf zwischen Klappentext und Richtungsmarken.
   Bewusst ohne vollen Rahmen: Der Ausgabe-Kasten darunter ist gerahmt, und
   zwei Kaesten uebereinander lassen den Kopf zerfallen. Eine Kante genuegt.
   ========================================================================= */

.mvr-bandfragen { margin: 26px 0 0; padding: 2px 0 2px 20px;
  border-left: 3px solid rgba(208, 183, 152, .5); }
.mvr-bandfragen-marke { margin: 0 0 12px; font-size: 11px; letter-spacing: .18em;
  text-transform: uppercase; color: var(--mvr-schrift-auf-dunkel-2); }
.mvr-bandfragen-liste { margin: 0; padding: 0; list-style: none; }
.mvr-bandfragen-liste li { margin: 0 0 9px; font-size: 17px; line-height: 1.55;
  color: var(--mvr-schrift-auf-dunkel); }
.mvr-bandfragen-liste li:last-child { margin-bottom: 0; }

@media (max-width: 767px) {
  .mvr-bandfragen { padding-left: 14px; }
  .mvr-bandfragen-liste li { font-size: 16px; }
}
