.coverPhoto{
  background-image:url('../images/custom/hero-img.jpg');
  background-position: 0px !important;

 }
 .experience {
      display: flex;
      align-items: center; /* vertical align inside */
      color:#ffffff;
    }

    .experience .number {
      font-size: 6rem;
      font-weight: bold;
      background: #007BFF;
      border-radius: 50%;
      width: 220px;
      height: 220px;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .experience .text {
      font-size: 3.5rem;
      margin-left: 20px;
    }



    
/* 🔽 For tablets and smaller (screen <= 768px) */
@media (max-width: 768px) {
  .experience .number {
    width: 150px;
    height: 150px;
    font-size: 4rem;
  }

  .experience .text {
    font-size: 2.5rem;
  }
}

/* 🔽 For mobile phones (screen <= 480px) */
@media (max-width: 480px) {
  .experience .number {
    width: 100px;
    height: 100px;
    font-size: 2.5rem;
  }

  .experience .text {
    font-size: 1.5rem;
  }
}