.hero {
    background: #f8f9fa;
    padding: 100px 0;
    text-align: center;
}

.hero h1 {
    font-weight: bold;
    white-space: nowrap;
/*  overflow: hidden;*/
    text-overflow: ellipsis;
    font-size: clamp(2rem, 6vw, 3rem); /* Scales from small to large screens */
}    

.section-title {
    font-weight: bold;
    margin-bottom: 30px;
}

a {
    text-decoration: none;
}

footer {
    background: #212529;
    color: #fff;
    padding: 20px 0;
}

#newsCarousel .carousel-inner {
    height: 7em;
}

#newsCarousel .carousel-item {
    padding: 1em;
    text-align: center;
}

/* Apply flex layout ONLY when visible */
#newsCarousel .carousel-item.active {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}    

.logo-responsive {
  max-width: 500px;
  width: 100%;
}

@media (max-width: 768px) {
  .logo-responsive {
    max-width: 100%;
  }
}

.accordion-button:focus {
  outline: none;             /* Removes the default blue outline */
  box-shadow: none;          /* Removes Bootstrap’s focus shadow */
}


.pink {
  color: #ff00b4;
}

h2 {
  color: #4d4d4d; /* 70% grey */
}


.btn-pink {
  background-color: #ff00b4;
  border-color: #ff00b4;
  color: white;
}
.btn-pink:hover {
  background-color: #e600a1;
  border-color: #e600a1;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}


html, body {
  overflow-x: hidden;
}
