/* ==========================================================================
   Responsive Design (Tablet & Mobile)
   ========================================================================== */
@media (max-width: 992px) {
    .hero-content { grid-template-columns: 1fr; text-align: center; }
    .hero-stats { justify-content: center; }
    .hero-image { display: none; /* Simplify on smaller screens */ }
    .pricing-grid { grid-template-columns: 1fr; max-width: 500px; margin: 0 auto; gap: 50px; }
    .price-card.popular { transform: scale(1); }
    .about-grid, .why-grid, .contact-grid { grid-template-columns: 1fr; }
    .timeline-container::before { left: 30px; }
    .timeline-item { justify-content: flex-start; padding-right: 0; padding-left: 80px; }
    .timeline-item:nth-child(even) { padding-left: 80px; }
    .t-icon { left: 30px; }
    .t-content { width: 100%; margin-left: 0 !important; }
}

@media (max-width: 768px) {
    .top-bar { display: none; }
    .header { top: 0; }
    .hamburger { display: block; }
    .nav-links { position: fixed; top: 80px; left: -100%; width: 100%; height: calc(100vh - 80px); background: var(--white); flex-direction: column; align-items: center; justify-content: center; transition: var(--transition); gap: 20px; }
    [data-theme="dark"] .nav-links { background: var(--bg-dark); }
    .nav-links.active { left: 0; }
    .mega-menu { position: static; width: 100%; box-shadow: none; flex-direction: column; display: none; }
    .dropdown.active .mega-menu { display: flex; }
    .hero-title { font-size: 2.5rem; }
    .section-padding { padding: 60px 0; }
    .footer-grid { grid-template-columns: 1fr; text-align: center; }
    .footer-col h4::after { left: 50%; transform: translateX(-50%); }
    .get-quote { display: none; }
    .blog-grid { grid-template-columns: 1fr; }
    .portfolio-grid { grid-template-columns: 1fr; }
}