@media (max-width: 1100px) {
    .comic-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .main-nav { flex-wrap: wrap; justify-content: flex-start; gap: 3px; }
    .main-nav a { padding: 8px 10px; }
    .hero-copy { width: 70%; }
    .discovery-strip { align-items: flex-start; flex-direction: column; }
    .filters .search-label { flex-basis: 100%; }
}
@media (max-width: 760px) {
    .wrap { width: calc(100% - 32px); }
    .header-top { min-height: 76px; gap: 12px; }
    .brand, .header-top h1 { font-size: 1.35rem; }
    .brand img { width: 36px; height: 36px; }
    .brand-note { display: none; }
    .main-nav { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); }
    .main-nav a { text-align: center; font-size: .82rem; padding-inline: 4px; }
    .reading-link { font-size: .8rem; }
    main.wrap { padding-top: 20px; }
    main > section { margin-bottom: 36px; }
    h1 { font-size: 2rem; }
    h2 { font-size: 1.3rem; }
    .hero, .hero-slide { min-height: 525px; }
    .hero { border-radius: 12px; }
    .hero-image { width: 100%; height: 100%; }
    .hero-shade { background: linear-gradient(0deg, #102035 0%, #102035df 48%, #10203533 100%); }
    .hero-copy { width: 100%; padding: 140px 24px 90px; }
    .hero .eyebrow { margin-bottom: 13px; }
    .hero-copy h2 { font-size: 2.25rem; }
    .hero-intro { font-size: .9rem; }
    .slider-controls { left: 24px; bottom: 24px; }
    .actions { gap: 10px; }
    .button { padding: 10px 15px; }
    .discovery-strip { margin-top: 0; gap: 18px; }
    .mood-links { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
    .mood-links a { text-align: center; font-size: .85rem; }
    .section-heading { gap: 10px; align-items: flex-start; }
    .section-heading p { font-size: .8rem; }
    .section-heading .more { font-size: .8rem; padding-top: 4px; }
    .comic-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px 13px; }
    .update-section, .rank-section { padding: 20px; }
    .updates, .ranking { grid-template-columns: 1fr; }
    .update-time { display: none; }
    .updates article { gap: 8px; }
    .about-panel h2 { font-size: 1.6rem; }
    .mobile-panel { align-items: flex-start; flex-direction: column; padding: 26px; gap: 20px; }
    .mobile-panel > img { width: 72px; height: 72px; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
    .footer-grid > div { grid-column: 1 / -1; }
    .footer-bottom { flex-direction: column; gap: 7px; }
    .feature-book { grid-template-columns: 1fr; }
    .feature-book > img { max-height: 260px; }
    .feature-book > div { padding: 24px; }
    .filters { padding: 15px; gap: 14px; }
    .search-label input { width: 100%; min-width: 0; }
    .search-label { width: 100%; }
    .detail-hero { grid-template-columns: 1fr; gap: 24px; padding: 22px; }
    .detail-cover { width: 170px; }
    .book-facts { grid-template-columns: 1fr; }
    .chapter-grid { grid-template-columns: 1fr; gap: 10px; }
    .scene-grid { gap: 12px; }
}
@media (max-width: 480px) {
    .comic-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px 14px; }
    .hero-copy { padding-inline: 20px; }
    .hero-copy h2 { font-size: 2rem; }
    .slider-controls { left: 20px; }
    .section-icon { margin-right: 6px; }
    .rank-chapter { font-size: .75rem; }
    .ranking li { gap: 12px; }
    .scene-grid { grid-template-columns: 1fr; }
}
