.circles-after::after {
    content: ' ● ● ●'; /* Unicode character for filled circles */
    display: inline;
    color: black; /* Adjust color of the circles */
    margin-left: 5px; /* Add some space between the paragraph and the circles */
    font-size: 1.2em; /* Adjust size of the circles */
  }

  .btn-black {
    background-color: black; /* Black background */
    color: white; /* White text */
    border: none; /* Remove default border */
    padding: 10px 20px; /* Add padding for better appearance */
    font-size: 16px; /* Adjust font size */
    cursor: pointer; /* Change cursor to pointer on hover */
    text-transform: uppercase; /* Make text uppercase */
    border-radius: 5px; /* Add slight rounding to corners (optional) */
    transition: background-color 0.3s ease; /* Smooth hover effect */
  }
  
  .btn-black:hover {
    background-color: #333; /* Darker shade for hover effect */
  }

  .styled-text {
    margin-top: 250px;
    font-size: 200px;
    margin-left: 10%;
    position: relative; /* Establishes positioning context for the pseudo-elements */
    z-index: 10; /* Ensure the text appears above the squares */
  }
  
  .styled-text::before {
    content: '';
    position: absolute;
    top: -100px;
    left: -10px;
    width: 300px;
    height: 300px;
    background-color: #f99e1c;
    z-index: -1; /* Place the big square behind the text */
  }
  
  .styled-text::after {
    content: '';
    position: absolute;
    top: -150px;
    left: -60px;
    width: 50px;
    height: 50px;
    background-color: #f99e1c;
    z-index: -1; /* Place the small square behind the text */
  }
  /* Mobile Styles */
@media (max-width: 768px) {
    .styled-text {
      font-size: 80px; /* Reduce text size for smaller screens */
      margin-left: 5%; /* Adjust margin for better alignment */
    }
  
    .styled-text::before {
      width: 150px; /* Reduce big square size */
      height: 150px;
      top: -40px; /* Adjust position */
      left: -5px;
    }
  
    .styled-text::after {
      width: 30px; /* Reduce small square size */
      height: 30px;
      top: -70px; /* Adjust position */
      left: -30px;
    }
  }
  
  .background-car-section {
    position: relative; /* Establish positioning context for the overlay */
    background: url('../img/bg/car-bg.jpg') no-repeat center center / cover;
  }
  
  .background-car-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent black overlay */
    z-index: 1; /* Place the overlay above the background but below the content */
  }
  
  .background-car-section * {
    position: relative; /* Ensure content appears above the overlay */
    z-index: 2;
  }
  .brands-slider{
    margin-top: 50px;
    margin-bottom: 50px;
  }
  .brands-slider .listing-owl-item img{
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .popular-slider-group .listing-owl-item .listing-owl-group{
    box-shadow: unset;
    background: unset;
  }
  .popular-cartype-slider .owl-stage{
    background: #f99e1c;
  }

  .popular-cartype-slider .owl-stage h6, .popular-cartype-slider .owl-stage p{
    display: none;
  }
  .popular-slider-group .listing-owl-item .listing-owl-group:hover{
    background-color:#000;

  }
  .facts-number .count-group{
    background-image:unset;
    background: #4d4a58;
    border-radius: 0;
    border-right: 3px solid #f99e1c;
    color: #fff;
  }
  .facts-number .count-group .count-content h4{
    color: #fff;
  }
  .facts-number .count-group .count-img{
    background: unset;
    border-right: 3px solid #f99e1c;
    border-radius: 0;
  }

  .facts-number{
    position: relative; /* Establish positioning context for the overlay */
    background: url('../img/bg/counter.jpg') no-repeat center center / cover;
  }