/* ========== MOBILE FIRST (Default Styles) ========== */
/* Already handled in main CSS */

/* ========== SMALL TABLETS (>=576px) ========== */
@media (min-width: 576px) {
  .hero-content h1 {
    font-size: var(--font-size-hero-sm);
  }

  .section-title {
    font-size: var(--font-size-title-sm);
  }

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

  .gallery-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .section {
    padding: var(--section-padding-sm) 0;
  }

  .section-compact {
    padding: var(--section-compact-padding-sm) 0;
  }
}

/* ========== TABLETS (>=768px) ========== */
@media (min-width: 768px) {
  /* Show menu links (hide hamburger) */
  .hamburger {
    display: none;
  }

  .nav-links {
    position: static;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-sm);
    max-height: none;
    overflow: visible;
    background: transparent;
  }

  .nav-link {
    border-top: none;
    padding: var(--space-sm) var(--space-lg);
    white-space: nowrap;
  }

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

  .services-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .hero-content h1 {
    font-size: var(--font-size-hero-md);
  }

  .form-quick {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: start;
    gap: var(--space-2xl) var(--space-2xl);
  }

  .form-quick button[type="submit"] {
    grid-column: 1 / -1;
    justify-self: center;
  }

  .form-quote {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-2xl);
  }

  .section-compact {
    padding: var(--section-compact-padding-md) 0;
  }

  .lightbox-stage {
    height: var(--height-lightbox-stage-sm);
  }
}

/* ========== DESKTOPS (>=992px) ========== */
@media (min-width: 992px) {
  .services-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .why-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .testimonials-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .gallery-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .footer-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .section {
    padding: var(--section-padding-md) 0;
  }

  .navbar-inner {
    height: var(--height-navbar-desktop);
    padding: 0 var(--space-lg);
  }

  .hero-content h1 {
    font-size: var(--font-size-hero-lg);
  }

  .section-compact {
    padding: var(--section-compact-padding-lg) 0;
  }

  .lightbox-stage {
    height: var(--height-lightbox-stage-md);
  }
}

/* ========== LARGE DESKTOPS (>=1200px) ========== */
@media (min-width: 1200px) {
  .container {
    max-width: 1200px;
  }

  .hero-content h1 {
    font-size: var(--font-size-hero-xl);
  }

  .hero-content p {
    font-size: 1.25rem;
  }

  .section-title {
    font-size: var(--font-size-title-lg);
  }

  .section {
    padding: var(--section-padding-lg) 0;
  }

  .section-compact {
    padding: var(--section-compact-padding-xl) 0;
  }
}

/* ========== EXTRA-LARGE SCREENS (>=1400px) ========== */
@media (min-width: 1400px) {
  .container {
    max-width: 1320px;
  }

  .form-quick {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-3xl);
  }

  .gallery-grid {
    gap: var(--space-3xl);
  }

  .services-grid,
  .why-grid {
    gap: var(--space-3xl);
  }

  .lightbox-content {
    max-width: 860px;
  }

  .lightbox-stage {
    height: var(--height-lightbox-stage-lg);
  }
}

/* ========== MOBILE NAVIGATION ========== */
@media (max-width: 767px) {
  .nav-links {
    box-shadow: var(--shadow-mobile-nav);
  }
}
