/* =============================================
   Screenly — responsive.css
   All breakpoints in one place
   ============================================= */

@media (max-width: 1024px) {
  :root { --page-pad: 24px; }
  .steps-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  .nav-links { display: none; }

  .panel-grid { grid-template-columns: 1fr; }
  .steps-grid { grid-template-columns: 1fr 1fr; }
  .guides-grid { grid-template-columns: 1fr 1fr; }
  .content-stats-row { grid-template-columns: 1fr 1fr; }
  .line-stats-row { grid-template-columns: 1fr 1fr; }

  .scores-row { gap: 20px; }
  .score-side .score-svg   { width: 100px; height: 100px; }
  .score-center .score-svg { width: 150px; height: 150px; }
  .score-center .score-number { font-size: 2rem; }

  .match-score-hero { flex-direction: column; align-items: flex-start; }
  .match-score-circle .score-svg { width: 140px; height: 140px; }

  .footer-inner { flex-direction: column; text-align: center; }
  .refine-section { padding: 32px 20px; }
}

@media (max-width: 480px) {
  :root { --page-pad: 16px; }

  .steps-grid { grid-template-columns: 1fr; }
  .guides-grid { grid-template-columns: 1fr; }
  .content-stats-row { grid-template-columns: 1fr 1fr; }
  .line-stats-row { grid-template-columns: 1fr; }

  .scores-row { flex-direction: column; align-items: center; }
  .score-side   { order: 2; }
  .score-center { order: 1; }

  .hero-title { letter-spacing: -1px; }
  .trust-row { gap: 16px; }
  .download-row { flex-direction: column; align-items: center; }

  .skill-grid { grid-template-columns: repeat(auto-fill, minmax(140px,1fr)); }

  .results-tabs { flex-wrap: wrap; }
  .tab-btn { flex: none; }
}