/* Mobile: < 640px */
@media (max-width: 640px) {
  h1 { font-size: 1.5rem; }
  h2 { font-size: 1.15rem; }

  .hero h1 { font-size: 1.8rem; }
  .hero-subtitle { font-size: 0.9rem; }

  .home-setup {
    flex-direction: column;
  }

  .plans-grid {
    grid-template-columns: repeat(2, 1fr);
    max-width: 100%;
  }

  .plan-meta {
    flex-direction: column;
    gap: var(--spacing-md);
  }

  .dashboard-header {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-sm);
  }

  .calendar-grid {
    gap: 2px;
  }

  .calendar-day {
    font-size: 0.55rem;
  }

  .calendar-day .day-number {
    font-size: 0.55rem;
  }

  .calendar-day .day-games {
    display: none;
  }

  .calendar-detail-stats {
    flex-direction: column;
    gap: var(--spacing-xs);
  }

  .chart-header {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-sm);
  }

  .share-card-inner {
    width: 320px;
  }

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

  .nav-links {
    gap: var(--spacing-md);
  }

  .insights-nav {
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  .highlight-cards {
    grid-template-columns: 1fr;
  }

  .social-buttons {
    flex-direction: column;
    align-items: stretch;
  }
}

/* Tablet: 640px - 1024px */
@media (min-width: 641px) and (max-width: 1024px) {
  .plans-grid {
    grid-template-columns: repeat(3, 1fr);
    max-width: 100%;
  }
}

/* Desktop: > 1024px */
@media (min-width: 1025px) {
  .plans-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}