/* ==========================================================================
   RESPONSIVE BREAKPOINTS & MOBILE NAVIGATION
   ========================================================================== */

/* Large Tablets & Medium Laptops (Max 1200px) */
@media (max-width: 1200px) {
  .nav-links a {
    font-size: 0.78rem;
    padding: 4px 7px;
  }
  .nav-container {
    padding: 5px 12px;
  }
}

/* Tablets & Small Laptops (Max 1024px) */
@media (max-width: 1024px) {
  .hero-title {
    font-size: 3.2rem;
  }

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

  .contact-grid {
    grid-template-columns: 1fr;
  }

  .timeline-wrapper::before {
    left: 20px;
  }

  .timeline-item {
    width: 100%;
    padding-left: 60px !important;
    padding-right: 0 !important;
  }

  .timeline-item.left, .timeline-item.right {
    left: 0;
  }

  .timeline-dot {
    left: 12px !important;
  }
}

/* Hide hamburger on desktop */
.mobile-menu-toggle {
  display: none;
}

/* Mobile Devices (Max 768px) */
@media (max-width: 768px) {
  .section-padding {
    padding: 60px 0;
  }

  .section-title {
    font-size: 2.2rem;
  }

  .hero-title {
    font-size: 2.4rem;
  }

  .hero-tagline {
    font-size: 1.05rem;
  }

  .hero-cta-group {
    flex-direction: column;
    align-items: stretch;
  }

  .glow-button, .outline-button {
    justify-content: center;
    width: 100%;
  }

  .skills-grid, .projects-grid, .services-grid {
    grid-template-columns: 1fr;
  }

  /* Mobile Nav Drawer */
  .mobile-menu-toggle {
    display: flex;
    flex-direction: column;
    gap: 6px;
    cursor: pointer;
  }

  .mobile-menu-toggle span {
    width: 26px;
    height: 2px;
    background: var(--text-primary);
    transition: var(--transition-smooth);
  }

  .mobile-menu-toggle.active span:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
  }
  .mobile-menu-toggle.active span:nth-child(2) {
    opacity: 0;
  }
  .mobile-menu-toggle.active span:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
  }

  .nav-links {
    position: fixed;
    top: 70px;
    left: 0;
    width: 100%;
    background: rgba(8, 11, 19, 0.95);
    backdrop-filter: blur(20px);
    flex-direction: column;
    padding: 30px;
    border-bottom: 1px solid var(--border-light);
    transform: translateY(-150%);
    transition: var(--transition-smooth);
  }

  .nav-links.mobile-active {
    transform: translateY(0);
  }

  /* Custom cursor hide on touch devices */
  #cursor-dot, #cursor-outline {
    display: none !important;
  }

  * {
    cursor: auto !important;
  }
}