@media only screen and (min-width: 3000px){ 
    :root{
        --h1Fs:18.25rem;
    }
}

@media only screen and (min-width: 1901px) {
    
}

@media only screen and (min-width: 1440px) and (max-width: 1900px){ 
    :root{
        --autoWidth: 100.25em;
        --baseFS: 14px;
        --h1Fs:9.25rem;
    }

    .work_categories_text ul li{ padding: 0.8em 0em;}
    .footer_inner{ padding:0px 60px 0px 0px;}
}

/*start of = (min-width: 1366px) and (max-width: 1440px)*/
@media only screen and (min-width: 1366px) and (max-width: 1439px){
   

    :root{
        --autoWidth: 100.25em;
        --baseFS: 14px;
        --h1Fs:9.25rem;
        --fs210: 9.25rem;
    }

    .work_categories_text ul li{ padding: 0.8em 0em;}
    .footer_inner{ padding:0px 60px 0px 0px;}





/*end of = (min-width: 1366px) and (max-width: 1900px)*/			
}





 
/*start of = (min-width: 1280px) and (max-width: 1365px)*/	
@media only screen and (min-width: 1280px) and (max-width: 1365px){

    :root{
        --autoWidth: 100.25em;
        --baseFS: 13px;
        --h1Fs:9.25rem;
        --fs210: 8.25rem;
    }

    .work_categories_text ul li{ padding: 1.2em 0em;}
    .autoContent{  padding: 0px 60px; }
    .footer_inner{ padding:0px 60px 0px 0px;}
/*end of = (min-width: 1280px) and (max-width: 1365px)*/			
}





/*start of = (min-width: 1024px) and (max-width: 1279px)*/
@media only screen and (min-width: 1024px) and (max-width: 1279px){

   
	
body { -webkit-text-size-adjust:none;  -webkit-overflow-scrolling: touch; }
  
:root{
    --autoWidth: 100.25em;
    --baseFS: 14px;
    --h1Fs:8.25rem;
    --fs210: 6.25rem;
    --fs100: 4.25em;
    --sacPad: 12em;
    --fs24: 1.1125em;

}

.work_categories_text ul li{ padding: 0.8em 0em;}
.autoContent{  padding: 0px 40px; }
.work_categories_row{ gap: 5em;}
.work_categories_text{ width: 100%;}

.footer_inner{ padding:0px 60px 0px 0px;}
.footerSocials{ width: auto;}
/*end of = (min-width: 1024px) and (max-width: 1279px)*/			
}


/*start of = (min-width: 768px) and (max-width: 1023px)*/	
@media only screen and (min-width: 768px) and (max-width: 1023px){
   
 
body { -webkit-text-size-adjust:none; -webkit-overflow-scrolling: touch; overflow-x: hidden; overflow-y: auto; cursor: default;  }
  
:root{
    --autoWidth: 100.25em;
    --baseFS: 14px;
    --h1Fs:7.25rem;
    --fs210: 5.25rem;
    --fs100: 4.25em;
    --sacPad: 12em;
}

.work_categories_text ul li{ padding: 1.2em 0em;}
.autoContent{  padding: 0px 40px; }
.work_categories_row{ gap: 2em;}
.work_categories_text{ width: 100%;}
.footer_inner{ flex-direction: column; gap: 15px;}
.footer_inner span{ width: 100%; text-align: center;}
.footerSocials ul{ justify-content: center;}


/* end 768 */
}


@media only screen and (min-width:0px) and (max-width:767px){
    html{ min-height: 0;}
    body { -webkit-text-size-adjust:none; -webkit-overflow-scrolling: touch; overflow-x: hidden; overflow-y: auto; cursor: default; min-height: 0; }
  
    :root{
        --autoWidth: 100.25em;
        --baseFS: 12px;
        --h1Fs:4.25rem;
        --fs210: 3.25rem;
        --fs100: 3.25em;
        --sacPad: 8em;
        --fs30: 1.575em;
    }
    
    .work_categories_text ul li{ padding: 1em 0em;}
    .autoContent{  padding: 0px 20px; }
    .work_categories_row{  display: block;  position: initial;   }
    .work_categories_col{ width: 100%;  background: var(--yellow);  }
    .work_categories_row::before{ display: none;}

    .work_categories_text{ width: 100%;}
    .brandName a{ text-align: right;}
    .intro_blueprint { padding: 2.125em 0em; }
    .small_heading span{ margin-left: 35px;}
    
    .intro_philosophy_list_inner{ flex-direction: column; gap: 1em;}
    .mission_inner{ display: block; text-align: center;}
    .mission_left, .mission_right{ width: 100%;}
    .mission_left{ padding-bottom: 30px;}
    .footer_inner{ flex-direction: column; gap: 15px;}
    .footer_inner span{ width: 100%; text-align: center;}

    .popup.open{ max-width: calc(100% - 40px); }
    .popup_heading{ padding-right: 92px;}
    .button{ min-width: 120px; justify-content: center;}
    .hello_btn{ transform: scale(0.7); right: 10px; bottom:20px;}
    .banner{ padding-top:50px;}
    #mouse-circle, .bubble { display: none !important;}
    .popup_heading h2{ font-size: 4em;}
    .form_field input, .form_field textarea{ height: 44px; font-size: 16px;}
    .form_field textarea{ height: 144px; }


}

@media only screen and (min-width:320px) and (max-width:519px){
    
 
}
@media only screen and (min-width:520px) and (max-width:767px){
   
    
}



@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 812px) 
and (-webkit-device-pixel-ratio : 3)
and (orientation : landscape)  {  

 


}

@supports (-webkit-touch-callout: none) {
    html, body {
        overflow-x: hidden;  
    }
}