/* Theme additions — kept separate from the verbatim prototype main.css. */

/* News category filter */
.news-filter { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 28px; font-size: 14px; }
.news-filter a { color: var(--color-text); opacity: 0.7; font-weight: 500; }
.news-filter a:hover, .news-filter a.active { color: var(--color-accent); opacity: 1; text-decoration: none; }

/* Featured image on cards / single */
.news-card-media { margin: -4px 0 14px; border-radius: 8px; overflow: hidden; }
.news-card-media img { display: block; width: 100%; height: auto; }

/* Pagination (the_posts_pagination) */
.pagination { margin-top: 40px; }
.pagination .nav-links { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.pagination .page-numbers { display: inline-block; padding: 8px 14px; border: 1px solid var(--color-border); border-radius: 6px; color: var(--color-text); font-size: 14px; font-weight: 500; }
.pagination .page-numbers.current { background: var(--color-accent); color: #FAF7F2; border-color: var(--color-accent); }
.pagination a.page-numbers:hover { border-color: var(--color-accent); color: var(--color-accent); text-decoration: none; }

/* Single post back link */
.post-back { display: inline-block; margin-top: 32px; font-weight: 500; font-size: 14px; }

/* Neighborhood map + address checker result */
.boundary-block { align-items: stretch; }                 /* map + checker columns share height */
.fpna-map { height: 100%; min-height: 360px; width: 100%; border-radius: 10px; overflow: hidden; z-index: 0; }
.checker-result { font-size: 14px; font-weight: 500; margin-top: 12px; min-height: 1.2em; }
.checker-result.is-in { color: var(--color-accent); }
.checker-result.is-out { color: #9a5b25; }

/* Prose tables (used on the Board Guide page) */
.prose table { width: 100%; border-collapse: collapse; margin: 20px 0; font-size: 15px; }
.prose th, .prose td { text-align: left; padding: 8px 12px; border: 1px solid var(--color-border); vertical-align: top; }
.prose th { background: var(--color-bg-alt); font-weight: 600; }

/* Cleaner printouts (e.g., Save-as-PDF of the Board Guide) */
@media print {
	.banner-50, .main-nav, .cta-band { display: none !important; }
}

/* Form success notice */
.form-notice { background: rgba(45, 90, 61, 0.10); border: 1px solid var(--color-accent); color: var(--color-accent); border-radius: 8px; padding: 14px 16px; font-weight: 500; font-size: 15px; margin-bottom: 20px; }

/* Land use case status badge */
.case-status { display: inline-block; vertical-align: middle; margin-left: 10px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--color-accent); border: 1px solid var(--color-border); border-radius: 999px; padding: 3px 10px; }

/* Phone tweaks */
@media (max-width: 560px) {
	/* Footer: stack to one column so the brand blurb isn't cramped */
	.footer-grid { grid-template-columns: 1fr; gap: 28px; }
	.footer-blurb { max-width: none; }
}


/* Stay connected — two equal CTAs (#1) */
.stay-connected { display: flex; flex-wrap: wrap; gap: 32px; justify-content: center; max-width: 800px; margin: 8px auto 0; }
.stay-connected .stay-option { flex: 1 1 300px; max-width: 360px; }
.stay-connected .stay-option .btn { display: inline-block; margin-bottom: 12px; }
.stay-connected .stay-option p { font-size: 15px; opacity: 0.92; margin: 0; }


/* Partner / sponsor logo wall (50th event page) */
.logo-wall { display: flex; flex-wrap: wrap; align-items: center; gap: 28px 36px; margin-top: 8px; }
.logo-wall a { display: inline-flex; align-items: center; }
.logo-wall img { height: 64px; width: auto; max-width: 160px; object-fit: contain; }
@media (max-width: 600px) { .logo-wall img { height: 48px; max-width: 120px; } }


/* Map: stop the Leaflet grid item overflowing its column on mobile (min-width:auto bug) */
.boundary-block { min-width: 0; }
.boundary-block > * { min-width: 0; max-width: 100%; }

/* Offset in-page anchor jumps so the sticky header doesn't cover the target */
html { scroll-padding-top: 92px; }

/* Mobile nav: brand stays fixed; the links row eases out on scroll-down, back in on scroll-up */
@media (max-width: 820px) {
  .header-inner { transition: padding-bottom .3s ease; }
  nav.main-nav {
    flex-basis: 100%;          /* links sit on their own row under the brand */
    overflow: hidden;
    max-height: 200px;
    opacity: 1;
    transition: max-height .32s ease, opacity .24s ease, margin-top .32s ease;
  }
  .site-header.nav-hidden nav.main-nav {
    max-height: 0;
    opacity: 0;
    margin-top: -6px;
    pointer-events: none;
  }
  /* collapsed bar hugs the brand — no empty space below it */
  .site-header.nav-hidden .header-inner { padding-bottom: 10px; }
}