/* ======================================
   🌐 GLOBAL MEDIA QUERY SET
   ====================================== */

/* Base Styles (Mobile First)
------------------------------------*/
html {
    font-size: 16px;
}

/* Extra Small Devices (Portrait Phones, <576px)
------------------------------------*/
/* e.g., iPhone SE, Galaxy Fold, older Androids */
@media (max-width: 575.98px) {
    /* Adjust font sizes, hide large banners, stack columns */
    body {
        font-size: 14px;
    }
    
    #chaity_slogan{
        font-size: 16px;
    }
    .other_businesses{
        font-size: 2em;
    }

}

/* Small Devices (Landscape Phones, ≥576px)
------------------------------------*/
/* e.g., iPhone 11, Samsung Galaxy S21, Pixel 7 */
@media (min-width: 576px) and (max-width: 767.98px) {
    .other_businesses{
        font-size: 2em;
    }
}

/* Medium Devices (Tablets, ≥768px)
------------------------------------*/
/* e.g., iPad Mini, iPad Air, Galaxy Tab */
@media (min-width: 768px) and (max-width: 991.98px) {
    #chaity_slogan{
        font-size: 16px;
    }
     .other_businesses{
        font-size: 2em;
    }
}

/* Large Devices (Laptops, ≥992px)
------------------------------------*/
/* e.g., MacBook Air, Surface Laptop, Chromebooks */
@media (min-width: 992px) and (max-width: 1199.98px) {

}

/* Extra Large Devices (Desktops, ≥1200px)
------------------------------------*/
/* e.g., iMac 24", large monitors */
@media (min-width: 1200px) and (max-width: 1399.98px) {

}

/* Ultra-Wide Screens (4K Displays, ≥1400px)
------------------------------------*/
/* e.g., iMac 27", 4K/5K monitors */
@media (min-width: 1400px) {

}

/* ======================================
   📱 DEVICE-SPECIFIC MEDIA QUERIES
   ====================================== */

/* iPhone SE / Small iPhones */
@media only screen and (max-device-width: 375px) {

}

/* iPhone 14 Pro, Galaxy S23 (390–430px width) */
@media only screen and (min-device-width: 390px) and (max-device-width: 430px) {
    
    .apparel_sewing{
        top: 12px;
        left: -12px;
        padding: 20px;
    }
    
    #chaity_slogan{
        font-size: 16px;
    }
    .other_businesses{
        font-size: 2em;
    }
    
    .business-button{
        width: 100%;
    }

}

/* iPad (Portrait) */
@media only screen and (min-device-width: 768px) and (max-device-width: 820px) and (orientation: portrait) {
    #chaity_slogan{
        font-size: 16px;
    }
     .other_businesses{
        font-size: 2em;
    }
}

/* iPad (Landscape) */
@media only screen and (min-device-width: 820px) and (max-device-width: 1024px) and (orientation: landscape) {
 .other_businesses{
        font-size: 2em;
    }
}

/* MacBook Pro 13" */
@media only screen and (min-width: 1280px) and (max-width: 1440px) {

}

/* 4K Ultra HD Monitors */
@media only screen and (min-width: 2560px) {

}

/* ======================================
   🖥️ ORIENTATION QUERIES
   ====================================== */

/* Portrait Mode */
@media screen and (orientation: portrait) {
    #chaity_slogan{
        font-size: 16px;
    }
}

/* Landscape Mode */
@media screen and (orientation: landscape) {

}


/* Responsive */
@media (max-width: 768px) {
    .process-card {
        width: 100%;
        max-width: 400px;
    }

    .timeline-container {
        height: 200px;
    }

    .timeline-item {
        width: 40px;
        height: 40px;
        font-size: 0.8rem;
    }
}


/* Responsive font-size using viewport units */
@media (min-width: 1200px) {
  .team-header-text h4 {
      font-size: 5vw; /* Large screens */
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  .team-header-text h4 {
      font-size: 4vw; /* Medium screens */
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  .team-header-text h4 {
      font-size: 3vw; /* Small screens */
  }
}

@media (max-width: 767.98px) {
  .team-header-text h4 {
      font-size: 6vw; /* Extra small screens */
  }
}