/* Extra small devices (phones) */
@media (max-width: 575px) {
  /* Styles for mobile */
  .nav-links {
    display: none !important;
  }
  .hero-banner {
    padding: 40px 20px;
  }
  .banner-image-section {
    display: none;
  }
  .banner-btn {
    flex-direction: column;
    align-items: start !important;
  }
  .banner-heading {
    font-size: 35px;
  }
  .about {
    padding: 40px 20px;
  }
  .content-section {
    padding-left: 0;
  }
  .about-img {
    margin-bottom: 30px;
  }
  .heading {
    font-size: 24px;
    margin-top: 10px;
  }
  .feature-text {
    width: 95%;
    text-align: center;
  }
  .feature-heading {
    font-size: 26px;
  }
  .feature-left {
    padding: 20px;
  }
  .feature-right {
    justify-content: center;
    padding: 40px 40px 0 40px;
  }
  .item-2,
  .item-3 {
    grid-column: 1 / span 2;
  }
  .testimonial {
    padding: 40px 20px;
  }
  .testimonial-content {
    max-width: 100%;
  }
  .footer {
    padding: 40px 20px 80px 20px;
    min-height: auto;
    flex-direction: column;
  }
  .footer-text {
    font-size: 30px;
  }
  .footer .btn-wraper {
    margin: auto;
  }
  .footer-text-wraper {
    margin-bottom: 40px;
  }
  .copyright {
    flex-direction: column;
    margin-top: 20px;
  }
  .footer .absolute {
    position: static;
    padding: 0;
    margin-top: 20px;
  }
  .main-content {
    padding: 40px 20px;
  }
  .banner-title {
    font-size: 40px;
  }
  .copyright-text {
    margin-bottom: 20px;
  }
}

/* Small devices (portrait tablets and large phones) */
@media (min-width: 576px) and (max-width: 767px) {
  /* Styles for small tablets */
  .banner-image-section {
    position: inherit;
  }
  .banner-heading {
    font-size: 40px;
  }
  .about {
    padding: 40px;
  }
  .content-section {
    padding-left: 0;
  }
  .about-img {
    margin-bottom: 30px;
  }
  .heading {
    font-size: 30px;
  }
  .feature-text {
    width: 80%;
    text-align: center;
  }
  .feature-right {
    justify-content: center;
    padding: 40px 40px 0 40px;
  }
  .item-2,
  .item-3 {
    grid-column: 1 / span 2;
  }
  .testimonial {
    padding: 40px 20px;
  }
  .testimonial-content {
    max-width: 100%;
  }
  .footer {
    padding: 50px 20px 80px 20px;
    min-height: auto;
    flex-direction: column;
  }
  .footer-text {
    font-size: 40px;
  }
  .footer-text-wraper {
    margin-bottom: 40px;
  }
  .main-content {
    padding: 40px 20px;
  }
  .banner-title {
    font-size: 45px;
  }
  .copyright-text {
    margin-bottom: 20px;
  }
  .copyright {
    flex-direction: column;
    margin-top: 20px;
  }
  .footer .absolute {
    position: static;
    padding: 0;
    margin-top: 20px;
  }
}

/* Medium devices (landscape tablets) */
@media (min-width: 768px) and (max-width: 991px) {
  /* Styles for tablets / small laptops */
  .banner-image-section {
    position: inherit;
  }
  .banner-heading {
    font-size: 45px;
  }
  .about {
    padding: 60px;
  }
  .about-img {
    margin-bottom: 40px;
  }
  .content-section {
    padding-left: 20px;
  }
  .feature-text {
    width: 80%;
    text-align: center;
  }
  .feature-right {
    justify-content: center;
    padding: 40px 40px 0 40px;
  }
  .item-2,
  .item-3 {
    grid-column: 1;
  }
  .item-2,
  .item-3 {
    grid-column: 1 / span 2;
  }
  .testimonial {
    padding: 60px;
  }
  .testimonial-content {
    max-width: 100%;
  }
  .footer {
    padding: 60px;
  }
  .footer-text {
    font-size: 45px;
  }
  .main-content {
    padding: 60px;
  }
  .banner-title {
    font-size: 50px;
  }
  .copyright {
    flex-direction: column;
  }
  .copyright-text {
    margin-bottom: 20px;
  }
  .footer .absolute {
    position: relative;
    padding-bottom: 20px;
    margin-top: 50px;
  }
}

/* Large devices (desktops) */
@media (min-width: 992px) and (max-width: 1199px) {
  /* Styles for desktops */
  .hero-banner {
    min-height: 85vh;
  }
  .banner-heading {
    font-size: 48px;
  }
  .about {
    padding: 80px;
  }
  .testimonial {
    padding: 80px;
  }
  .testimonial-content {
    max-width: 100%;
  }
  .footer {
    padding: 80px;
  }
  .footer-text {
    font-size: 50px;
  }
  .main-content {
    padding: 80px;
  }
}

/* Extra large devices (large desktops) */
@media (min-width: 1200px) {
  /* Styles for large screens */
}