/* Edition Glashaus · Wien
   Konzept „Das Buch“: Frontispiz, Titel, Inhalt, Motto, Kapitel, Kolophon – auf einer Mittelachse.
   Eine Schriftfamilie (EB Garamond) mit echten Kapitälchen und Mediävalziffern, Blau als einziger Akzent.
   Abstände nur aus der Skala --s0 … --s7 (Vielfache von 0,5 rem).

   1 Tokens · 2 Basis · 3 Typografie · 4 Bausteine · 5 Kopfzeile · 6 Frontispiz · 7 Inhalt & Motto
   8 Kapitel · 9 Formular · 10 Kolophon · 11 Unterseiten · 12 Responsive · 13 Bewegung */

@font-face{font-family:"EB Garamond";font-style:normal;font-weight:400 800;font-display:swap;src:url("../fonts/ebgaramond-latin-normal.woff2?v=810a126e") format("woff2")}
@font-face{font-family:"EB Garamond";font-style:italic;font-weight:400 800;font-display:swap;src:url("../fonts/ebgaramond-latin-italic.woff2?v=4deec025") format("woff2")}

/* ============ 1 · Tokens ============ */
:root{
  --ink:#111114;
  --muted:#66666C;          /* 5,6 : 1 auf Weiß */
  --rule:#DDDCD7;
  --rule-strong:#B9B8B2;
  --blue:#0A1FF0;
  --tint:#F6F5F1;
  --white:#fff;
  --error:#B3141F;

  --serif:"EB Garamond",Garamond,"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;

  /* Abstandsskala */
  --s0:.5rem; --s1:1rem; --s2:1.5rem; --s3:2rem; --s4:3rem; --s5:4rem; --s6:6rem; --s7:8rem;

  --g:clamp(1.25rem,5vw,3rem);          /* Seitenrand */
  --measure:38rem;                       /* Lesespalte */
  --wide:68rem;                          /* breite Spalte */
  --sec:clamp(5rem,9vw,8rem);            /* Abstand über und unter jedem Kapitel */
  --hh:4.5rem;                           /* Höhe Kopfzeile */
  --ease:cubic-bezier(.2,.7,.2,1);

  --fs-sc:1.25rem;                       /* Kapitälchen-Rubriken (echte Kapitälchen der EB Garamond) */
}

/* ============ 2 · Basis ============ */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hh) + var(--s2));-webkit-text-size-adjust:100%;color-scheme:light}
body{
  margin:0;background:var(--white);color:var(--ink);
  font-family:var(--serif);font-size:1.3125rem;line-height:1.55;font-weight:400;
  font-kerning:normal;font-synthesis:none;font-variant-numeric:oldstyle-nums proportional-nums;font-variant-ligatures:common-ligatures;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img,svg{display:block;max-width:100%}
button,input,select,textarea{font-family:inherit}
[hidden]{display:none!important}
a{color:inherit}
::selection{background:var(--blue);color:var(--white)}
:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.hero :focus-visible{outline-color:var(--white)}
p{margin:0 0 1em;text-wrap:pretty}
p:last-child{margin-bottom:0}
ul,ol{margin:0;padding:0;list-style:none}
.skip{position:absolute;left:-999px;top:var(--s0);background:var(--ink);color:var(--white);padding:var(--s0) var(--s1);z-index:200}
.skip:focus{left:var(--s0)}

/* ============ 3 · Typografie ============ */
h1,h2,h3{margin:0;font-weight:400;text-wrap:balance}
h1{font-size:clamp(2.75rem,5.4vw + .5rem,5.75rem);font-weight:400;line-height:1.04;letter-spacing:-.025em}
h2{font-size:clamp(2.125rem,3.2vw + .6rem,3.5rem);font-weight:400;line-height:1.1;letter-spacing:-.018em}
h3{font-size:1.5rem;font-weight:500;line-height:1.25;letter-spacing:-.005em}
em,i{font-style:italic}

/* Kapitälchen (die Schrift hat keine echten; Versalien, kleiner, gesperrt, etwas kräftiger) */
.sc,.kicker,.nav a,.mnav a,.btn,.link,.field label,.foot-links a{
  font-size:var(--fs-sc);font-weight:500;letter-spacing:.07em;text-transform:none;font-variant-caps:all-small-caps;line-height:1.3;font-style:normal
}

/* ============ 4 · Bausteine ============ */
.col{width:min(100% - 2 * var(--g),var(--measure));margin-inline:auto}
.wide{width:min(100% - 2 * var(--g),var(--wide));margin-inline:auto}
.center{text-align:center}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--s0);
  padding:1.0625rem 1.75rem;border:1px solid var(--blue);background:var(--blue);color:var(--white);
  text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .2s,border-color .2s,color .2s;
}
.btn:hover{background:var(--ink);border-color:var(--ink)}
.link{display:inline-block;color:var(--blue);text-decoration:none;padding-bottom:.375rem;border-bottom:1px solid currentColor;transition:color .2s}
.link:hover{color:var(--ink)}
.vignette{display:block;border:0;margin:0 auto;width:3rem;aspect-ratio:344/281.5;height:auto;background:url("../img/logo-s.svg?v=01363b75") center/contain no-repeat}

/* Logo-Zeile: Haus links, Schriftzug optisch mittig dazu (Versalien auf Hausmitte) */
.lockup{display:inline-flex;align-items:center;gap:.6em;white-space:nowrap;font-weight:500;letter-spacing:.12em;text-transform:uppercase;line-height:1;text-decoration:none;color:var(--ink)}
.lockup img{display:block;flex:none;height:2.5cap;width:auto}
.lockup span{display:block;text-box:trim-both cap alphabetic;margin-right:-.12em}
@supports not (text-box:trim-both cap alphabetic){.lockup span{transform:translateY(.09em)}}

