/*
 * Header fixes. Nothing else about the site changes: same theme, fonts,
 * colors, logo, and menu items.
 *
 * Astra's header band was 1240px while the content column is 768px, so the
 * logo read as orphaned far to the left, and the menu wrapped onto a second
 * line leaving a big gap.
 *
 * Everything below Astra's 921px breakpoint is left alone, so the mobile
 * hamburger menu still stacks vertically as it should.
 */

/* Pull the header band in toward the content column. */
.site-primary-header-wrap.ast-container {
  max-width: 1100px;
}

/* Keep the Subscribe button on one line. */
.ast-header-button-1 .ast-custom-button {
  white-space: nowrap;
}

@media (min-width: 922px) {
  /* Keep logo, menu, Subscribe and search on a single row.
     The menu items must not shrink, or the labels break mid-word. */
  .ast-builder-menu-1 .main-header-menu {
    flex-wrap: nowrap;
  }
  .ast-builder-menu-1 .main-header-menu > li {
    flex-shrink: 0;
  }
  .ast-builder-menu-1 .main-header-menu .menu-link {
    white-space: nowrap;
  }
}

/* Between the breakpoint and ~1150px the row is tight, so trim the menu
   spacing just enough to keep it on one line. */
@media (min-width: 922px) and (max-width: 1150px) {
  .ast-builder-menu-1 .main-header-menu {
    font-size: 0.88em;
  }
  .ast-builder-menu-1 .main-header-menu > li > .menu-link {
    padding-left: 0.45em;
    padding-right: 0.45em;
  }
}

/*
 * Content links: Astra underlines them via
 *   .ast-single-post .entry-content a { text-decoration: underline; }
 * which lands inconsistently (some links carry inline overrides, some don't),
 * so it reads as random underlining. Links stay colour-distinguished, and the
 * underline returns on hover for affordance.
 */
.ast-single-post .entry-content a,
.ast-comment-content a:not(.ast-comment-edit-reply-wrap a) {
  text-decoration: none;
}
.ast-single-post .entry-content a:hover,
.ast-single-post .entry-content a:focus-visible {
  text-decoration: underline;
}

/* Subscribe button is now an RSS link.
   Only style the pill itself: .menu-link is the mobile-only duplicate and
   must keep whatever display Astra gives it, or it appears twice on desktop. */
.ast-header-button-1 .ast-custom-button {
  display: inline-flex;
  align-items: center;
  gap: 0.45em;
}
.ast-header-button-1 a.menu-link .lr-rss-icon {
  margin-right: 0.4em;
}
.lr-rss-icon {
  flex: 0 0 auto;
  vertical-align: middle;
}