.WaGadgetLoginForm .loginContainer.authenticated.loginContainer.authenticated .loginLink {
width: 150px;
height: 50px;
}

.WaGadgetLoginForm .loginContainer.authenticated.loginContainer.authenticated .loginLink:before {
   font: normal 25px/50px 'Tahoma';
content: 'Profile';
}
.WaGadgetLoginForm .loginContainer.loginContainer .loginLink {
width: 150px;
height: 50px;
}
.WaGadgetLoginForm .loginContainer.loginContainer .loginLink:before {
font: normal 25px/50px 'Tahoma';
   content: 'Login';
}

/* Contact Us header fix 2026-07-04: make the CTA a deliberate top-aligned button instead of stranded text */
.isong-header-inner { align-items: flex-start !important; }
.isong-header-cta { margin-top: 20px; }
.isong-header-text { background-color: #2E4C78 !important; color: #ffffff !important; border: 2px solid #2E4C78 !important; }
.isong-header-text:hover { background-color: #ffffff !important; color: #2E4C78 !important; border: 2px solid #56B9A0 !important; }


/* ISONG header: match the Login/Profile button to the Contact Us button and align it */
.WaGadgetLoginForm .loginContainer .loginLink {
  position: relative !important;
  display: inline-block !important;
  box-sizing: border-box !important;
  width: 124px !important;
  height: 46px !important;
  padding: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  overflow: hidden !important;
  background-color: #67B8DB !important;
  border: 2px solid #67B8DB !important;
  border-radius: 8px !important;
  vertical-align: middle !important;
}
.WaGadgetLoginForm .loginContainer .loginLink:before {
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: Ubuntu, -apple-system, "system-ui", sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  color: #ffffff !important;
}
@media (max-width: 900px) {
  .WaGadgetLoginForm .loginContainer .loginLink { width: 106px !important; height: 40px !important; }
  .WaGadgetLoginForm .loginContainer .loginLink:before { font-size: 13px !important; }
}
@media (min-width: 901px) { .WaGadgetLoginForm { margin-top: 42px !important; } }
@media (max-width: 900px) { .WaGadgetLoginForm { margin-top: 38px !important; } }


/* Give the Login/Profile button room on inner-page headers so it does not
   overflow the header area. Inner pages split the header table 95%/5% (only
   ~60px for the login); this matches them to the home page's split so both
   buttons sit inside the header, identically on every page. */
.WaLayoutItem:has(.isong-header) { width: 83% !important; }
.WaLayoutItem:has(.WaGadgetLoginForm) { width: 17% !important; }
.WaGadgetLoginForm,
.WaGadgetLoginForm .loginContainer,
.WaGadgetLoginForm .authBox { text-align: left !important; }


/* ==========================================================================
   ISONG accessibility overrides - added July 2026
   Fixes WCAG 1.4.3 (contrast, AA) and WCAG 2.1.1 (keyboard, A) identified in
   the members-only accessibility audit. Each rule notes what it fixes.
   ========================================================================== */

/* --- 1. Keyboard-operable dropdown menus (WCAG 2.1.1, Level A) -------------
   The theme opened submenus on :hover only, so keyboard users could not reach
   ANY second-level page, including the entire members-only area. Mirror the
   hover reveal with :focus-within. */
.WaGadgetMenuHorizontal .menuInner ul.firstLevel li:focus-within > ul,
.WaGadgetMenuHorizontal .menuInner ul.firstLevel li:focus-within ul.secondLevel {
  visibility: visible !important;
  opacity: 1 !important;
}
.WaGadgetMenuHorizontal .menuInner ul.firstLevel li:focus-within > ul > li,
.WaGadgetMenuHorizontal .menuInner ul.firstLevel li:focus-within > ul > li > .item,
.WaGadgetMenuHorizontal .menuInner ul.firstLevel li:focus-within > ul > li > .item > a {
  visibility: visible !important;
}

/* Visible focus indicator on menu links (WCAG 2.4.7) */
.WaGadgetMenuHorizontal .menuInner ul a:focus,
.WaGadgetMenuHorizontal .menuInner ul a:focus-visible {
  outline: 3px solid #1A4E8A !important;
  outline-offset: -2px !important;
}

/* --- 2. Colour contrast (WCAG 1.4.3, Level AA) ----------------------------
   Brand green #56B9A0 on white is 2.37:1; AA needs 4.5:1 (body) / 3:1 (large).
   Darken green TEXT on light backgrounds to #2E7D68 (4.94:1 on white).
   Decorative rules and buttons keep the original green. */
h1:not(.promo),
.gadgetStyleNone h1:not(.promo),
.pageTitleOuterContainer h1,
.WaGadgetContentBlock h1, .WaGadgetContentBlock h2, .WaGadgetContentBlock h3,
.gadgetContentEditableArea h1, .gadgetContentEditableArea h2, .gadgetContentEditableArea h3 {
  color: #2E7D68;
}
.WaGadgetContentBlock a:not(.functionalButton),
.gadgetContentEditableArea a:not(.functionalButton),
.boxOuterContainer a:not(.functionalButton),
.WaGadgetPoweredByWA a,
a[href*="wildapricot.com"] {
  color: #2E7D68 !important;
}

/* Green headline banners carry WHITE text (white on #56B9A0 = 2.13:1).
   Darken the FILL so the white text passes (white on #2E7D68 = 4.94:1). */
[style*="background-color:#56B9A0"],
[style*="background-color: #56B9A0"],
[style*="background-color:#56b9a0"],
[style*="background-color: #56b9a0"] {
  background-color: #2E7D68 !important;
}

/* --- 3. Footer: green on the navy footer is 3.68:1. LIGHTEN (never darken)
   to the palette's lighter green #7DD4BE = 5.01:1 on navy. ----------------- */
.isong-footer h1, .isong-footer h2, .isong-footer h3,
.isong-footer h4, .isong-footer h5, .isong-footer h6 {
  color: #7DD4BE !important;
}


/* --- 4. Inline colour overrides (added after post-fix re-audit) -----------
   Abstract titles, presenter names and similar content are authored with an
   INLINE font colour of #56B9A0, which beats a plain stylesheet rule. Force the
   accessible green (#2E7D68 = 4.94:1 on white) wherever that colour is set
   inline. Elements on the navy banners set their own colours, so they are
   unaffected. */
font[color="#56B9A0"], font[color="#56b9a0"],
[style*="color:#56B9A0"], [style*="color: #56B9A0"],
[style*="color:#56b9a0"], [style*="color: #56b9a0"] {
  color: #2E7D68 !important;
}

/* The "Published Research" panel uses a mid-blue fill (#6C8EBF) behind WHITE link
   text, which measures only 3.36:1. Darken the fill to #4A6FA5 (5.11:1 with white)
   so those links pass AA. Same blue family, no visible redesign. */
[style*="background-color:#6C8EBF"], [style*="background-color: #6C8EBF"],
[style*="background-color:#6c8ebf"], [style*="background-color: #6c8ebf"] {
  background-color: #4A6FA5 !important;
}

/* --- 5. Site-wide contrast sweep (public + member pages) ------------------
   Found by auditing all 49 pages. Each replacement was checked to pass AA
   before being applied; the "was" figure is the failing ratio it replaces. */

/* Event-list dates were light grey (#B7B7B7) at 2.01:1. -> #6E6E6E = 5.10:1 */
.boxesListInner td.left,
.WaGadgetEventsStateList td.left,
td.left {
  color: #6E6E6E !important;
}

/* Committee chair roles were a lighter green (#3F9D85) at 3.15:1 on the card
   background. -> #2E7D68 = 4.72:1 */
.isong-chair-role,
span.isong-chair-role {
  color: #2E7D68 !important;
}

/* Brand-green buttons carried white text at 2.37:1. Darken the fill so the
   white text passes: white on #2E7D68 = 4.94:1. */
a.stylizedButton.buttonStyle001,
a.stylizedButton.buttonStyle002,
.stylizedButton.buttonStyle001,
.stylizedButton.buttonStyle002 {
  background-color: #2E7D68 !important;
  color: #FFFFFF !important;
}

/* Blue callout panels (#3598C1) held dark body text at 3.86:1, and after the
   green link fix their links dropped to 1.5:1. Darken the panel and set all
   text and links inside to white (5.86:1), matching the navy callouts used
   elsewhere on the site. */
[style*="background-color:#3598C1"], [style*="background-color: #3598C1"],
[style*="background-color:#3598c1"], [style*="background-color: #3598c1"] {
  background-color: #1F6C8C !important;
}
[style*="background-color:#3598C1"] *, [style*="background-color: #3598C1"] *,
[style*="background-color:#3598c1"] *, [style*="background-color: #3598c1"] * {
  color: #FFFFFF !important;
}
[style*="background-color:#3598C1"] a, [style*="background-color:#3598c1"] a {
  color: #FFFFFF !important;
  text-decoration: underline !important;
}

/* Muted italic note on the homepage was #6B7A90 at 4.36:1. -> #5A6778 = 5.76:1 */
.isong-repro-note, em[style*="color:#6B7A90"], [style*="color:#6b7a90"] {
  color: #5A6778 !important;
}

/* --- 6. Final contrast pass (all 49 pages re-audited) ---------------------
   Every replacement below was measured before being applied. */

/* IMPORTANT GUARD: text sitting on the navy panels must be WHITE, not the
   darkened green. Darkened green on navy is 1.76:1 - worse than the original
   problem. This is what stops a global green from breaking the dark panels.
   Do not remove it if you ever change the green. */
[style*="background-color:#2E4C78"] h1, [style*="background-color:#2E4C78"] h2,
[style*="background-color:#2E4C78"] h3, [style*="background-color:#2E4C78"] h4,
[style*="background-color:#2E4C78"] p,  [style*="background-color:#2E4C78"] span,
[style*="background-color:#2E4C78"] li, [style*="background-color:#2E4C78"] a,
[style*="background-color:#2e4c78"] h2, [style*="background-color:#2e4c78"] a,
[style*="background-color: #2E4C78"] h2, [style*="background-color: #2E4C78"] a {
  color: #FFFFFF !important;
}
[style*="background-color:#2E4C78"] a,
[style*="background-color:#2e4c78"] a { text-decoration: underline !important; }

/* Brand-green button/fill: white text needs the darker green (4.94:1). */
a.isong-members-btn, .isong-members-btn, span.isong-welcome-divider {
  background-color: #2E7D68 !important;
}
a.isong-members-btn, .isong-members-btn { color: #FFFFFF !important; }

/* Header Profile / login button: white on #67B8DB was 2.22:1 -> 5.25:1. */
/* ISONG's own CSS sets this blue with !important at higher specificity, so we keep
   their blue button and darken the TEXT instead: #333333 on #67B8DB = 5.69:1
   (white was 2.22:1). Least invasive, button looks unchanged. */
.WaGadgetLoginForm .loginContainer .loginLink,
.WaGadgetLoginForm .loginContainer.loginContainer .loginLink,
.WaGadgetLoginForm .loginContainer.authenticated .loginLink,
a.loginLink, .loginLink {
  color: #333333 !important;
}

/* Role labels on board and committee cards (#3F9D85 -> 4.72:1). */
.isong-member-role, span.isong-member-role,
.isong-chair-role,  span.isong-chair-role,
.isong-committee-card h3, .isong-member-card h3 { color: #2E7D68 !important; }

/* Forum metadata greys (#B7B7B7 = 2.0:1 -> 5.10:1). */
span.linkDisabled, .linkDisabled,
span.lastReplyAuthor, .lastReplyAuthor { color: #6E6E6E !important; }

/* Muted homepage note (#6B7A90 = 4.36:1 -> 5.76:1). */
p.isong-welcome-note, .isong-welcome-note { color: #5A6778 !important; }

/* Green text on the pale green tint: #2E7D68 there is 4.48:1 (just under).
   #26685A = 5.93:1. */
[style*="background-color:#E8F7F3"] a, [style*="background-color:#E8F7F3"] span,
[style*="background-color:#e8f7f3"] a, [style*="background-color:#e8f7f3"] span {
  color: #26685A !important;
}

/* --- 7. Corrections after re-audit --------------------------------------- */
.WaGadgetContent[style*="2E4C78"] *, .isong-navy *, .isong-navy-panel * { color:#FFFFFF !important; }
a.stylizedButton.buttonStyle001, a.stylizedButton.buttonStyle002,
.stylizedButton.buttonStyle001, .stylizedButton.buttonStyle002,
a.isong-members-btn { color:#FFFFFF !important; }
.isong-muted, [style*="color:#AAAAAA"], [style*="color:#aaaaaa"] { color:#6E6E6E !important; }
[style*="color:#777777"] { color:#5F5F5F !important; }

/* --- 8. Residual contrast + dark-mode opt-out ----------------------------
   From an audit of ALL 49 pages (public and member). Every replacement below
   was measured before being applied. */

/* Opt out of forced dark mode. The site has no dark theme; without this, some
   mobile browsers (notably Chrome on Android "Auto Dark Theme") will invert it
   and produce unpredictable, low-contrast results. Equivalent to
   <meta name="color-scheme" content="light">. */
:root { color-scheme: light; }

/* The SELECTED top-level nav item was brand green on white (2.37:1). This was
   the single most common failure - one on nearly every page. -> 4.94:1 */
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li.sel > .item > a,
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li.sel.dir > .item > a {
  color: #2E7D68 !important;
}

/* Content buttons (.btn) were white on brand green (2.37:1). -> 4.94:1 */
a.btn, .btn {
  background-color: #2E7D68 !important;
  color: #FFFFFF !important;
}

/* Labels/badges on the pale green tint (2.15:1). -> 5.93:1 */
.mission-label, .badge { color: #26685A !important; }

/* Small print inside content cards (#AAAAAA on #F8FAFB = 2.21:1). -> 4.87:1 */
.isong-committee-card .footer, .footer[class="footer"], div.footer {
  color: #6E6E6E !important;
}

/* Donation form: "Mandatory fields" note (#777 = 4.47:1). -> 6.39:1 */
.WaGadgetDonationForm strong, .generalFieldsContainer strong { color: #5F5F5F !important; }

/* Donation form buttons: white on the light blue (2.22:1). As with the Profile
   button, keep the blue and darken the text: #333333 = 5.69:1. */
input.nextButton, .nextButton, input.nextButton.button {
  color: #333333 !important;
}

/* Board role-group headings (#3F9D85 = 3.29:1). -> 4.94:1 */
.isong-role-group-header h3, .isong-role-group h3 { color: #2E7D68 !important; }

/* GUARD: navy buttons (.buttonStyle003) had our green text inside at 1.75:1.
   Text on navy must be white. */
a.buttonStyle003, a.buttonStyle003 *, .buttonStyle003, .buttonStyle003 * {
  color: #FFFFFF !important;
}

/* Links on the light-grey callout (#E6E6E6): our green is 3.96:1 there. -> 6.21:1 */
[style*="background-color:#E6E6E6"] a, [style*="background-color: #E6E6E6"] a,
[style*="background-color:#e6e6e6"] a { color: #245C4C !important; }


/* ============================================================
   WCAG 2.1 AA - 1.4.3 Contrast (final pass, 12 Jul 2026)
   ============================================================ */

/* Light ISONG green (#56b9a0) applied INLINE by the editor as rgb(86,185,160).
   2.37:1 on white -> #2E7D68 = 4.94:1.
   NOTE: earlier rules matched only the hex spelling, so they never fired.
   Keep BOTH the rgb() and hex forms below. */
.gadgetContentEditableArea [style*="rgb(86, 185, 160)"],
.gadgetContentEditableArea [style*="rgb(86,185,160)"],
.gadgetContentEditableArea [style*="#56b9a0" i],
.gadgetContentEditableArea font[color="#56b9a0" i],
.gadgetContentEditableArea font[color="#56b9a0" i] * {
  color: #2E7D68 !important;
}

/* Plain links on the light-grey (#E6E6E6) content panel: 3.96:1 -> #245C4C = 6.21:1.
   DO NOT REMOVE :not(.stylizedButton) - filled buttons on that same panel are white
   text on a #2E7D68 fill; darkening them drops the button to 1.56:1. */
div[style*="background-color:#E6E6E6" i] .gadgetContentEditableArea a:not(.stylizedButton),
div[style*="background-color:#E6E6E6" i] .gadgetContentEditableArea a:not(.stylizedButton) * {
  color: #245C4C !important;
}

/* WildApricot membership-application form (the Join page) - vendor system greys.
   #777777 = 4.48:1 and #888888 = 3.54:1 -> #6E6E6E = 5.10:1.
   Text elements only; never inputs, so member-typed text stays black. */
.formTitleContainer, .formTitleContainer div,
.mandatoryFieldsTitle, .mandatoryFieldsTitle strong,
.textLine.typeInstruction, .typeInstruction, .extraInfo,
.levelDescription, .levelRenewal, .levelRecurring {
  color: #6E6E6E !important;
}


/* ============================================================
   Top-level menu: keep all 10 items visible (2026-07-12)
   ============================================================
   WA collapses menu items it cannot fit into an unlabelled '...' overflow,
   and it always sacrifices the LAST item. With 10 top-level items the default
   padding overflows at 1200px. Trimming the horizontal padding lets all 10 fit
   down to 1200px (covers 1280/1366/1440/1512/1920).
   Menu order is deliberately: ... Resources, Members Only, Build the Helix.
   Members Only must NOT be last - it is the paid member benefit and was the
   original findability bug. Build the Helix is public and always visible to
   non-members (their menu is only 9 items), so it is the safe last item. */
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li > .item > a {
  padding-left: 11px !important;
  padding-right: 11px !important;
  letter-spacing: 0 !important;
}


/* ================= BEGIN ISONG ACCESSIBILITY PATCH ================= */
/* Added 25 July 2026. WCAG 2.1 AA contrast corrections.               */
/* To remove, delete everything between the BEGIN and END markers.     */
/* Nothing above this block was modified.                              */

/* -- Skip link (needs the companion script to be inserted) ---------- */
.isong-skip{
  position:absolute; left:-9999px; top:0; z-index:100000;
  display:inline-block; padding:.7rem 1.25rem;
  background:#0C3D33; color:#fff; text-decoration:none;
  font:600 1rem/1.2 Ubuntu,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  border-radius:0 0 4px 0;
}
.isong-skip:focus,.isong-skip:focus-visible{ left:0; outline:3px solid #A8E6D5; outline-offset:2px; }

/* -- Visible keyboard focus ---------------------------------------- */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid #17685A; outline-offset:2px;
}

/* -- Build the Helix card: white text was 2.02:1 to 2.37:1 ---------- */
/*    Same hue family, darker. Now 5.3:1 to 9.3:1.                     */
.isong-helix{
  background-image:linear-gradient(135deg,#17685A 0%,#115043 55%,#0C3D33 100%) !important;
}
.isong-helix .isong-eyebrow{ color:#FFFFFF !important; }
.isong-helix .isong-lead,.isong-helix .isong-pullquote{ color:#FFFFFF !important; }

/* -- Footer: 4.26:1 and 4.00:1, both just under 4.5:1 --------------- */
.isong-brand-tag{ color:#C9D4E2 !important; }
.isong-fb,.isong-x,.isong-bs,.isong-li,.isong-ig{ color:#A8E6D5 !important; }

/* -- Login page ----------------------------------------------------- */
/*    Theme link color #2E7D68 was inherited by the sign-in buttons:   */
/*      Google 1.38:1, Microsoft 2.70:1, Apple 4.24:1                  */
.wa-authenticateLoginButton,.wa-authenticateLoginButton *{ color:#FFFFFF !important; }

/*    Google gets its own sanctioned neutral button rather than a      */
/*    darkened blue, so there is no branding conflict. 10.5:1.         */
.googlePlus.wa-authenticateLoginButton{
  background-color:#FFFFFF !important;
  border:1px solid #DADCE0 !important;
}
.googlePlus.wa-authenticateLoginButton,.googlePlus.wa-authenticateLoginButton *{ color:#3C4043 !important; }

/*    Submit button: white on #67B8DB was 2.22:1. Brand teal is 6.6:1. */
input[type=submit].loginButton,.loginContainerForm input[type=submit]{
  background-color:#17685A !important; color:#FFFFFF !important;
}

/* ================== END ISONG ACCESSIBILITY PATCH ================== */


/* ================= BEGIN ISONG BUTTON CONTRAST ===================== */
/* Added 25 July 2026. WCAG 1.4.3.                                     */
/* Measured from what actually renders, across all 26 stylized buttons */
/* on the public site:                                                 */
/*   buttonStyle001  12 instances  #FFFFFF on #2E7D68  4.94:1  pass    */
/*   buttonStyle002  12 instances  #FFFFFF on #2E7D68  4.94:1  pass    */
/*   buttonStyle003   2 instances  #2E7D68 on #2E4C78  1.76:1  FAIL    */
/* Only 003 fails. Both instances are on the 2026 World Congress page: */
/* "Become a Sponsor Today" and "Call for Abstracts". The theme link   */
/* color is inheriting onto a navy button, the same root cause as the  */
/* sign-in buttons on the login page.                                  */
/* White on #2E4C78 gives 8.68:1. Background is left untouched.        */
/* To remove, delete everything between the BEGIN and END markers.     */
a.buttonStyle003,
a:link.buttonStyle003,
a:visited.buttonStyle003,
a.buttonStyle003:hover,
a:link.buttonStyle003:hover,
a.buttonStyle003:active,
a:link.buttonStyle003:active{ color:#FFFFFF !important; }

/* Keyboard focus for the stylized buttons. WCAG 2.4.7. */
a[class*="buttonStyle"]:focus-visible{
  outline:3px solid #17685A !important; outline-offset:3px;
}
/* ================== END ISONG BUTTON CONTRAST ====================== */

/* ===== BEGIN ISONG HOME HEADING FONT (2026-07-25c) ===== */
/* The home page "Welcome to ISONG" h1 is set in Caveat, a handwriting face,
   by an inline style block inside the home page content gadget. This overrides
   the family only, leaving the responsive sizes and the brand colour alone.
   user.css loads last, so this wins without editing the fragile gadget.
   Rollback: delete everything between these two markers. */
.isong-welcome-header h1 {
  font-family: Ubuntu, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  letter-spacing: -0.01em !important;
}
/* ===== END ISONG HOME HEADING FONT (2026-07-25c) ===== */


/* ===== BEGIN ISONG CONTRAST FIXES (2026-07-29) ===== */
/* From the site-wide contrast audit of 2026-07-29. Both rules fix WCAG 1.4.3
   failures that cannot be corrected where they are declared:
     - the menu colour lives in customStyles.css, which the Colors and styles
       screen generates, so editing it there would not survive;
     - the event labels are Wild Apricot Events gadget output and are
       unreachable from the page editor.
   Neither needs !important: user.css loads after the theme and after
   customStyles.css, so equal specificity plus later source order is enough. */

/* Dropdown submenu, current page. Was #56B9A0 on #F7F7F7 = 2.22:1 against a
   4.5:1 requirement, on 27 pages. #276A58 = 5.96:1, and is already a site
   colour: it is the middle stop of the /committees banner gradient. */
.WaGadgetMenuHorizontal .menuInner ul.secondLevel > li.sel > .item > a {
  color: #276A58;
}

/* Events gadget field labels (Start / End / Location) on /Upcoming-Events,
   /Past-Events and /register-for-webinars. Was #898989 on #F6FAFD = 3.33:1
   against 4.5:1. #6b6b6b = 5.08:1. */
/* The theme selector below is (0,3,3); a bare label.eventInfoBoxLabel is
   (0,1,1) and loses on specificity no matter how late user.css loads.
   Source order only breaks ties. Matching the theme chain and adding the
   class makes this (0,4,3) and avoids !important. */
.WaGadgetEvents .boxInfoContainer ul.boxInfo li > label.eventInfoBoxLabel {
  color: #6b6b6b;
}

/* Footer contact labels and copyright bar. Was #8a9bb2 on the footer gradient
   #2E4C78 -> #1F3556; the light stop gives 3.06:1 against a 4.5:1 requirement,
   on all 50 public pages. #b8c6d8 gives 5.00:1 on the light stop and 7.11:1 on
   the dark one.

   WHY THIS IS HERE AND NOT IN THE GADGET. The footer is a Custom HTML gadget
   duplicated across four page templates (id_F1yfIMK, id_2nXyIfb, id_VmoyRsC,
   id_eCNtrSc) and it declares #8a9bb2 in its own <style> block. On 2026-07-29
   the gadget could not be selected in the template editor after four attempts,
   and blind clicking in a template serving 75 pages was judged the greater
   risk. So the colour is overridden here instead.

   That leaves the gadget declaring a colour it does not render, which is the
   fragility the 28 July session removed from .isong-committee-card h3. It is a
   deliberate trade, not an oversight, and it is logged as an open item: when
   someone next has the template editor open, change #8a9bb2 to #b8c6d8 in all
   four gadgets and delete these two rules.

   The gadget style block sits inline in the body, so it comes AFTER user.css in
   document order. Equal specificity would lose. These selectors are therefore
   one step more specific than the gadget rules they override:
     .isong-footer .isong-contact-label            (0,2,0)  ->  (0,3,0) below
     .isong-footer-bottom                          (0,1,0)  ->  (0,2,0) below */
.isong-footer .isong-footer-inner .isong-contact-label {
  color: #b8c6d8;
}
.isong-footer .isong-footer-bottom {
  color: #b8c6d8;
}

/* --- /bod, bespoke board gadget id_x9iivxv ------------------------------ */
/* 1. Governance headings were #2E7D68 on the navy panel #2E4C78 = 1.76:1
      against a 3:1 requirement (22px/700 is large text). The gadget already
      INTENDS white here - it declares .isong-governance-block h4 { color:#fff }
      - but the headings are not inside .isong-governance-block, so that rule
      matches nothing and customStyles.css h4:not(.gadgetTitleH4) wins with brand
      teal. This restores the gadget's own intent. White on #2E4C78 = 8.67:1. */
.isong-board .isong-board-governance h4 {
  color: #ffffff;
}

/* 2. Board intro panel: white text on a gradient starting #56B9A0 = 2.37:1
      against 4.5:1 (20px/500 is normal text). #56B9A0 is the same colour removed
      from the /committees banner on 28 July for the same reason. Darkened to the
      values that banner now uses, which put white at 4.94:1 or better. */
.isong-board .isong-board-intro {
  background-image: linear-gradient(135deg, #2E7D68 0%, #276A58 55%, #1E5645 100%);
}

/* --- /bylaws-and-2030-plan, bespoke hero gadget -------------------------- */
/* #6fcdb5 (the gadget's --teal-light) on #3A6090 = 3.40:1 against 4.5:1, at
   12px/500 and 11px/500. The second element also carries opacity:0.7, which
   lowers the effective ratio further, so the opacity is neutralised here rather
   than compensated for. #C8EDE1 = 5.12:1. Only these two text uses change;
   --teal-light is left alone everywhere else (buttons, rules, gradients). */
.gadgetContentEditableArea .isong-page .hero-org {
  color: #C8EDE1;
}
.gadgetContentEditableArea .isong-page .hero-vision strong {
  color: #C8EDE1;
  opacity: 1;
}
/* ===== END ISONG CONTRAST FIXES (2026-07-29) ===== */

/* ===== BEGIN ISONG PAGE HEADER BANNERS (2026-07-31) ===== */
/* The artwork stays a background plate with its pill painted blank; the page  */
/* title sits on top as real HTML text. Replaces title-banner PNGs that had    */
/* the words baked in as pixels, which failed WCAG 1.4.5 everywhere and 1.4.3  */
/* invisibly on three pages. To remove, delete everything between the BEGIN    */
/* and END markers and restore the <img> markup in each banner gadget.         */
.isong-pagehead{
  position:relative; width:100%; max-width:1170px; margin:0 auto;
  aspect-ratio:1920/300;
  container-type:inline-size;   /* so the title scales with the box, not the viewport */
  background-size:cover; background-position:center; background-repeat:no-repeat;
  display:flex; align-items:center;
}
.isong-pagehead--teal{ background-image:url('/resources/Pictures/isong-banner-plate-teal.png'); }
.isong-pagehead--navy{ background-image:url('/resources/Pictures/isong-banner-plate-navy.png'); }

/* Specificity (0,2,1) is REQUIRED. At (0,1,0) or (0,1,1) a theme h1 rule wins and the
   title renders #2E7D68 on #32496E = 1.84:1, worse than the image it replaces. Tested.
   text-transform:none is load-bearing: the theme uppercases h1.

   Sizing is not a taste call. The banner PNG this replaces baked "Practice" at a
   52px cap height on a 1920x300 plate, which is 31.7 CSS px once the plate is
   drawn at 1170. Ubuntu Bold has a measured cap ratio of 0.785, so 40px gives
   31.4 CSS px - the original design to within a third of a pixel. The previous
   34px rendered 26.7, about 19% small, which is why the title looked lost in
   the pill. Left padding 6.7% is the source artwork's own inset (129/1920).

   The unit is cqw, not vw: the box is max-width:1170px but a vw-sized font keeps
   growing past that, so the title-to-pill ratio drifted with viewport width above
   1170 until the clamp caught it. cqw is a share of the box, which is the thing
   the title actually has to fit. */
.isong-pagehead h1.isong-pagehead__title,
.isong-pagehead div.isong-pagehead__title{
  margin:0; padding:0 2% 0 6.7%;
  display:flex; align-items:center;
  height:55%; width:72%; box-sizing:border-box;
  color:#fff; font-weight:700;
  font-size:clamp(18px,3.42cqw,40px); line-height:1.12;
  text-transform:none; text-align:left; letter-spacing:.01em;
}
.isong-pagehead h1.isong-pagehead__title--long,
.isong-pagehead div.isong-pagehead__title--long{ font-size:clamp(14px,2.41cqw,28px); }
/* ===== END ISONG PAGE HEADER BANNERS (2026-07-31) ===== */
