/* ============================================
   Shared styles for book detail + series + library pages
   Used across EN/FR/DE
   ============================================ */

.book-hero { display: grid; grid-template-columns: 440px 1fr; gap: 80px; padding: 120px 72px; border-bottom: 1px solid var(--line); align-items: start; position: relative; overflow: hidden; }
.book-hero .glow { position: absolute; top: -200px; right: -200px; width: 700px; height: 700px; background: radial-gradient(circle, rgba(125,91,255,0.16) 0%, transparent 60%); pointer-events: none; }
.book-hero .crumb { font-family: var(--mono); font-size: 11px; letter-spacing: 0.28em; text-transform: uppercase; color: var(--fg-muted); margin-bottom: 16px; }
.book-hero .crumb a { color: var(--gold); text-decoration: none; }
.book-hero .book-num { font-family: var(--mono); font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--gold); margin-bottom: 20px; }
.book-hero h1 { font-family: var(--serif); font-size: 88px; line-height: 0.92; font-weight: 400; font-style: italic; margin: 0 0 12px; letter-spacing: -0.02em; }
.book-hero .series-sub { font-family: var(--serif); font-size: 20px; font-style: italic; color: var(--fg-muted); margin-bottom: 36px; }
.book-hero blockquote.pullquote { font-size: 26px; max-width: 600px; }
.book-hero .blurb, .book-hero .detail { font-size: 16px; line-height: 1.75; color: var(--cream-2); opacity: 0.85; max-width: 600px; margin: 0 0 24px; }
.book-hero .detail { font-style: italic; margin-bottom: 32px; }
.book-hero .tagline { font-family: var(--serif); font-size: 22px; font-style: italic; color: var(--gold); margin: 24px 0 40px; max-width: 600px; }
.preorder-banner { display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px; border: 1px solid var(--gold); color: var(--gold); font-family: var(--mono); font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; margin-bottom: 24px; }
.preorder-banner::before { content: '◆'; font-size: 8px; }

.for-readers-section { padding: 100px 72px; border-bottom: 1px solid var(--line); }
.for-readers-section h2 { font-family: var(--serif); font-size: 56px; line-height: 1; font-weight: 400; font-style: italic; margin: 0 0 48px; }
.for-readers-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px 80px; max-width: 1200px; }
.for-readers-list .item { display: flex; gap: 16px; padding: 20px 0; border-top: 1px solid var(--line); font-family: var(--serif); font-size: 20px; font-style: italic; }
.for-readers-list .item .icon { color: var(--gold); font-size: 10px; padding-top: 10px; }

.next-prev { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--line); }
.nav-link-box { padding: 60px 72px; text-decoration: none; color: var(--cream); transition: background 0.2s; display: flex; flex-direction: column; gap: 12px; }
.nav-link-box:hover { background: rgba(28, 26, 43, 0.5); }
.nav-link-box.prev { border-right: 1px solid var(--line); }
.nav-link-box .label { font-family: var(--mono); font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--gold); }
.nav-link-box .title { font-family: var(--serif); font-size: 32px; line-height: 1; font-style: italic; }
.nav-link-box.next { text-align: right; align-items: flex-end; }

/* Library/series page styles */
.series-block { padding: 100px 72px; border-bottom: 1px solid var(--line); }
.series-block .header { display: flex; justify-content: space-between; align-items: end; gap: 40px; margin-bottom: 60px; flex-wrap: wrap; }
.series-block .header-left .roman { font-family: var(--serif); font-size: 14px; letter-spacing: 0.3em; color: var(--gold); margin-bottom: 12px; }
.series-block .header-left h2 { font-family: var(--serif); font-size: 72px; line-height: 0.95; font-weight: 400; font-style: italic; margin: 0 0 12px; }
.series-block .tagline { font-family: var(--serif); font-size: 20px; color: var(--cream-2); font-style: italic; max-width: 620px; }
.series-block .series-cta { font-family: var(--mono); font-size: 12px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--gold); text-decoration: none; border-bottom: 1px solid var(--gold); padding-bottom: 6px; }

.books-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
.books-row.four-up { grid-template-columns: repeat(4, 1fr); }
.books-row .book-card { display: flex; flex-direction: column; text-decoration: none; color: var(--cream); transition: transform 0.3s; }
.books-row .book-card:hover { transform: translateY(-4px); }
.books-row .book-card .cover-placeholder { aspect-ratio: 2/3; box-shadow: 0 20px 50px rgba(0,0,0,0.5), 0 0 40px rgba(125,91,255,0.1); }
.books-row .book-card .cover-placeholder.empty { background: linear-gradient(140deg, rgba(28,26,43,0.9), rgba(19,18,29,0.9)); border: 1px solid var(--line-strong); display: flex; align-items: center; justify-content: center; padding: 30px; text-align: center; }
.books-row .book-card .cover-placeholder.empty span { font-family: var(--mono); font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--fg-muted); line-height: 1.8; }
.books-row .book-card .meta { padding: 24px 0 0; }
.books-row .book-card .book-num { font-family: var(--mono); font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: var(--gold); margin-bottom: 8px; }
.books-row .book-card h3 { font-family: var(--serif); font-size: 28px; line-height: 1.05; font-weight: 400; font-style: italic; margin: 0 0 8px; }
.books-row .book-card .hook { font-size: 14px; line-height: 1.6; color: var(--cream-2); opacity: 0.8; margin: 0; }
.books-row .book-card .status { display: inline-block; margin-top: 12px; padding: 4px 10px; font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold); border: 1px solid var(--gold); }
.books-row .book-card .status.latest { color: var(--ink); background: var(--gold); }
.books-row .book-card .status.coming { color: var(--fg-muted); border-color: var(--fg-muted); }
.books-row .book-card .status.untranslated { color: var(--fg-muted); border-color: var(--fg-muted); border-style: dashed; }

@media (max-width: 1024px) {
  .book-hero { grid-template-columns: 1fr; gap: 40px; padding: 60px 32px; }
  .book-hero h1 { font-size: 48px; }
  .for-readers-section { padding: 60px 32px; }
  .for-readers-section h2 { font-size: 36px; }
  .for-readers-list { grid-template-columns: 1fr; gap: 0; }
  .next-prev { grid-template-columns: 1fr; }
  .nav-link-box { padding: 40px 32px; }
  .nav-link-box.prev { border-right: none; border-bottom: 1px solid var(--line); }
  .nav-link-box.next { text-align: left; align-items: flex-start; }
  .series-block { padding: 60px 32px; }
  .series-block .header-left h2 { font-size: 48px; }
  .books-row { grid-template-columns: 1fr 1fr; gap: 24px; }
  .books-row.four-up { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .books-row, .books-row.four-up { grid-template-columns: 1fr; }
}
