/* =========================================================
   responsive.css — breakpoints untuk seluruh halaman
   ========================================================= */

@media (max-width: 1080px){
  .book-grid{grid-template-columns:repeat(3,1fr);}
  .category-grid{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1.2fr 1fr 1fr;}
  .footer-grid .footer-col.hide-tablet{display:none;}
  .catalog-layout{grid-template-columns:220px 1fr;}
}

@media (max-width: 900px){
  .main-nav{
    position:fixed;inset:var(--header-h) 0 0 0;background:var(--surface);
    flex-direction:column;align-items:stretch;padding:18px;gap:4px;
    transform:translateY(-8px);opacity:0;pointer-events:none;transition:all .2s ease;
    border-top:1px solid var(--border);overflow-y:auto;
  }
  .main-nav.open{transform:translateY(0);opacity:1;pointer-events:auto;}
  .main-nav a{padding:14px 16px;font-size:1rem;}
  .nav-toggle{display:flex;}
  .hero .container{grid-template-columns:1fr;}
  .hero-art{order:-1;max-width:420px;margin-inline:auto;}
  .catalog-layout{grid-template-columns:1fr;}
  .catalog-sidebar{position:static;order:2;}
  .auth-split{grid-template-columns:1fr;}
  .auth-art{display:none;}
}

@media (max-width: 720px){
  .book-grid{grid-template-columns:repeat(2,1fr);gap:14px;}
  .category-grid{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .stat-strip .container{justify-content:flex-start;gap:32px;}
  .cta-band{flex-direction:column;text-align:center;padding:34px 22px;}
  .cta-band .btn{width:100%;}
  .section{padding:44px 0;}
  .detail-grid{grid-template-columns:1fr;}
  .detail-cover{max-width:220px;margin-inline:auto;}
}

@media (max-width: 520px){
  .book-grid{grid-template-columns:repeat(2,1fr);gap:10px;}
  .header-actions .user-chip span.chip-name{display:none;}
  .footer-grid{grid-template-columns:1fr;gap:26px;}
  .footer-bottom{flex-direction:column;text-align:center;}
  .social-row{justify-content:center;}
  .search-box{padding:5px 5px 5px 16px;}
  .search-box .btn span{display:none;}
  .search-box .btn{padding:11px 16px;}
  h1{font-size:1.8rem !important;}
  .profile-tabs{overflow-x:auto;}
  .filter-toolbar{flex-direction:column;align-items:stretch !important;}
}