/* css/responsive.css */

/* 1100px breakpoint */
@media (max-width:1100px) {
  .featured-grid,
  .service-grid,
  .quote-grid,
  .gallery-preview{
    grid-template-columns:1fr 1fr;
  }
  .section-heading h2{
    font-size:42px;
  }

  .navbar.nav-open nav a{
    font-size:20px;
    letter-spacing:3px;
  }
}

/* 768px and below */
@media (max-width:768px) {
  nav{
    display:none;
  }

  .hero-content h1,
  .configurator-hero-content h1{
    font-size:52px;
  }

  .section-heading h2{
    font-size:42px;
  }

  .featured-grid,
  .service-grid,
  .quote-grid,
  .gallery-preview{
    grid-template-columns:1fr;
  }

  .hero-buttons{
    flex-direction:column;
  }

  .contact-box{
    padding:50px 30px;
  }

  .contact-box h2{
    font-size:42px;
  }
}

/* small adjustments for very small screens */
@media (max-width:480px) {
  .hero-content,
  .configurator-hero-content{
    left:5%;
    width:90%;
    max-width:90%;
  }

  .navbar{
    padding-left:5%;
    padding-right:5%;
  }

  .hero-content h1,
  .configurator-hero-content h1{
    font-size:38px;
  }
}