/*Responsive design*/ 
@media (max-width: 768px) {
  .nav-links {
    display: none;
  }
  .mobile-menu {
    display: flex;
  }
  .hero h1 {
    font-size: 2.5rem;
  }
  .hero .tagline {
    font-size: 1.2rem;
  }
  .profile-image {
    width: 150px;
    height: 150px;
    font-size: 3rem;
  }
  .cta-buttons {
    flex-direction: column;
    align-items: center;
  }
  .about-content,
  .contact-content {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .projects-grid {
    grid-template-columns: 1fr;
  }
  .skills-grid {
    grid-template-columns: 1fr;
  }
  .experience-header {
    flex-direction: column;
    gap: 1rem;
  }
  .section-title {
    font-size: 2rem;
  }
  .container {
    padding: 0 1rem;
  }
  .fab {
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    font-size: 1.2rem;
  }
}