/* ============ 5 · Kopfzeile ============ */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);border-bottom:1px solid var(--rule)}
.bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:var(--hh);padding-inline:var(--g)}
.nav--l{justify-self:start}
.nav--r{justify-self:end}
.nav ul{display:flex;gap:var(--s3)}
.nav a{
  display:block;padding:var(--s0) 0;text-decoration:none;
  background:linear-gradient(currentColor,currentColor) 0 calc(100% - .25rem)/0 1px no-repeat;transition:background-size .3s var(--ease)
}
.nav a:hover,.nav a[aria-current="true"]{background-size:100% 1px}
.nav a.accent{color:var(--blue)}
.nav .has-sub{position:relative}
.nav .has-sub > a::after{content:"";display:inline-block;width:.32em;height:.32em;margin:0 0 .22em .55em;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);vertical-align:middle}
.nav .sub{position:absolute;top:100%;left:50%;display:block;min-width:13rem;margin-top:.75rem;padding:var(--s0) 0;background:var(--white);border:1px solid var(--rule);box-shadow:0 1.25rem 2rem -1.5rem rgba(17,17,20,.35);opacity:0;visibility:hidden;transform:translate(-50%,-.375rem);transition:opacity .2s,transform .2s var(--ease),visibility 0s .2s;z-index:60}
.nav .sub::before{content:"";position:absolute;left:0;right:0;top:-1rem;height:1rem}
.nav .has-sub:hover .sub,.nav .has-sub:focus-within .sub{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .2s,transform .2s var(--ease),visibility 0s}
.nav .sub li{display:block}
.nav .sub a{display:block;padding:.625rem 1.25rem;white-space:nowrap;background:none;text-align:center}
.nav .sub a:hover,.nav .sub a:focus-visible{color:var(--blue)}
.brand{font-size:1.125rem}
.menu-btn{display:none;width:2.75rem;height:2.75rem;margin-right:-.625rem;border:0;background:none;color:var(--ink);cursor:pointer;padding:0;justify-self:end}
.menu-btn span{display:block;width:1.375rem;height:1px;background:currentColor;margin:.375rem auto;transition:transform .3s var(--ease)}
.menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(.21875rem) rotate(45deg)}
.menu-btn[aria-expanded="true"] span:nth-child(2){transform:translateY(-.21875rem) rotate(-45deg)}
.mnav{display:none}
.progress{position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--blue);transform:scaleX(var(--p,0));transform-origin:left;pointer-events:none}

/* ============ 6 · Frontispiz ============ */
.hero{position:relative;overflow:hidden;background:var(--blue);color:var(--white)}
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.12) 0 1px,transparent 1px 4rem),
    repeating-linear-gradient(0deg,rgba(255,255,255,.12) 0 1px,transparent 1px 4rem);
  background-position:center center;
  -webkit-mask-image:radial-gradient(ellipse 70% 70% at 50% 45%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 70% 70% at 50% 45%,#000 20%,transparent 75%);
}
.hero-inner{
  position:relative;min-height:min(calc(100svh - var(--hh)),56rem);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  padding:var(--s5) var(--g)
}
.plate{margin:0 0 var(--s3)}
.plate .mark{width:clamp(12rem,19vw,17rem);height:auto;margin-inline:auto}
.hero h1{max-width:11em}
.hero h1 em{font-weight:400}
.hero-lead{max-width:34em;margin:var(--s3) auto 0;font-size:1.25rem;line-height:1.5;opacity:.9}
@keyframes fade{to{opacity:var(--o,1)}}
.mark path[pathLength]{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.5s var(--ease) forwards;animation-delay:var(--d,0s)}
.mark > circle{opacity:0;animation:pop .6s ease forwards 1.6s}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes pop{to{opacity:1}}

/* ============ 7 · Inhalt & Motto ============ */
.toc-sec{padding-block:var(--sec)}
.kicker{display:flex;justify-content:center;align-items:baseline;gap:.75rem;margin:0;color:var(--blue)}
.toc-sec .kicker{margin-bottom:var(--s4)}
.toc a{display:flex;align-items:baseline;gap:.75rem;padding:.625rem 0;text-decoration:none}
.toc .n{flex:none;width:2.25rem;color:var(--blue);font-style:italic}
.toc .t{flex:none;font-size:1.375rem;letter-spacing:-.005em;transition:color .2s}
.toc .dots{flex:1 1 auto;min-width:var(--s3);border-bottom:2px dotted var(--rule-strong)}
.toc .s{flex:none;font-style:italic;color:var(--muted);font-size:1.0625rem}
.toc a:hover .t{color:var(--blue)}

.motto{padding-block:var(--sec)}
.motto figure{margin-block:0;text-align:center}
.motto blockquote{margin:0}
.motto blockquote p{font-style:italic;font-weight:400;font-size:clamp(1.75rem,2.4vw + .6rem,2.625rem);line-height:1.24;letter-spacing:-.012em;text-wrap:balance}
.motto figcaption{margin-top:var(--s3);color:var(--muted);font-size:1rem}
.motto figcaption .sc{color:var(--ink);margin-right:.5rem}

/* ============ 8 · Kapitel ============ */
.chapter{padding-block:var(--sec)}
.chapter > * + *{margin-top:var(--s5)}
.ch-head{text-align:center}
.ch-head .kicker{margin-bottom:var(--s3)}
.kicker .num::after{content:"·";margin-left:.75rem}
.ch-head h2{max-width:15em;margin-inline:auto}
.ch-head h2 em,.punch em{color:var(--blue)}

/* Programm */
.pair{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--s5)}
.pair > article{display:grid;grid-row:span 3;grid-template-rows:subgrid;align-content:start}
.pair > article > *{margin-bottom:0}
.pair h3{margin-bottom:var(--s1)}
.topics{margin-top:var(--s3);border-top:1px solid var(--rule)}
.topics li{display:grid;grid-template-columns:12.5rem 1fr;gap:var(--s1);align-items:baseline;padding:.875rem 0;border-bottom:1px solid var(--rule)}
.topics .t{font-weight:500}
.topics .d{font-style:italic;color:var(--muted);font-size:1.0625rem;line-height:1.45}

