/* ========================
   Base Styles (Mobile First)
   ======================== */

/* Mobile-first default styles here */


/* ========================
   Extra Small Devices (0–575px)
   ======================== */
   @media (max-width: 575px) {

    h2 {
      font-size: 30px;
    }

    .brand-gap {
        gap: 30px;
    }

    .mobile-hidden{
      display: none !important;
    }

    .portfolio-items .portfolio-item {
      margin-bottom: 0px;
    }

    .faq-items .faq-item h4.faq-toggle::after {
      display: none;
    }

    .section-title2 {
      font-size: 30px;
      line-height: 35px;
    }

    .diverse-title {
      font-size: 30px;
      line-height: 35px;
    }

    h4.section-sub-title {
      line-height: 25px;
    }

    .breadcrumb h1 {
      font-size: 35px;
    }

    .footer-margin {
      margin-top: 40px;
    }
  };
  
  
  /* ========================
     Small Devices (576–767px)
     ======================== */
  @media (min-width: 576px) and (max-width: 767px) {
    /* Styles for small phones and small tablets */
  };
  
  
  /* ========================
     Medium Devices (768–991px)
     ======================== */
  @media (min-width: 768px) and (max-width: 991px) {
    /* Styles for tablets and smaller laptops */
  }
  
  
  /* ========================
     Large Devices (992–1199px)
     ======================== */
  @media (min-width: 992px) and (max-width: 1199px) {
    /* Styles for standard desktops */
  }
  
  
  /* ========================
     Extra Large Devices (1200–1399px)
     ======================== */
  @media (min-width: 1200px) and (max-width: 1399px) {
    /* Styles for large desktops */
  }
  
  
  /* ========================
     XXL Devices (1400px and up)
     ======================== */
  @media (min-width: 1400px) {
    /* Styles for ultra-wide displays */
  }