/* Additional mobile fixes for portfolio website */

/* Fix for certificate grid and skills cards on mobile */
@media (max-width: 768px) {
  /* Center skills cards */
  .skills-grid {
    max-width: 500px;
    margin: 0 auto;
  }
  
  /* Center certificate grid */
  .certificate-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    margin: 0 auto;
    max-width: 500px;
  }
  
  /* Ensure equal heights for certificate items */
  .certificate-item {
    height: auto;
    min-height: 130px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  
  /* Fix education extra section */
  .education-extra {
    margin-top: 3rem;
    padding: 0 1rem;
  }
  
  /* Education section centering */
  .education-container {
    padding: 0 1rem;
  }
}

/* Very small screens */
@media (max-width: 400px) {
  .certificate-grid {
    grid-template-columns: 1fr;
    max-width: 250px;
    margin: 0 auto;
  }
  
  .certificate-item {
    margin-bottom: 1rem;
  }
  
  /* Ensure skill categories are properly centered */
  .skill-category {
    max-width: 280px;
    margin: 0 auto 1.5rem;
  }
}