/* Bücher */
.covers{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s3);max-width:58rem}
.cover{margin:0}
.cover .ph{position:relative;aspect-ratio:2/3;display:grid;place-items:center;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.cover .ph::after{content:"";position:absolute;inset:.75rem;border:1px solid currentColor;pointer-events:none}
.cover:hover .ph{transform:translateY(-.375rem);box-shadow:0 1.5rem 2.5rem -1.75rem rgba(17,17,20,.5)}
.cover:nth-child(1) .ph{background:var(--blue);color:#0717C4}
.cover:nth-child(2) .ph{background:var(--ink);color:#26262C}
.cover:nth-child(3) .ph{background:var(--tint);color:#E4E2D9}
.cover .ph svg{width:38%;height:auto}
.cover figcaption{margin-top:var(--s2);text-align:center;display:flex;flex-direction:column;gap:.25rem}
.cover .st{font-style:italic;color:var(--muted);font-size:1.0625rem}

/* Verlag */
@supports (initial-letter:2) or (-webkit-initial-letter:2){
  .initial::first-letter{-webkit-initial-letter:2;initial-letter:2;color:var(--blue);font-weight:400;margin-right:.18em}
}
.lemma{padding-block:var(--s3);border-block:1px solid var(--rule)}
.lemma .hw{font-size:1.5rem;line-height:1.3;margin-bottom:var(--s1)}
.lemma .hw b{font-weight:600}
.lemma .hw i{color:var(--muted)}
.lemma ol{counter-reset:s;margin-bottom:var(--s2)}
.lemma ol li{counter-increment:s;display:grid;grid-template-columns:1.75rem 1fr}
.lemma ol li::before{content:counter(s) ".";font-style:italic;color:var(--muted)}
.lemma .rda{font-style:italic}
.lemma .rda .sc{display:block;margin-bottom:.25rem;color:var(--muted)}
.punch{margin:var(--s5) 0 0;text-align:center;font-size:clamp(1.75rem,2.2vw + .6rem,2.5rem);font-weight:400;line-height:1.2;letter-spacing:-.012em;text-wrap:balance}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);margin-bottom:0;text-align:center}
.facts dt{font-size:clamp(2.25rem,2.6vw + .75rem,3rem);font-weight:400;line-height:1;letter-spacing:-.02em}
.facts dd{margin:var(--s2) 0 0;color:var(--muted);font-style:italic;font-size:1.0625rem;line-height:1.45}
.facts dd .sc{display:block;margin-bottom:.375rem;color:var(--blue)}

/* Menschen */
.people{max-width:48rem;text-align:center}
.people-h{margin-bottom:var(--s4)}
.people-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5)}
.person{display:flex;flex-direction:column;align-items:center}
.person-photo{margin:0 0 var(--s3);width:100%;max-width:20rem;aspect-ratio:4/5;background:var(--tint);overflow:hidden}
.person-photo{position:relative;isolation:isolate}
.person-photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.06);transition:filter .8s var(--ease)}
/* Schwarzweiß im Ruhezustand; beim Darüberfahren (oder Fokus) erscheint das Foto in Farbe */
.person-photo:not(.person-photo--pending):hover img,.person-photo:not(.person-photo--pending):focus-visible img{filter:none}
.person-photo:focus-visible{outline-offset:6px}
.person-photo--pending{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s1);box-shadow:inset 0 0 0 1px var(--rule)}
.person-photo--pending img{width:3.5rem;height:auto;opacity:.5;filter:none}
.person-photo--pending figcaption{font-style:italic;color:var(--muted);font-size:1rem}
.person-role{color:var(--blue);margin-bottom:var(--s0)}
.person-name{font-size:1.75rem;font-weight:400;letter-spacing:-.01em}
.person-langs{margin:var(--s1) 0 0;font-size:1rem;font-style:italic;color:var(--blue)}
.person-text{margin-top:var(--s2);max-width:22em;color:var(--ink)}

/* Manuskripte */
.steps li{display:grid;grid-template-columns:3rem 1fr;gap:var(--s2);align-items:baseline;padding-block:var(--s3);border-top:1px solid var(--rule)}
.steps li:last-child{border-bottom:1px solid var(--rule)}
.steps .n{font-size:2.5rem;font-weight:400;line-height:1;color:var(--blue)}
.steps h3{font-size:1.375rem}
.steps p{margin-top:.375rem;color:var(--muted)}
.note{font-style:italic;color:var(--muted)}
.prose .center{margin-top:var(--s4)}

/* Kontakt */
.mail{font-size:clamp(1.75rem,2.6vw + .6rem,2.75rem);font-weight:400;letter-spacing:-.015em;line-height:1.2;text-decoration:none;color:var(--ink);background:linear-gradient(var(--rule-strong),var(--rule-strong)) 0 100%/100% 1px no-repeat;padding-bottom:.125rem;transition:color .2s;word-break:break-word}
.mail:hover{color:var(--blue);background-image:linear-gradient(var(--blue),var(--blue))}
.place{margin-top:var(--s2);color:var(--muted)}
.prose-note{text-align:center;font-style:italic;color:var(--muted);margin-bottom:var(--s4)}

