@media (max-width: 768px) {
    .book-hero__title { font-size: var(--text-3xl); }
    .book-hero__subtitle { font-size: var(--text-xl); }
    .book-toc__link { flex-direction: column; align-items: flex-start; gap: 0.5rem; }
    .book-toc__number { text-align: right; }
    .book-header__inner { flex-direction: column; gap: 0.75rem; }
}
@media (max-width: 480px) {
    :root { --container-padding: 1rem; }
    .book-hero { padding: 2rem 0 1.5rem; }
    .book-hero__title { font-size: var(--text-2xl); }
}