/* Light blue navbar */
.navbar, .navbar .navbar-brand, .navbar .nav-link {
  background-color: #a7d8f0 !important;
}
.navbar .nav-link, .navbar-brand {
  color: #000 !important;
}
.navbar .nav-link:hover {
  text-decoration: underline;
}

/* Button style tweaks */
.btn-outline-secondary {
  border-color: #ccc;
  color: #333;
}
.btn-outline-secondary:hover {
  background-color: #a7d8f0;
  color: #000;
}

/* Headings */
h2, h3 {
  font-weight: 700;
}



/* Add gentle spacing between paragraphs */
#hero-heading p + p {
  margin-top: 0.9rem;
}

/* Optional: emphasize emojis slightly */
#hero-heading p {
  font-size: 1.18rem;
}
#hero-heading p::selection {
  background-color: #cbe9fa;
}

.badges span { 
  display: inline-block; 
  padding: .22rem .6rem; 
  margin: .15rem .3rem 0 0; 
  border-radius: 999px; 
  background: #eef3ff; 
  border: 1px solid #dbe5ff; 
  font-size: .9rem; 
  font-weight: 600; }

#hero-heading .about-title {
  font-size: 2.1rem;        /* try 1.8–2.2rem until it looks right */
  font-weight: 700;       /* optional: make lighter if too bold */
  line-height: 1.2;
}

/* Stack about-page links vertically instead of in a row */
.quarto-about-trestles .about-links {
  display: flex;            /* already flex, but we override direction */
  flex-direction: column;   /* vertical */
  align-items: flex-start;  /* left align buttons */
}

/* Space between each link button */
.quarto-about-trestles .about-link {
  margin-bottom: 0.4rem;
}