/* ============ 9 · Formular ============ */
.cf-form{display:grid;gap:var(--s3)}
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.field{display:flex;flex-direction:column;gap:.375rem;min-width:0}
.field label{color:var(--muted)}
.field input[type="text"],.field input[type="email"],.field select,.field textarea{
  width:100%;font:inherit;font-size:1.125rem;color:var(--ink);background:transparent;
  border:0;border-bottom:1px solid var(--rule-strong);border-radius:0;padding:.5rem 0;line-height:1.5;
  transition:border-color .2s,box-shadow .2s
}
.field textarea{resize:vertical;min-height:9rem;border:1px solid var(--rule-strong);padding:.75rem 1rem}
.field select{
  appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:2rem;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%23111114' stroke-width='1.2'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") right .25rem center/12px 8px no-repeat
}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{outline:none;border-color:var(--blue);box-shadow:0 1px 0 0 var(--blue)}
.field textarea:focus-visible{box-shadow:0 0 0 1px var(--blue)}
.field [aria-invalid="true"]{border-color:var(--error)!important;box-shadow:0 1px 0 0 var(--error)}
.field textarea[aria-invalid="true"]{box-shadow:0 0 0 1px var(--error)}
.err{margin:.25rem 0 0;font-size:.9375rem;font-style:italic;line-height:1.4;color:var(--error)}
.field--file input[type="file"]{font:inherit;font-size:1rem;color:var(--muted);padding:.25rem 0;max-width:100%}
.field--file input[type="file"]::file-selector-button{margin-right:var(--s1);padding:.625rem 1rem;border:1px solid var(--blue);background:var(--white);color:var(--blue);font:inherit;font-size:var(--fs-sc);font-weight:500;letter-spacing:.08em;font-variant-caps:all-small-caps;cursor:pointer;transition:background .2s,color .2s}
.field--file input[type="file"]::file-selector-button:hover{background:var(--blue);color:var(--white)}
.field--file input[aria-invalid="true"]{color:var(--error)}
.field--check{display:grid;grid-template-columns:auto 1fr;column-gap:.875rem;align-items:start}
.field--check input{width:1.125rem;height:1.125rem;margin:.3125rem 0 0;accent-color:var(--blue);cursor:pointer}
.field--check label{font-size:1rem;font-weight:400;letter-spacing:0;text-transform:none;line-height:1.5;color:var(--ink)}
.field--check .err{grid-column:2}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cf-submit{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s1) var(--s3);margin:var(--s0) 0 0}
.req{font-style:italic;color:var(--muted);font-size:1rem}
.btn[disabled]{cursor:progress;opacity:.9}
.btn .spin{display:none;width:1rem;height:1rem;border:1.5px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:rot .7s linear infinite}
.btn[aria-busy="true"] .spin{display:block}
@keyframes rot{to{transform:rotate(360deg)}}
.form-status{margin-top:var(--s3);padding:var(--s3);outline-offset:4px}
.form-status p{margin:0 0 .75em}
.form-status .fs-title{font-size:1.5rem;font-weight:500;line-height:1.25;margin:0 0 .5em}
.form-status > :last-child{margin-bottom:0}
.form-status--ok{background:var(--blue);color:var(--white)}
.form-status--ok .btn{background:var(--white);color:var(--blue);border-color:var(--white)}
.form-status--info{background:var(--tint)}
.form-status--error{border:1px solid var(--error)}
.form-status--error .fs-title{color:var(--error)}

/* ============ 10 · Kolophon ============ */
.site-footer{background:var(--tint);padding-block:var(--s6) var(--s5);text-align:center}
.foot-name{font-size:1.25rem}
.foot-addr{margin-top:var(--s1);color:var(--muted);font-size:1rem}
.foot-addr a{text-decoration:none;border-bottom:1px solid var(--rule-strong)}
.foot-addr a:hover{color:var(--blue);border-color:var(--blue)}
.foot-links{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--s0) var(--s2);margin-top:var(--s3)}
.foot-links a{text-decoration:none}
.foot-links a:hover{color:var(--blue)}
.foot-colo{margin:var(--s4) auto 0;max-width:30em;font-style:italic;color:var(--muted);font-size:.9375rem}
.foot-copy{margin-top:var(--s1);color:var(--muted);font-size:.875rem}

/* ============ 11 · Unterseiten ============ */
.legal{padding-block:var(--sec)}
.legal .ch-head{margin-bottom:var(--s5)}
.legal h1{font-size:clamp(2.125rem,3.2vw + .6rem,3.5rem);font-weight:400;line-height:1.1;letter-spacing:-.018em}
.legal h2{font-size:1.5rem;font-weight:500;letter-spacing:-.005em;line-height:1.25;margin:var(--s4) 0 var(--s1)}
.fill{background:rgba(10,31,240,.08);border-bottom:1px dashed var(--blue);padding:0 .25em}
.back{margin-top:var(--s5);text-align:center}
.nf{padding-block:var(--sec);text-align:center}
.nf .code{font-size:clamp(5rem,10vw,8rem);font-weight:400;line-height:1;letter-spacing:-.03em;color:var(--blue);margin-bottom:var(--s3)}
.nf h1{font-size:clamp(2.125rem,3.2vw + .6rem,3.5rem);font-weight:400;line-height:1.1;letter-spacing:-.018em;max-width:14em;margin-inline:auto}
.nf .lead{margin:var(--s3) auto 0;max-width:28em;color:var(--muted)}
.nf .toc{margin-top:var(--s5);text-align:left}

/* ============ 11b · Klassiker, Buchseite, Bestellung ============ */
/* Vorstellung auf der Startseite */
.feature{display:grid;grid-template-columns:minmax(0,20rem) minmax(0,1fr);gap:var(--s5);align-items:center;max-width:58rem}
.feature-cover,.book-cover{display:block;margin:0;box-shadow:0 1.75rem 3rem -2rem rgba(17,17,20,.55),0 0 0 1px rgba(17,17,20,.06);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.feature-cover img,.book-cover img{width:100%;height:auto}
a.feature-cover:hover{transform:translateY(-.375rem);box-shadow:0 2.25rem 3.5rem -2rem rgba(17,17,20,.6),0 0 0 1px rgba(17,17,20,.06)}
.feature-series{margin-bottom:var(--s1);color:var(--blue)}
.feature-title{font-size:clamp(2.125rem,2.6vw + .75rem,3rem);font-weight:400;line-height:1.1;letter-spacing:-.018em}
.feature-title a{text-decoration:none}
.feature-title a:hover{color:var(--blue)}
.feature-sub{margin:.25rem 0 0;font-size:1.25rem;font-style:italic}
.feature-contents{margin:var(--s1) 0 0;padding:0;list-style:none;counter-reset:fc;font-size:1rem;line-height:1.5;color:var(--muted)}
.feature-contents li{counter-increment:fc}
.feature-contents li::before{content:counter(fc) ". ";font-style:italic;color:var(--blue)}
.feature-author{margin:.375rem 0 var(--s2);font-style:italic;font-size:1.375rem;color:var(--muted)}
.feature-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem var(--s1);margin:var(--s3) 0 0}
.price{font-size:1.75rem;font-weight:400;line-height:1;letter-spacing:-.01em}
.price-note{font-style:italic;color:var(--muted);font-size:1rem}
.feature-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s3);margin-top:var(--s3)}

