/* 6. EXTRA BIG SCREEN / XX-LARGE (Larger screens, 1400px and up) */

@media (min-width: 1400px) {

  .container {
    width: 1320px;
  }
  .service-section-gap {
    margin-top: -120px;
  }
  .carousel-container{
    margin-top: -120px;
  }

  .home-counter-section{
    margin-top: -50px;
  }
  .home-student-feedback{
    margin-top: -18vh;
  }

  .home-service-carousel{
    margin-top: 90px;
  }

  .carousel-container{
     margin-top: -680px;
     margin-bottom: -620px;
  
  }

  .req-home{
    margin-top: -45px;
  }

  .section-heading-home{
    margin-top: -70px;
  }

  .cta-section{
    margin-bottom: 10vh;
  }

  
}




/* 5. DESKTOP / EXTRA LARGE (Large Desktops, 1200px and up) */
@media (min-width: 1200px) and (max-width: 1399px) { 

  .service-section-8{
    margin-top: -10vh;
  }
    .slider-container{
    margin-top: -12vh;
    margin-bottom: -10vh;
  }


  .about-section-8{
    margin-top: -30vh;
  }

   .service-section-gap {
    margin-top: -120px;
  }
  .carousel-container{
    margin-top: -120px;
  }

  .home-counter-section{
    margin-top: -25vh;
    margin-bottom: -12vh;
  }

  .home-student-feedback{
    margin-top: -45vh;
  }

  .home-service-carousel{
    margin-top: 90px;
  }

  .service-section-home{
    margin-top: -29vh;
  }

  .carousel-container{
     margin-top: -120px;
     margin-bottom: -90px;
  
  }

  .req-home{
    margin-top: -19vh;
  }

  .slider_container{
    margin-top: -8vh;
  }

  .section-heading-home{
    margin-top: -90px;
  }

  .payments{
    margin-top: -28vh;
  }

  .cta-section{
    margin-bottom: 18vh;
  }
 
}


/* 4. LAPTOP / LARGE DEVICES (Desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) { 

  .service-section-8{
    margin-top: -10vh;
  }


  .about-section-8{
    margin-top: -30vh;
  }

   .service-section-gap {
    margin-top: -120px;
  }
  .carousel-container{
    margin-top: -120px;
  }

  .home-counter-section{
    margin-top: -25vh;
    margin-bottom: -12vh;
  }

  .home-student-feedback{
    margin-top: -65vh;
  }

  .home-service-carousel{
    margin-top: 90px;
  }

  .service-section-home{
    margin-top: -45vh;
  }

  .carousel-container{
     margin-top: -120px;
     margin-bottom: -40px;
  
  }

  .req-home{
    margin-top: -19vh;
  }

  .slider_container{
    margin-top: -8vh;
  }

  .section-heading-home{
    margin-top: -90px;
  }

  .payments{
    margin-top: -32vh;
  }

  .cta-section{
    margin-bottom: 18vh;
  }
 
}


/* 3. TABLET / MEDIUM DEVICES (Tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px){ 

  .service-section-8{
    margin-top: -10vh;
  }

  .about-section-8{
    margin-top: -30vh;
  }

   .service-section-gap {
    margin-top: -120px;
  }
  .carousel-container{
    margin-top: -120px;
  }

  .home-counter-section{
    margin-top: -20vh;
    margin-bottom: -8vh;
  }

  .home-student-feedback{
    margin-top: -55vh;
  }

  .home-service-carousel{
    margin-top: 90px;
  }

  .service-section-home{
    margin-top: -20vh;
  }

  .carousel-container{
     margin-top: -120px;
     margin-bottom: -40px;
  
  }

  .req-home{
    margin-top: -19vh;
  }

  .slider_container{
    margin-top: -8vh;
  }

  .section-heading-home{
    margin-top: -80px;
  }

  .payments{
    margin-top: -32vh;
  }

  .cta-section{
    margin-bottom: 18vh;
  }
 
}


/* 2. MOBILE / SMALL DEVICES (Landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767px) { 
  

  .service-section-8{
    margin-top: -10vh;
  }

  .about-section-8{
    margin-top: -30vh;
  }

   .service-section-gap {
    margin-top: -120px;
  }
  .carousel-container{
    margin-top: -120px;
  }

  .home-counter-section{
    margin-top: -20vh;
    margin-bottom: -8vh;
  }

  .home-student-feedback{
    margin-top: -55vh;
  }

  .home-service-carousel{
    margin-top: 90px;
  }

  .service-section-home{
    margin-top: -20vh;
  }

  .carousel-container{
     margin-top: -120px;
     margin-bottom: -120px;
  
  }

  .req-home{
    margin-top: -19vh;
  }

  .slider_container{
    margin-top: -8vh;
  }

  .section-heading-home{
    margin-top: -80px;
  }

  .payments{
    margin-top: -32vh;
  }

  .cta-section{
    margin-bottom: 18vh;
  }
 
}


/* extra small */

