@media (max-width: 1100px){
  .hero-grid,
  .about-grid{
    grid-template-columns:1fr;
  }

  .hero-content{
    text-align:center;
  }

  .hero-content p{
    margin:auto;
  }

  .hero-buttons{
    justify-content:center;
  }

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

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

  .pricing-grid,
  .card-grid{
    grid-template-columns:1fr 1fr;
  }

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

  .card-one{
    left:20px;
  }

  .card-two{
    right:20px;
  }
}

@media (max-width: 900px){
  .menu-btn{
    display:grid;
    place-items:center;
  }

  .navbar{
    position:fixed;
    top:78px;
    right:-100%;
    width:290px;
    height:calc(100vh - 78px);
    background:var(--white);
    flex-direction:column;
    align-items:flex-start;
    padding:28px;
    gap:18px;
    box-shadow:var(--shadow);
    transition:.4s ease;
  }

  .navbar.active{
    right:0;
  }

  .dropdown-menu{
    position:static;
    width:100%;
    opacity:1;
    visibility:visible;
    transform:none;
    display:none;
    box-shadow:none;
    margin-top:10px;
  }

  .dropdown:hover .dropdown-menu{
    display:block;
  }

  .nav-actions .btn{
    display:none;
  }

  .hero-content h1{
    font-size:46px;
  }

  .section-heading h2,
  .about-content h2,
  .cta-box h2{
    font-size:34px;
  }

  .hero-image img{
    height:460px;
  }
}

@media (max-width: 768px){
  .section{
    padding:70px 0;
  }

  .hero{
    padding:130px 0 70px;
  }

  .hero-stats{
    grid-template-columns:1fr;
  }

  .service-grid,
  .why-grid,
  .industry-grid,
  .process-grid,
  .pricing-grid,
  .card-grid{
    grid-template-columns:1fr;
  }

  .price-card.featured{
    transform:none;
  }

  .feature-list{
    grid-template-columns:1fr;
  }

  .testimonial-card{
    padding:30px 22px;
  }

  .testimonial-card p{
    font-size:18px;
  }

  .client{
    flex-direction:column;
    text-align:center;
  }

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

  .footer-bottom{
    flex-direction:column;
    text-align:center;
  }
}

@media (max-width: 520px){
  .container{
    width:92%;
  }

  .logo{
    font-size:22px;
  }

  .theme-toggle,
  .menu-btn{
    width:38px;
    height:38px;
  }

  .hero-content h1{
    font-size:36px;
    letter-spacing:-1px;
  }

  .hero-content p{
    font-size:16px;
  }

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

  .btn{
    width:100%;
  }

  .hero-image img{
    height:360px;
    border-radius:24px;
  }

  .floating-card{
    position:static;
    margin-top:15px;
  }

  .section-heading h2,
  .about-content h2,
  .cta-box h2{
    font-size:28px;
  }

  .about-image img{
    height:360px;
    border-radius:24px;
  }

  .page-hero h1{
    font-size:36px;
  }

  .page-hero{
    padding:130px 0 70px;
  }

  .whatsapp,
  .call-shortcut,
  .back-top{
    right:16px;
    width:48px;
    height:48px;
  }

  .call-shortcut{
    bottom:146px;
  }
}