.feature-status{margin-top:var(--s3);font-style:italic;color:var(--muted)}

/* Karussell der Reihe */
.shelf{max-width:62rem}
.shelf-viewport{overflow:hidden;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}
.shelf-viewport.is-dragging{cursor:grabbing}
.shelf-track{display:flex;transition:transform .8s var(--ease);will-change:transform}
.shelf .slide{flex:0 0 100%;min-width:0;max-width:none;padding:var(--s1) var(--s4) var(--s4)}
.shelf img{-webkit-user-drag:none;pointer-events:none}
.shelf-play{flex:none;display:grid;place-items:center;width:2.75rem;height:2.75rem;margin-left:calc(var(--s1) * -1);border:0;background:none;color:var(--muted);cursor:pointer;transition:color .2s}
.shelf-play:hover{color:var(--blue)}
.shelf-play svg{width:.875rem;height:.875rem;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.shelf-play .i-play{display:none;fill:currentColor;stroke:none}
.shelf-play[aria-pressed="true"] .i-pause{display:none}
.shelf-play[aria-pressed="true"] .i-play{display:block}
.shelf-nav{display:flex;justify-content:center;align-items:center;gap:var(--s3);margin-top:var(--s3)}
.shelf-btn{flex:none;display:grid;place-items:center;width:2.75rem;height:2.75rem;border:1px solid var(--rule-strong);border-radius:50%;background:none;color:var(--ink);cursor:pointer;transition:color .2s,border-color .2s,opacity .2s}
.shelf-btn svg{width:1.125rem;height:auto;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
.shelf-btn:hover{color:var(--blue);border-color:var(--blue)}
.shelf-dots{display:flex;gap:var(--s1)}
.shelf-dots button{position:relative;width:2.25rem;height:2.75rem;border:0;background:none;padding:0;cursor:pointer}
.shelf-dots button::before,.shelf-dots button::after{content:"";position:absolute;left:50%;top:50%;width:1.5rem;height:2px;margin:-1px 0 0 -.75rem}
.shelf-dots button::before{background:var(--rule-strong);transition:background .2s}
.shelf-dots button::after{background:var(--blue);transform:scaleX(0);transform-origin:left}
.shelf-dots button:hover::before{background:var(--muted)}
.shelf-dots button[aria-current="true"]::after{transform:scaleX(1)}
.shelf-dots button.run::after{animation:shelf-run 5s linear both}
@keyframes shelf-run{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* Buchseite: Titelei */
.book{padding-block:var(--sec)}
.book-grid{display:grid;grid-template-columns:minmax(0,24rem) minmax(0,1fr);gap:var(--s6);align-items:center;max-width:62rem}
.book-info .kicker{justify-content:flex-start;margin-bottom:var(--s2)}
.book-info .kicker a{text-decoration:none}
.book-info .kicker a:hover{text-decoration:underline;text-underline-offset:.25em}
.book-info h1{font-size:clamp(2.75rem,4.4vw + .5rem,4.75rem)}
.book-info .feature-author{margin-bottom:var(--s3)}
.book-lead{font-size:1.25rem;line-height:1.5}
.book-avail{margin-top:var(--s3);color:var(--muted);font-style:italic;font-size:1rem}
.book-avail::before{content:"";display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:var(--blue);margin-right:.625rem;vertical-align:.1em}

/* Kennzahl */
.callout{text-align:center}
.callout .big{display:block;font-size:clamp(3.5rem,5vw + 1rem,5.5rem);font-weight:400;line-height:1;letter-spacing:-.03em;color:var(--blue)}
.callout p{margin:var(--s2) auto 0;max-width:26em;font-style:italic;color:var(--muted)}

/* Leseprobe: gesetzt wie eine Buchseite */
.excerpt{font-size:1.25rem;line-height:1.65;hyphens:auto;-webkit-hyphens:auto;text-align:justify}
.excerpt p{margin:0;text-indent:1.5em}
.excerpt p:first-child{text-indent:0}
.excerpt-end{margin-top:var(--s3);text-align:center;color:var(--muted);font-size:1.5rem;letter-spacing:.5em;margin-right:-.5em}

/* Ausstattung */
.specs{margin-block:0;border-top:1px solid var(--rule)}
.specs > div{display:grid;grid-template-columns:9rem 1fr;gap:var(--s1);align-items:baseline;padding:.875rem 0;border-bottom:1px solid var(--rule)}
.specs dt{color:var(--muted)}
.specs dd{margin:0}

/* Bestellformular */
.order{display:grid;gap:var(--s5)}
.order fieldset{margin:0;padding:0;border:0;min-width:0;display:grid;gap:var(--s3)}
.order legend{float:left;width:100%;padding:0 0 var(--s1);margin-bottom:var(--s1);border-bottom:1px solid var(--rule);color:var(--blue);font-size:var(--fs-sc);font-weight:500;letter-spacing:.08em;font-variant-caps:all-small-caps;line-height:1.3}
.order legend + *{clear:both}
.order .cf-row--3{grid-template-columns:8rem 1fr}
.order-items{border-top:1px solid var(--rule)}
.order-item{display:grid;grid-template-columns:3rem 1fr auto;gap:var(--s2);align-items:center;padding:var(--s1) 0;border-bottom:1px solid var(--rule)}
.order-item img{width:3rem;height:auto;box-shadow:0 0 0 1px rgba(17,17,20,.08)}
.oi-text{display:flex;flex-direction:column;gap:.125rem;cursor:pointer}
.oi-t{font-size:1.1875rem;line-height:1.3}
.oi-a{font-size:.9375rem;font-style:italic;color:var(--muted);line-height:1.35}
.order-item.is-on .oi-t{color:var(--blue)}
.order-items[aria-invalid="true"]{border-top-color:var(--error)}
.field .hint{margin:0;font-size:.9375rem;font-style:italic;color:var(--muted);line-height:1.4}
.field .opt{text-transform:none;letter-spacing:0;font-style:italic;font-weight:400;font-size:.9375rem}
.qty{display:inline-flex;align-items:stretch;align-self:flex-start;border:1px solid var(--rule-strong)}
.qty button{width:2.75rem;border:0;background:none;color:var(--ink);font-size:1.375rem;line-height:1;cursor:pointer;transition:color .2s,background .2s}
.qty button:hover{color:var(--blue);background:var(--tint)}
.qty button:disabled{color:var(--rule-strong);cursor:default;background:none}
.qty input{width:3.5rem;height:2.75rem;border:0;border-inline:1px solid var(--rule-strong);text-align:center;font:inherit;font-size:1.125rem;color:var(--ink);background:transparent;-moz-appearance:textfield;appearance:textfield}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.qty input:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.sum{margin:0;padding:var(--s2) var(--s3);background:var(--tint)}
.sum > div{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s1);padding:.375rem 0}
.sum dt{color:var(--muted)}
.sum dd{margin:0;white-space:nowrap}
.sum .total{margin-top:.5rem;padding-top:.875rem;border-top:1px solid var(--ink)}
.sum .total dt{color:var(--ink)}
.sum .total dd{font-size:1.5rem;line-height:1}
.sum-note{margin-top:-1.5rem;font-size:.9375rem;font-style:italic;color:var(--muted)}
.choice{display:grid;gap:var(--s1)}
.choice label{display:grid;grid-template-columns:auto 1fr;column-gap:.875rem;align-items:start;cursor:pointer;padding:var(--s1) var(--s2);border:1px solid var(--rule);transition:border-color .2s}
.choice label:has(input:checked){border-color:var(--blue)}
.choice input{width:1.125rem;height:1.125rem;margin:.3125rem 0 0;accent-color:var(--blue);cursor:pointer}
.choice b{font-weight:500}
.choice span span{display:block;font-size:1rem;font-style:italic;color:var(--muted);line-height:1.45}
.form-status .order-lines{margin:var(--s1) 0 var(--s2);padding:var(--s1) 0;border-block:1px solid rgba(255,255,255,.35)}
.form-status--info .order-lines{border-color:var(--rule-strong)}
.form-status .order-lines p{margin:0;display:flex;justify-content:space-between;gap:var(--s1)}
.form-status .order-lines .tot{margin-top:.25rem;font-weight:500}

/* ============ 12 · Responsive ============ */
@media (max-width:1120px){
  .nav{display:none}
  .bar{grid-template-columns:1fr auto}
  .brand{justify-self:start}
  .menu-btn{display:block}
  .mnav{position:absolute;top:100%;left:0;right:0;background:var(--white);border-bottom:1px solid var(--rule);padding:var(--s1) var(--g) var(--s3)}
  .mnav.is-open{display:block}
  .mnav a{display:block;padding:var(--s1) 0;border-bottom:1px solid var(--rule);text-decoration:none;font-size:.875rem}
  .mnav a[aria-current="true"]{color:var(--blue)}
  .mnav .mnav-sub a{padding-left:var(--s3);font-size:.8125rem;color:var(--muted)}
}
@media (max-width:820px){
  .pair{grid-template-columns:1fr;gap:var(--s5)}
  .pair > article{display:block}
  .feature,.book-grid{grid-template-columns:1fr;gap:var(--s4);text-align:center;max-width:var(--measure)}
  .feature-cover,.book-cover{width:min(62%,18rem);margin-inline:auto}
  .feature-price,.feature-actions{justify-content:center}
  .book-info .kicker{justify-content:center}
  .covers{gap:var(--s1)}
  .facts{grid-template-columns:1fr;gap:var(--s4)}
  .people-grid{grid-template-columns:1fr;gap:var(--s5)}
}
@media (max-width:600px){
  body{font-size:1.1875rem}
  .brand{font-size:1rem}
  .hero-inner{padding-block:var(--s5)}
  .plate{margin-bottom:var(--s3)}
  .hero-lead{font-size:1.125rem}
  .toc .s{display:none}
  .topics li{grid-template-columns:1fr;gap:.125rem}
  .covers{gap:.75rem}
  .cover .ph::after{inset:.375rem}
  .cover figcaption{margin-top:var(--s1)}
  .cover figcaption .sc{font-size:.6875rem;letter-spacing:.1em}
  .cover .st{font-size:.875rem}
  .cf-row{grid-template-columns:1fr}
  .order .cf-row--3{grid-template-columns:6.5rem 1fr}
  .cf-submit .btn{width:100%}
  .specs > div{grid-template-columns:1fr;gap:.125rem}
  .shelf .slide{padding:var(--s0) var(--s0) var(--s3)}
  .shelf-nav{gap:.25rem}
  .shelf-dots{gap:0;margin-inline:.25rem}
  .shelf-dots button{width:1.875rem}
  .shelf-btn{width:2.5rem;height:2.5rem}
  .shelf-play{margin-left:0;width:2.25rem}
  .order-item{grid-template-columns:2.5rem 1fr;row-gap:var(--s0)}
  .order-item img{width:2.5rem;grid-row:span 2}
  .order-item .qty{grid-column:2;justify-self:start}
  .excerpt{font-size:1.125rem;text-align:left}
  .sum{padding:var(--s1) var(--s2)}
}

/* ============ 13 · Bewegung ============ */
.js .reveal{opacity:0;transform:translateY(1rem);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:var(--rd,0s)}
.js .reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .mark path[pathLength]{animation:none;stroke-dashoffset:0}
  .mark > circle{animation:none;opacity:1}
  .js .reveal{opacity:1;transform:none;transition:none}
  *{transition-duration:.01ms!important}
}
@media print{.site-header{position:static}.js .reveal{opacity:1;transform:none}.hero{color:var(--ink);background:none}}
.nf h1 em{color:var(--blue)}
.ch-head h1{font-size:clamp(2.125rem,3.2vw + .6rem,3.5rem);font-weight:400;line-height:1.1;letter-spacing:-.018em;max-width:15em;margin-inline:auto}
.ch-head h1 em{color:var(--blue)}

/* Presse & Buchhandel */
.press-h{font-size:1.5rem;font-weight:500;line-height:1.25;letter-spacing:-.005em;margin-bottom:var(--s1)}
.press-pair .link{margin-top:var(--s1)}
.press-dl{max-width:58rem}
.press-dl > .kicker,.press-text > .kicker,.press-contact > .kicker{margin-bottom:var(--s3)}
.dl-list{border-top:1px solid var(--rule);margin-bottom:var(--s4)}
.dl-list a{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.125rem var(--s2);padding:var(--s1) 0;border-bottom:1px solid var(--rule);text-decoration:none;transition:color .2s}
.dl-list a::after{content:"↓";grid-column:2;grid-row:1 / span 2;color:var(--blue);font-size:1.25rem}
.dl-list .dl-t,.dl-list .dl-m{grid-column:1}
.dl-list a:hover .dl-t{color:var(--blue)}
.dl-t{font-size:1.1875rem}
.dl-m{font-size:.9375rem;font-style:italic;color:var(--muted)}
.dl-covers{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s2);margin-bottom:var(--s3)}
.dl-cover{display:flex;flex-direction:column;gap:.25rem;text-decoration:none;text-align:center}
.dl-cover img{width:100%;height:auto;margin-bottom:var(--s0);box-shadow:0 1rem 1.75rem -1.25rem rgba(17,17,20,.55),0 0 0 1px rgba(17,17,20,.06);transition:transform .4s var(--ease)}
.dl-cover:hover img{transform:translateY(-.25rem)}
.dl-cover .dl-t{font-size:1rem;line-height:1.3}
.dl-cover .dl-m{font-size:.8125rem;line-height:1.35}
.boiler{margin:0;padding:var(--s3);background:var(--tint);font-size:1.125rem;line-height:1.6}
.copy-btn{margin-top:var(--s2);border:0;border-bottom:1px solid currentColor;background:none;cursor:pointer;padding:0 0 .375rem}
.press-name{font-size:1.75rem;line-height:1.2;margin:0}
.press-role{margin:.25rem 0 var(--s2);font-style:italic;color:var(--muted)}
.kicker a{text-decoration:none}
.kicker a:hover{text-decoration:underline;text-underline-offset:.25em}