@media (max-width: 575px){

  .running-text{
    margin-top: -250px;
    
  }
  

  .service-section-8{
    margin-top: -8vh ;
  }


 .home-student-feedback{
    margin-top: -32vh;
  }

  .home-service-carousel{
    margin-top: 90px;
  }

  .service-section-home{
    margin-top: -5vh;
  }
 
 


  .carousel-container{
     margin-top: -35vh;
     margin-bottom: -45vh;
  
  }


  .slider_container{
    margin-top: -5vh;
  }

  .digital{
    margin-top: -2vh;
  }

  .section-heading-home{
    margin-top: -60px;
  }

  .payments{
    margin-top: -15vh;
  }

  .payments .team-thumb img{

    width: 80px;

  }

  .payments .team-item-3 .team-content h3{
    font-size: 20px;
  }

  .cta-section{
    margin-bottom: 18vh;
  }
 
}
/* BREAKPOINT: EXTRA SMALL DEVICES (< 576px) */
@media (max-width: 575.98px) {

    /* 1. Reset the main container spacing */
    .payments .payments-section {
        margin-left: 0 !important; /* Remove the 35px offset */
        padding: 0 10px;           /* Add slight padding to the sides of the screen */
    }

    /* 2. Style the Parent Wrapper as the "Card" */
    .payments .team-item-3 {
        /* Layout behaviors */
        display: flex;
        flex-direction: column; /* Stacks image on top of text */
        align-items: center;    /* Centers items horizontally */
        justify-content: center;
        
        /* Visuals (Make it look like a card) */
        background: #080138;       /* White background (or your dark theme color) */
        border: 1px solid #eee; /* Optional: border */
        border-radius: 10px;    /* Rounded corners */
        padding: 20px 10px;     /* Padding inside the card */
        
        /* Size adjustments */
        width: 100% !important; /* Fits the col-6 width perfectly */
        height: 100%;           /* Ensures all cards in row are same height */
        margin-bottom: 0;       /* Let the row gap handle spacing */
    }

    /* 3. Reset the Image Container */
    .payments .team-thumb {
        /* Remove the old fixed 220px/200px sizes */
        width: auto !important; 
        height: auto !important;
        margin-bottom: 15px;    /* Space between image and text */
        background: transparent; /* Remove background if it was white before */
    }

    /* 4. Control Image Size */
    .payments .team-thumb img {
        max-width: 80px;  /* Control icon size so it fits nicely */
        height: auto;
    }

    /* 5. Center the Text Content */
    .payments .team-content {
        text-align: center; /* Ensures text is centered */
        width: 100%;
    }

    /* 6. Typography adjustments for small screens */
    .payments .team-content .title a {
        font-size: 13px;       /* Smaller phone number text */
        display: block;        /* Ensures it takes full line */
        margin-bottom: 5px;
    }
    
    .payments .team-content span {
        font-size: 11px;       /* Smaller subtitle */
        display: block;
    }
}