/* Das Bücherregal: a room of the Werkstatt Sophos in ink blue and copper.
   Loaded after sternwarte.css: re-colours the shared components and adds the book components. */
:root{
  --night:#14233A; --night-2:#1C3150; --night-3:#26406A;
  --lav:#6F8FB8; --lav-deep:#1F3A5F; --lav-ink:#1F3A5F;
  --lilac:#E3E8F0; --lilac-2:#EDF0F5; --ivory:#F1ECE2; --paper:#FAF7F0;
  --gold:#D29A6C; --gold-ink:#97522C; --copper:#B4693E;
  --ink:#1E2733; --ink-2:#3D4859; --ink-3:#5B6575;
  --line:rgb(20 35 58 / .12); --line-2:rgb(20 35 58 / .24);
  --on-night:#F4EFE7; --on-night-2:#C4CDDA;
}
html{scrollbar-color:var(--lav-deep) var(--lilac)}
::selection{background:#F0D6C2}
.nav{background:rgb(20 35 58 / .95);border-bottom-color:rgb(180 105 62 / .35)}
.subnav{border-bottom-color:rgb(180 105 62 / .25)}
.subnav a[aria-current="page"]{background:#F3E4D7;color:var(--night)}
.sky .glow{background:radial-gradient(ellipse at 50% 100%,rgb(180 105 62 / .32),transparent 65%)}
.btn-primary{background:var(--lav-deep);box-shadow:0 8px 20px -10px rgb(31 58 95 / .7)}
.btn-primary:hover{background:#162C49}
.kicker{color:var(--gold)}
.kicker::before{background:var(--gold)}
.foot .legal{border-top-color:rgb(244 239 231 / .12)}

/* hero: a small drawn shelf */
.mini-shelf{justify-self:center;display:flex;align-items:flex-end;gap:5px;height:clamp(150px,22vw,210px);padding:0 14px;border-bottom:10px solid #6B3F24;border-radius:2px;position:relative}
.mini-shelf span{width:var(--w,24px);height:var(--h);background:var(--c);border-radius:3px 3px 1px 1px;box-shadow:inset -4px 0 0 rgb(0 0 0 / .18),inset 0 10px 0 rgb(255 255 255 / .06);position:relative}
.mini-shelf span::after{content:"";position:absolute;left:4px;right:6px;top:18%;height:2px;background:rgb(240 214 160 / .55)}
.mini-shelf i{width:14px;height:58%;background:linear-gradient(#C9894F,#8E4F27);border-radius:3px 3px 0 0;transform:rotate(9deg);transform-origin:bottom left;margin-left:6px}

/* overview */
.shelf-intro{margin-bottom:1rem}
.shelf-intro p{font-size:1.12em}
.shelf-sec{margin-top:clamp(2.6rem,6vw,4rem);scroll-margin-top:120px}
.shelf-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.2rem;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:1rem;margin-bottom:1.4rem}
.shelf-head p{color:var(--ink-2);max-width:62ch;margin-top:.5rem}
.kicker-ink{display:block;font-size:.8rem;letter-spacing:1.6px;text-transform:uppercase;color:var(--gold-ink);font-weight:700;margin-bottom:.3rem}
.kk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:1.2rem}
.kk-card{display:grid;grid-template-columns:110px minmax(0,1fr);gap:1rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1rem;box-shadow:0 16px 32px -26px rgb(20 35 58 / .55)}
.kk-card img{border-radius:6px;box-shadow:0 10px 20px -12px rgb(20 35 58 / .6)}
.kk-card h3{font-size:1.2rem;margin:.15rem 0 .35rem}
.kk-card p{font-size:.95rem;color:var(--ink-2);margin-bottom:.8rem}
.kk-card .btn{padding:.7em 1.1em;min-height:42px;font-size:.95rem}
.aff{display:block;font-size:.78rem;color:var(--ink-3);margin-top:.35rem}
.band{display:block;font-size:.78rem;letter-spacing:1.4px;text-transform:uppercase;color:var(--gold-ink);font-weight:700}
.soon-line{margin-top:1.2rem;color:var(--ink-2)}
.as-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}
.as-card{display:flex;flex-direction:column;gap:.3rem;text-decoration:none;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1rem;transition:transform .2s var(--ease),box-shadow .2s}
.as-card:hover{transform:translateY(-3px);box-shadow:0 22px 40px -28px rgb(20 35 58 / .7);color:var(--ink)}
.as-card img{border-radius:6px;margin-bottom:.6rem;box-shadow:0 14px 26px -16px rgb(20 35 58 / .6)}
.as-card b{font-family:var(--display);font-size:1.25rem;line-height:1.15}
.as-card span:not(.band):not(.pill){color:var(--ink-2);font-size:.95rem}
.as-card.ghost{justify-content:center;align-items:flex-start;background:repeating-linear-gradient(135deg,transparent 0 10px,rgb(20 35 58 / .03) 10px 20px);border-style:dashed;min-height:200px}
.pill{display:inline-flex;align-items:center;gap:.45rem;align-self:flex-start;margin-top:.5rem;padding:.35rem .8rem;border-radius:999px;background:rgb(180 105 62 / .12);color:var(--gold-ink);font-weight:700;font-size:.88rem}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--copper)}
.roman-teaser{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:clamp(1.2rem,3vw,2.4rem);align-items:center;text-decoration:none;color:var(--ink);background:var(--night);border-radius:calc(var(--radius) + 4px);padding:clamp(1.2rem,3vw,2rem);transition:transform .2s var(--ease)}
.roman-teaser:hover{transform:translateY(-3px);color:var(--ink)}
.roman-teaser h2{color:#F3E7C9}
.roman-teaser .kicker-ink{color:var(--gold)}
.roman-teaser p{color:var(--on-night-2);margin-top:.6rem;max-width:62ch}
.roman-teaser .roman-hook{color:var(--gold)!important}
.roman-teaser .pill{background:rgb(210 154 108 / .16);color:#F0C9A6}
.roman-teaser .go{display:inline-block;margin-left:.8rem;color:#F3E7C9;font-weight:700}
.roman-mini{width:100%;height:auto;border-radius:6px;box-shadow:0 18px 32px -16px rgb(0 0 0 / .6)}

/* book pages */
.ways{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-bottom:2.4rem}
.way{border:1px solid var(--line);border-radius:12px;padding:1rem 1.1rem;background:var(--paper)}
.way b{display:block;font-family:var(--display);font-size:1.15rem;color:var(--lav-deep);margin-bottom:.2rem}
.way span{color:var(--ink-2);font-size:.98rem}
.book{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:clamp(1.6rem,4vw,3.4rem);align-items:start;background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:clamp(1.4rem,3vw,2.6rem);box-shadow:0 24px 48px -32px rgb(20 35 58 / .5);scroll-margin-top:120px}
.book+.book{margin-top:2.4rem}
.book .cover,.book .placeholder{position:sticky;top:130px;border-radius:6px;box-shadow:0 22px 40px -18px rgb(20 35 58 / .65);width:100%;height:auto}
.book h2{font-size:clamp(1.9rem,1.5rem + 1.6vw,2.7rem);color:var(--lav-deep);margin:.3rem 0 .2rem}
.book .sub{font-family:var(--display);font-style:italic;font-size:1.2rem;color:var(--ink-2);margin:0 0 1rem}
.book p,.book li{color:var(--ink-2);max-width:66ch}
.book p{margin-top:.7rem}
.book h3{font-size:1.3rem;color:var(--ink);margin:1.8rem 0 .6rem}
.parts{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.parts li{display:grid;grid-template-columns:4.6rem minmax(0,1fr);gap:.8rem;padding:.6rem 0;border-bottom:1px solid var(--line)}
.parts .no{font-family:var(--display);font-weight:700;color:var(--gold-ink)}
.parts small{display:block;color:var(--ink-3)}
.aside-note{border-left:3px solid var(--copper);padding:.4rem 0 .4rem 1rem;margin-top:1.4rem!important;font-size:.98rem}
.links{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.4rem}
.roman-hook{font-family:var(--display);font-style:italic;font-size:clamp(1.3rem,1.1rem + .8vw,1.7rem);color:var(--gold-ink)!important;line-height:1.35}
.closing{font-family:var(--display);font-size:1.2rem;color:var(--ink)!important;border-left:3px solid var(--copper);padding-left:1rem}
.themes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.theme{border:1px solid var(--line);border-radius:12px;padding:.8rem 1rem;background:#fff}
.theme b{display:block;font-family:var(--display);font-size:1.1rem;color:var(--lav-deep)}
.theme span{color:var(--ink-2);font-size:.96rem}
.next{margin-top:2.4rem;background:var(--night);color:var(--on-night);border-radius:16px;padding:clamp(1.4rem,3vw,2.4rem);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.4rem;align-items:center}
.next h2{font-size:clamp(1.6rem,1.3rem + 1.2vw,2.2rem);color:#F3E7C9}
.next p{color:var(--on-night-2);max-width:60ch;margin-top:.5rem}
.next .btn-ghost{color:#F3E7C9;box-shadow:inset 0 0 0 1.5px var(--gold)}
.next .btn-ghost:hover{background:rgb(244 239 231 / .08)}
@media (max-width:820px){
  .as-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .book,.roman-teaser,.next{grid-template-columns:minmax(0,1fr)}
  .book .cover,.book .placeholder{max-width:260px;position:static}
  .roman-mini{max-width:180px}
  .ways,.themes{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:520px){
  .as-grid{grid-template-columns:minmax(0,1fr)}
  .kk-card{grid-template-columns:88px minmax(0,1fr)}
}
.vid-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.vid-pair a{display:flex;flex-direction:column;gap:.35rem;text-decoration:none;color:var(--ink)}
.vid-pair img{border-radius:10px;aspect-ratio:16/9;object-fit:cover;box-shadow:0 14px 28px -18px rgb(20 35 58 / .6);margin-bottom:.3rem}
.vid-pair b{font-family:var(--display);font-size:1.08rem;line-height:1.25}
.vid-pair span{font-size:.9rem;color:var(--gold-ink);font-weight:700}
.vid-pair a:hover b{color:var(--lav-deep);text-decoration:underline}
@media (max-width:520px){.vid-pair{grid-template-columns:minmax(0,1fr)}}