/* Presse: Raster auf kleineren Bildschirmen (nach den Grundregeln, damit es greift) */
@media (max-width:820px){.dl-covers{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:600px){.dl-covers{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3) var(--s2)}}

/* ============ 14 · Buchseiten im Kleid ihres Covers ============ */
.book--themed{background:var(--bk-bg);color:var(--bk-fg);padding-block:var(--s6);border-bottom:1px solid var(--bk-line)}
.book--themed .kicker,.book--themed .kicker a{color:var(--bk-accent)}
.book--themed .feature-author,.book--themed .price-note,.book--themed .book-avail{color:color-mix(in srgb,var(--bk-fg) 72%,transparent)}
.book--themed .book-sub{margin:.375rem 0 0;font-size:1.375rem;font-style:italic}
.book--themed .link{color:var(--bk-accent)}
.book--themed .link:hover{color:inherit}
.book--themed .book-avail::before{background:var(--bk-accent)}
.book--themed .book-cover{box-shadow:0 2rem 3.5rem -2rem rgba(0,0,0,.6),0 0 0 1px var(--bk-line)}
.book--light-btn .btn{background:var(--white);border-color:var(--white);color:var(--blue)}
.book--light-btn .btn:hover{background:transparent;color:var(--white)}
.book--themed :focus-visible{outline-color:currentColor}
.feature-actions .link + .link{margin-left:0}

