@media (max-width: 768px) {
  /* CSS here applies ONLY when screen width is 768px or less (tablet + mobile) */
  .hero-section{height:900px;}
  .navbar-brand{font-size:30px;padding:0 0rem;height:100%;display:flex;font-family:Jost;font-weight:600;letter-spacing:5px;}
  .hero-text{font-size:3.6rem;margin-bottom:8rem;}
  .hero-subtext{font-size:18px;}
  .why-span-overtext{font-size:18px;}
  .why-span-text{font-size:30px;line-height:1.3;}
  .container-why{padding:20px;}
  .change-span-text{font-size:30px;}
  .how-span-text{font-size:30px;}
  .services-header h2{font-size:50px;letter-spacing:1px;}
  .service-title{flex:1;text-align:center;font-size:30px;font-weight:700;margin:0;font-family:Jost,sans-serif;letter-spacing:0px;text-transform:uppercase;}
  .service-row{display:flex;justify-content:space-between;align-items:center;padding:2px 10;}
  .team-large-text{font-size:42px;}
  .about-history-p{font-size:20px;letter-spacing:0px;word-spacing:0xp;}
  .team-info{padding:20px 20px;}
  .utility-text{font-size:40px;letter-spacing:5px;font-family:Jost,sans-serif;font-weight:700;}
  .utility-row{margin-top:100px;}
  .clients-span{font-size:30px;letter-spacing:1px;line-height:0.9;}
  .clients{padding:20px;}
  
}