* {
  font-family: 'Quattrocento Sans', sans-serif;
  font-size: 16px;
}


/* Mobile Responsive CSS for Values Section */
@media (max-width: 767.98px) {
    /* Stack columns vertically on mobile */
    .row.g-3 {
      flex-direction: column;
    }
    
    /* Add vertical spacing between items */
    .col-12.col-md-4 {
      margin-bottom: 1rem;
    }
    
    /* Adjust icon size for mobile */
    .d-flex.align-items-center i {
      font-size: 1.25rem;
    }
    
    /* Adjust spacing between icon and text */
    .d-flex.align-items-center .me-3 {
      margin-right: 0.75rem !important;
    }
    
    /* Make text slightly larger for mobile readability */
    .h6 {
      font-size: 0.95rem;
    }
  
  
  
  }   /* Mobile Responsive CSS for Registration Button Section */
  @media (max-width: 767.98px) {
    .container-fluid.py-3 {
      padding-left: 15px;
      padding-right: 15px;
    }
    
    .btn.px-4.py-3 {
      padding: 0.75rem 1rem !important; /* Smaller padding on mobile */
      font-size: 1rem; /* Adjust font size for mobile */
      white-space: normal; /* Allow text to wrap if needed */
    }
  }

  /* Base styles for the carousel */
#heroCarousel .carousel-item {
    height: calc(100vh - 85px);
}

#heroCarousel h2 {
    font-size: 3rem;
    line-height: 1.2;
}

#heroCarousel .lead {
    font-size: 1.25rem;
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
    #heroCarousel h2 {
        font-size: 2.5rem;
    }
    
    #heroCarousel .lead {
        font-size: 1.15rem;
    }
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
    #heroCarousel h2 {
        font-size: 2rem;
        padding: 0 15px;
    }
    
    #heroCarousel .lead {
        font-size: 1rem;
        padding: 0 15px;
    }
    
    #heroCarousel .carousel-item {
        min-height: 80vh;
    }
}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
    #heroCarousel h2 {
        font-size: 1.75rem;
    }
    
    #heroCarousel .carousel-item {
        min-height: 70vh;
    }
  }