/* Glashaus-Notiz */
.note-sec{background:var(--tint)}
.why p{font-size:1.25rem;line-height:1.6}
.why p:first-child::first-letter{color:var(--blue)}
.why-sign{margin-top:var(--s3);text-align:right;font-style:italic;color:var(--muted)}
.why-sign::before{content:"— "}
.ls-actions{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--s2) var(--s3)}

/* ============ 15 · Lesesaal ============ */
.lesesaal{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:var(--tint);color:var(--ink);display:none;flex-direction:column}
.lesesaal[open]{display:flex;animation:ls-in .35s var(--ease)}
.lesesaal::backdrop{background:rgba(17,17,20,.5)}
@keyframes ls-in{from{opacity:0;transform:translateY(.75rem)}to{opacity:1;transform:none}}
.ls-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);padding:var(--s1) var(--g);border-bottom:1px solid var(--rule);background:var(--white)}
.ls-title{margin:0;font-size:1rem;color:var(--muted)}
.ls-title .sc{color:var(--blue);margin-right:.5rem}
.ls-close{width:2.75rem;height:2.75rem;display:grid;place-items:center;border:0;background:none;color:var(--ink);cursor:pointer}
.ls-close svg{width:1rem;height:1rem;stroke:currentColor;stroke-width:1.4;fill:none}
.ls-close:hover{color:var(--blue)}
.ls-stage{flex:1;display:grid;place-items:center;min-height:0;padding:var(--s3) var(--g) var(--s1)}
.ls-viewport{--pw:24rem;--ph:34rem;--gap:4rem;--cols:2;position:relative;width:calc(var(--cols) * var(--pw) + (var(--cols) - 1) * var(--gap));height:var(--ph);overflow:hidden;background:var(--white);box-shadow:0 1.5rem 3rem -2rem rgba(17,17,20,.45),0 0 0 1px var(--rule);padding:0;box-sizing:content-box;border-inline:2.5rem solid var(--white);border-block:3rem solid var(--white)}
.ls-viewport::after{content:"";position:absolute;top:-3rem;bottom:-3rem;left:50%;width:1px;background:linear-gradient(transparent,var(--rule) 15%,var(--rule) 85%,transparent);display:var(--fold,block)}
.ls-flow{height:100%;column-width:var(--pw);column-gap:var(--gap);column-fill:auto;transition:transform .5s var(--ease);font-size:1.1875rem;line-height:1.55;hyphens:auto;-webkit-hyphens:auto;text-align:justify}
.ls-flow p{margin:0;text-indent:1.4em;orphans:2;widows:2}
.ls-flow .ls-head{text-indent:0;text-align:center;margin-bottom:var(--s3);display:flex;flex-direction:column;gap:.25rem}
.ls-flow .ls-head .ls-book{font-size:1.75rem;font-style:italic;line-height:1.2}
.ls-flow .ls-head + p,.ls-flow .ls-chapter + p{text-indent:0}
.ls-chapter{font-size:1.125rem;font-weight:500;font-style:italic;text-align:center;margin:0 0 var(--s2)}
.ls-flow .ls-end{text-indent:0;text-align:center;margin-top:var(--s3);font-style:italic;color:var(--muted)}
.ls-nav{display:flex;justify-content:center;align-items:center;gap:var(--s3);padding:var(--s1) var(--g) var(--s2)}
.ls-count{margin:0;min-width:10rem;text-align:center;font-style:italic;color:var(--muted);font-variant-numeric:tabular-nums}
@media (max-width:900px){.ls-viewport{--cols:1;--fold:none;border-inline-width:1.5rem;border-block-width:2rem}}
@media (prefers-reduced-motion:reduce){.ls-flow{transition:none}.lesesaal[open]{animation:none}}

