/* ============================================
   RESPONSIVE — PPCCHHUU SKETCHBOOK ZINE
   ============================================ */

@media (max-width: 1200px) {
  .flash-masonry { columns: 3; }
  .ig-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 1024px) {
  .hero { grid-template-columns: 1fr 1fr; }
  .hero-polaroids { display: none; }
  .flash-grid { grid-template-columns: 1fr 1fr; }
  .flash-masonry { columns: 2; }
  .section-cta { gap: 2rem; }
  .cta-claim { width: 165px; height: 165px; }
  .cta-custom { width: 185px; }
  .footer-inner { grid-template-columns: 1fr 1fr; }
  .works-grid { grid-template-columns: 1fr 1fr; }
  .contact-grid { grid-template-columns: 1fr; gap: 2rem; }
  .section-about { grid-template-columns: 1fr; gap: 2.5rem; }
}

@media (max-width: 768px) {
  :root { --rings: 0px; }

  body { margin-left: 0; }
  .notebook-rings { display: none; }
  .cur-dot, .cur-ring { display: none; }
  body { cursor: auto; }
  * { cursor: auto !important; }

  .navbar { padding: .45rem 1rem; }
  .nav-tabs { display: none; }
  .nav-brand .nav-handle, .nav-brand .nav-social { display: none; }
  .mobile-menu-btn { display: block; cursor: pointer !important; }

  .hero { grid-template-columns: 1fr; padding: 2.5rem 1.25rem; }
  .hero-sketchbook { display: none; }
  .hero-polaroids { display: none; }
  .hero-title { font-size: clamp(48px, 14vw, 88px); }

  .flash-grid { grid-template-columns: 1fr 1fr; gap: 1.75rem 1rem; }
  .flash-masonry { columns: 1; padding: 1.5rem 1.25rem; }

  .section-cta { padding: 3rem 1.25rem; gap: 1.5rem; flex-direction: column; }
  .cta-claim { width: 160px; height: 160px; }
  .cta-custom { width: 220px; }

  .ig-grid { grid-template-columns: repeat(2, 1fr); }

  .section-about { padding: 3rem 1.25rem; }
  .section-ig { padding: 3rem 1.25rem; }
  .section-flash { padding: 3rem 1.25rem; }

  .footer-inner { grid-template-columns: 1fr; gap: 1.5rem; }

  .form-row { grid-template-columns: 1fr; }
  .upload-area { grid-template-columns: 1fr 1fr; }
  .flash-page-hdr { flex-direction: column; align-items: flex-start; }
  .flash-page-actions { align-items: flex-start; }
  .contact-grid { grid-template-columns: 1fr; }
  .section-about { grid-template-columns: 1fr; }
  .works-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .flash-grid { grid-template-columns: 1fr; }
  .ig-grid { grid-template-columns: repeat(2, 1fr); }
  .upload-area { grid-template-columns: 1fr; }
  .steps { flex-direction: column; align-items: flex-start; gap: .4rem; }
  .step-arrow { transform: rotate(90deg); }
  .modal-actions { flex-direction: column; }
  .modal-actions .stamp-btn { width: 100%; text-align: center; }
  .hero-title { font-size: clamp(44px, 16vw, 80px); }
}
