/* ---------- COAAA mobile navigation - added 18 Sep 2026 ---------- */
/* Fallback (no JavaScript): wrapped two-row menu */
@media (max-width: 900px) {
  nav { padding: 0 0.9rem; }
  .nav-inner { flex-direction: column; height: auto; padding: 0.55rem 0 0.6rem; gap: 0.5rem; }
  .nav-logo img { height: 34px; }
  .nav-links { display: flex !important; flex-wrap: wrap; justify-content: center; gap: 0.15rem 0.25rem; }
  .nav-links a { font-size: 0.7rem; letter-spacing: 0.04em; padding: 0.3rem 0.45rem; }
  .nav-cta { padding: 0.3rem 0.7rem !important; }
  .page-top { padding-top: calc(104px + 2rem) !important; }
}
/* Enhanced (JavaScript available): hamburger menu */
.nav-toggle { display: none; background: none; border: 0; cursor: pointer; padding: 10px;
  flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px; }
.nav-toggle span { display: block; width: 24px; height: 2px; background: var(--charcoal);
  border-radius: 2px; transition: transform .25s, opacity .2s; }
.nav-toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2) { opacity: 0; }
.nav-toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
@media (max-width: 900px) {
  html.coaaa-js nav { padding: 0 0.6rem 0 0.9rem; }
  html.coaaa-js .nav-inner { flex-direction: row; height: 62px; padding: 0; gap: 0;
    justify-content: space-between; align-items: center; }
  html.coaaa-js .nav-toggle { display: flex; }
  html.coaaa-js .nav-links {
    display: none !important; position: absolute; top: 62px; left: 0; right: 0;
    flex-direction: column; align-items: stretch; flex-wrap: nowrap;
    background: #fdfbf7; border-bottom: 1px solid var(--pale); z-index: 1000;
    padding: 0.5rem 0.9rem 1rem; gap: 0.1rem;
    box-shadow: 0 12px 28px var(--shadow);
    max-height: calc(100vh - 62px); overflow-y: auto; }
  html.coaaa-js nav.is-open .nav-links { display: flex !important; }
  html.coaaa-js .nav-links a { font-size: 0.86rem; letter-spacing: 0.06em;
    padding: 0.8rem 0.6rem; display: block; border-radius: 6px; }
  html.coaaa-js .nav-cta { text-align: center; margin-top: 0.45rem; padding: 0.8rem 0.6rem !important; }
  html.coaaa-js .page-top { padding-top: calc(62px + 2.5rem) !important; }
}/* ==========================================================
   New-design pages: hold the old theme off.
   Scoped to .LayoutPlain so old-theme pages are unaffected.
   ========================================================== */
 
/* 1. Let our own page background show through Wild Apricot's zones */
.LayoutPlain .zonePlace.zoneContent,
.LayoutPlain .zonePlace.zoneContent > div { background: transparent; }
 
/* 2. Headings keep the case we wrote them in */
.LayoutPlain h1,
.LayoutPlain h2,
.LayoutPlain h3,
.LayoutPlain h4 { text-transform: none !important; }
 
/* 3. Links. The theme colours every link teal at a higher specificity
      than our page styles. These hand control back. The :not() is not
      decoration, it is what out-ranks the theme's own selector. */
.LayoutPlain a:not(.stylizedButton),
.LayoutPlain a:link:not(.stylizedButton),
.LayoutPlain a:visited:not(.stylizedButton),
.LayoutPlain a:hover:not(.stylizedButton),
.LayoutPlain a:active:not(.stylizedButton) { color: inherit; }
 
.LayoutPlain .nav-links a:not(.stylizedButton) { color: var(--charcoal); }
.LayoutPlain .nav-links a:not(.stylizedButton):hover { color: var(--navy); }
.LayoutPlain .nav-links a.nav-cta:not(.stylizedButton) { color: #fff; }
.LayoutPlain .nav-links a.nav-login:not(.stylizedButton) { color: var(--navy); }
 
.LayoutPlain a.btn-gold:not(.stylizedButton) { color: var(--charcoal); }
.LayoutPlain a.btn-ghost:not(.stylizedButton) { color: #fff; }
.LayoutPlain a.btn-navy:not(.stylizedButton) { color: #fff; }
.LayoutPlain a.card-link:not(.stylizedButton) { color: var(--charcoal); }
.LayoutPlain a.prog-link:not(.stylizedButton) { color: var(--navy); }
.LayoutPlain .contact-item a:not(.stylizedButton) { color: var(--navy); }
.LayoutPlain .step a:not(.stylizedButton) { color: var(--navy); }
.LayoutPlain .officers-note a:not(.stylizedButton) { color: var(--navy); }
 
.LayoutPlain .footer-links a:not(.stylizedButton) { color: rgba(255,255,255,0.4); }
.LayoutPlain .footer-links a:not(.stylizedButton):hover { color: rgba(255,255,255,0.8); }
.LayoutPlain .footer-copy a:not(.stylizedButton) { color: rgba(255,255,255,0.3); }
 
/* end of theme fix */