/* Make sure the mobile dropdown menu shows */
.ast-header-break-point .main-navigation {
  display: block !important;
}

.ast-header-break-point .main-header-menu {
  display: block !important;
  background-color: #0b1a33; /* dark navy background */
}

.ast-header-break-point .main-header-menu a {
  color: #ffffff !important; /* white text */
  padding: 12px 20px; /* spacing for touch */
  display: block;
}

/* Force tagline onto its own row on mobile */
@media (max-width: 768px) {
  .ast-site-identity .site-description {
    display: block !important;
    width: 100% !important;      /* take full row */
    font-size: 13px !important;  /* smaller text */
    line-height: 1.5 !important; /* better spacing */
    margin: 10px 0 0 0 !important; /* push down below title */
    text-align: center !important;
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
  }

  /* Make sure the container doesn't squish it */
  .ast-site-identity {
    flex-direction: column !important; /* stack title and tagline vertically */
    align-items: center !important;
  }
}





/* Fix tagline overlap/jumbled text on mobile */
@media (max-width: 768px) {
  .ast-site-identity .site-description,
  .ast-header-break-point .site-description {
    display: block !important;
    width: 100% !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    margin: 10px auto 0 auto !important;
    text-align: center !important;
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
  }

  /* Stack site title + tagline vertically */
  .ast-site-identity {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }
}




@media (max-width: 768px) {
  p.has-text-align-center.has-commissioner-font-family.has-small-font-size {
    display: block !important;
    width: 100% !important;
    font-size: 14px !important;   /* tweak size */
    line-height: 1.5 !important;  /* fix spacing */
    margin: 10px auto 0 auto !important;
    text-align: center !important;
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
  }
}




/* Fix tagline gibberish text on mobile */
@media (max-width: 768px) {
  p.has-text-align-center.has-commissioner-font-family.has-small-font-size {
    display: block !important;
    width: 100% !important;
    font-size: 15px !important;
    line-height: 1.6 !important;   /* gives it breathing room */
    margin: 12px auto 0 auto !important;
    text-align: center !important;
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    letter-spacing: normal !important;
  }
}



@media (max-width: 768px) {
  p.has-text-align-center {
    display: block !important;
    width: 100% !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    margin: 12px auto 0 auto !important;
    text-align: center !important;
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    letter-spacing: normal !important;
  }
}




/* Keep emojis aligned with headings on mobile */
@media (max-width: 768px) {
  h2, h3 {
    display: inline-flex;
    align-items: center;
    gap: 0.4em; /* space between emoji and text */
    line-height: 1.3 !important; 
    text-align: center;
  }

  h2 img, h3 img, h2 span, h3 span {
    display: inline-block;
    vertical-align: middle;
  }
}