/* ============================================================
   PEPIK — responsive.css
   ============================================================ */

/* ---- TABLET (≤1024px) ---- */
@media (max-width: 1024px) {
  .winners-layout,
  .story-layout,
  .tokenomics-layout,
  .roadmap-layout {
    grid-template-columns: 1fr;
  }

  .winners-video-card,
  .story-video-card { max-width: 480px; margin: 0 auto; }

  .roadmap-img-card { aspect-ratio: 16/9; max-height: 360px; }
  .roadmap-img { object-position: center; }

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

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

  .nav-links { gap: 20px; }
}

/* ---- MOBILE (≤768px) ---- */
@media (max-width: 768px) {
  body { cursor: auto; }
  .cursor, .cursor-follower { display: none; }

  /* Header */
  .nav-pill--links {
    display: none;
    position: fixed;
    top: 72px; left: 16px; right: 16px;
    flex-direction: column;
    border-radius: 22px;
    padding: 8px;
    gap: 2px;
    z-index: 199;
  }
  .nav-pill--links.mobile-open { display: flex; }
  .nav-pill--links a {
    padding: 13px 18px;
    border-radius: 14px;
    font-size: .95rem;
    color: var(--text);
    text-align: center;
  }
  .nav-burger { display: flex; }
  .nav-pill--logo span { display: none; }
  .nav-pill--actions .nav-cta { display: none; }

  /* Canvas hero */
  .canvas-hero {
    padding: 0 5vw 6vh;
    align-items: flex-end;
  }
  .canvas-hero-inner { max-width: 100%; padding: 22px 22px; }
  .canvas-hero-title { font-size: clamp(3.2rem, 14vw, 5rem); }

  /* Page sections */
  .page-section { padding: 70px 5vw; }
  .section-title { font-size: clamp(2.2rem, 8vw, 3rem); }

  /* Winners */
  .winners-layout { grid-template-columns: 1fr; }
  .winners-stats-row { grid-template-columns: 1fr 1fr; }

  /* Story */
  .story-layout { grid-template-columns: 1fr; }
  .story-layout .story-text-side { order: 2; }
  .story-layout .story-video-card { order: 1; }

  /* Tokenomics */
  .tokenomics-layout { grid-template-columns: 1fr; }
  .tokenomics-stats { grid-template-columns: 1fr 1fr; }

  /* Roadmap */
  .roadmap-layout { grid-template-columns: 1fr; }
  .roadmap-img-card { aspect-ratio: 16/9; }

  /* Buy */
  .buy-grid { grid-template-columns: 1fr 1fr; }

  /* Social */
  .story-social-row { flex-direction: row; flex-wrap: wrap; }

  /* Footer */
  .footer-links { gap: 20px; }
}

/* ---- SMALL PHONES (≤480px) ---- */
@media (max-width: 480px) {
  .buy-grid { grid-template-columns: 1fr; }
  .winners-stats-row { grid-template-columns: 1fr 1fr; }
  .tokenomics-stats { grid-template-columns: 1fr; }
  .token-ca-card { grid-column: 1; }
  .canvas-hero-actions { flex-direction: column; align-items: flex-start; }
  .btn-primary, .btn-secondary { font-size: .9rem; padding: 13px 22px; }
  .section-title { font-size: clamp(2rem, 9vw, 2.8rem); }
}
