@media (max-width: 1050px) {
    .navbar-toggle {
      display: flex;
    }

    .navbar-nav {
      position: fixed;
      top: 0;
      left: 0;
      width: 100vw;
      height: 0;
      overflow: hidden;
      background: var(--main);
      flex-direction: column;
      justify-content: center;
      align-items: center;
      transition: height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      z-index: 100;
      padding: 0;
      opacity: 0.97;
    }

    .navbar-nav.active {
      height: 100vh;
      padding: 0;
    }

    .navbar-nav li {
      margin: 1.2rem 0;
      text-align: center;
      width: 100%;
    }

    .navbar-nav .nav-link {
      font-size: 2rem;
      color: var(--white, #fff);
      font-weight: 700;
      letter-spacing: 2px;
      display: block;
      padding: 0.5rem 0;
      transition: color 0.2s;
    }
}

@media (max-width: 900px) {
  .about-container {
      flex-direction: column;
      text-align: center;
      gap: 2.5rem;
      }
  
  .about-image img {
      width: 80vw;
      max-width: 350px;
      }

    .team-grid {
      flex-direction: column;
      align-items: center;
      gap: 2rem;
    }

    .portfolio-grid {
      flex-direction: column;
      align-items: center;
      gap: 2rem;
    }

    .pricing-grid {
      flex-direction: column;
      align-items: center;
      gap: 2rem;
    }

    .pricing-grid {
      flex-direction: column;
      align-items: center;
      gap: 2rem;
    }
}