/* ============ 16 · Leitsystem: das Logo zeigt, wo man ist ============ */
.vignette--guide{width:3.25rem;height:auto;background:none}
.vignette--guide svg{display:block;width:100%;height:auto;overflow:visible}
.vignette--guide .pt{stroke:var(--rule-strong);transition:stroke .8s var(--ease) .15s}
.vignette--guide .pt .dot{fill:var(--rule-strong);transition:fill .8s var(--ease) .15s}
.vignette--guide[data-part="all"] .pt,
.vignette--guide[data-part="wings"] .pt-wings,
.vignette--guide[data-part="dome"] .pt-dome,
.vignette--guide[data-part="glass"] .pt-glass,
.vignette--guide[data-part="base"] .pt-base,
.vignette--guide[data-part="lantern"] .pt-lantern{stroke:var(--blue)}
.vignette--guide[data-part="all"] .dot,.vignette--guide[data-part="lantern"] .dot{fill:var(--blue)}

/* Wechselndes Motto */
.motto .is-long blockquote p{font-size:clamp(1.375rem,1.6vw + .6rem,2rem);line-height:1.3}
.motto figcaption a{text-decoration:none;border-bottom:1px solid var(--rule-strong)}
.motto figcaption a:hover{color:var(--blue);border-color:var(--blue)}


/* Tabellarische Ziffern, wo Zahlen untereinander stehen */
.sum dd,.qty input,.ls-count,.specs dd{font-variant-numeric:oldstyle-nums tabular-nums}

/* Buchseiten: keine Logo-Trenner; aufeinanderfolgende weiße Kapitel ohne doppelten Abstand */
.book-page .chapter:not(.note-sec) + .chapter:not(.note-sec){padding-top:0}

/* Hinweis auf das Magazin Gegenwart */
.mag{background:var(--ink);color:var(--white);padding-block:var(--sec)}
.mag-inner{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(3rem,7vw,7rem);align-items:center}
.mag .kicker{color:#9AA4FF;margin-bottom:var(--s2);justify-content:flex-start}
.mag-title{font-size:clamp(4rem,9vw,7.5rem);font-weight:400;line-height:.9;letter-spacing:-.02em}
.mag-sub{margin:var(--s1) 0 var(--s3);font-style:italic;font-size:1.5rem;color:#D6D4CE}
.mag p{color:#D6D4CE}
.mag-facts{margin-top:var(--s2);padding-top:var(--s2);border-top:1px solid rgba(255,255,255,.18);font-style:italic}
.mag .link{color:var(--white)}
.mag .btn{background:var(--white);border-color:var(--white);color:var(--ink)}
.mag .btn:hover{background:transparent;color:var(--white)}
/* das Exemplar: Titelblatt als Heft mit Rücken und Schatten */
.mag-copy{margin:0;justify-self:center;width:min(100%,24rem);text-align:center}
.mag-copy a{display:block;transform:rotate(-3deg);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.mag-copy a:hover{transform:rotate(0) translateY(-.4rem)}
.mag-copy img{display:block;width:100%;height:auto;border-radius:2px 5px 5px 2px;box-shadow:0 2.4rem 3rem -1.6rem rgba(0,0,0,.9),.9rem .9rem 0 -.45rem #2A2A2E,1.6rem 1.6rem 0 -.9rem #1E1E22}
.mag-copy figcaption{margin-top:var(--s3);font-style:italic;color:#A9A7A0}
@media (max-width:900px){
  .mag-inner{grid-template-columns:1fr;text-align:center}
  .mag .kicker{justify-content:center}
  .mag .feature-actions{justify-content:center}
  .mag-copy{width:min(78%,20rem)}
}
/* Klassiker: Buchhandlungs-Hinweis und „Erscheint in Kürze“ */
.price-store{margin:.35rem 0 0;font-style:italic;color:var(--muted);font-size:1rem}
.book--themed .price-store{color:color-mix(in srgb,var(--bk-fg) 72%,transparent)}
.soon-note{margin:0 0 var(--s3);padding:var(--s2) var(--s3);border-left:3px solid var(--blue);background:var(--tint)}
.soon-note p{margin:0}
.soon-note .soon-t{font-variant-caps:all-small-caps;letter-spacing:.12em;color:var(--blue);font-size:1.15rem;margin-bottom:.25rem}
@media (max-width:820px){.price-store{text-align:center}}