/* =============================================
 * Navigation Menu Readability (over hero image)
 * ============================================= */

/* Semi-transparent dark backdrop behind the header nav */
.main-header-bar,
#masthead .ast-primary-header-bar {
    background: rgba(0, 0, 0, 0.45) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

/* Bold nav link text with shadow for contrast */
#ast-hf-menu-1 .menu-link,
.main-header-menu .menu-link,
.ast-nav-menu .menu-link {
    font-family: 'Oswald', 'Oswald Fallback', Impact, 'Arial Narrow', sans-serif !important;
    font-weight: 500 !important;
    color: #ffffff !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.85), 0 0 8px rgba(0, 0, 0, 0.6) !important;
    letter-spacing: 0.04em;
}

/* Hover state - slightly brighter */
#ast-hf-menu-1 .menu-link:hover,
.main-header-menu .menu-link:hover,
.ast-nav-menu .menu-link:hover {
    color: #f0d080 !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.9), 0 0 10px rgba(0, 0, 0, 0.7) !important;
}

/* Dropdown (sub-menu) - solid dark background */
.ast-nav-menu .sub-menu,
.main-header-menu .sub-menu {
    background: rgba(20, 20, 20, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5) !important;
    border-radius: 4px !important;
}

/* Dropdown items */
.ast-nav-menu .sub-menu .menu-link,
.main-header-menu .sub-menu .menu-link {
    color: #f0f0f0 !important;
    font-weight: 600 !important;
    text-shadow: none !important;
}

.ast-nav-menu .sub-menu .menu-link:hover,
.main-header-menu .sub-menu .menu-link:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #f0d080 !important;
}

/* Donate button stays visible */
.ast-header-button-1 .menu-link,
.ast-header-button-1 a.menu-link {
    font-weight: 700 !important;
    text-shadow: none !important;
}

/* Footer — dark background for readability */
.site-footer,
.site-footer .ast-footer-overlay,
footer.site-footer,
.ast-small-footer,
.ast-small-footer .ast-footer-overlay,
.site-below-footer-wrap,
.ast-footer-copyright {
    background-color: #1a2a3a !important;
    background-image: none !important;
}

/* =============================================
 * Legacy Page Intro Styles
 * ============================================= */

/* Hide Astra page title on legacy pages — avoids duplicate headings */
.iv-legacy-page .entry-header,
.iv-legacy-page .ast-the-title {
    display: none !important;
}

/* Center legacy content in page-builder layout */
.iv-legacy-page .entry-content {
    max-width: 1200px;
    margin: 0 auto;
}

/* Intro block — exact values measured from original site */
.entry-content .legacy-content .topic-wrapper {
  margin: 0 0 45px !important;
}
.entry-content .legacy-content .topic-wrapper p {
  font-family: "Times New Roman", Georgia, Arial, sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #666666 !important;
  line-height: normal !important;
  margin: 0 !important;
  display: inline !important;
  border-bottom: 1px solid #666666 !important;
}
.entry-content .legacy-content .topic-wrapper h3 {
  font-family: "Times New Roman", Georgia, Arial, sans-serif !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  color: #000066 !important;
  line-height: normal !important;
  margin: 0 !important;
}

/* =============================================
 * Header overlap fix (2026-09-25)
 * The header is a transparent STICKY overlay (ast-theme-transparent-header +
 * sticky-header-on-devices:desktop). A translucent sticky bar lets page content
 * scroll UNDER it and show through / be obscured — "menu hides below-the-fold
 * content". Fix: keep the header ABOVE content (stacking) and make it OPAQUE
 * once stuck/scrolled so nothing renders through it. The translucent look is
 * preserved at the very top over the hero (non-sticked state untouched).
 * ============================================= */

/* Ensure the header always wins the stacking order over page content */
#masthead,
.site-header,
.ast-primary-header-bar,
.main-header-bar {
    z-index: 999 !important;
}

/* When the sticky header is active/stuck, use a solid opaque background so
   below-the-fold content passing underneath is never visible through it. */
.ast-header-sticked .main-header-bar,
.ast-header-sticked #masthead .ast-primary-header-bar,
.ast-sticky-active .main-header-bar,
.ast-sticky-active #masthead .ast-primary-header-bar,
#ast-fixed-header .main-header-bar,
#ast-fixed-header .ast-primary-header-bar {
    background: #1a2a3a !important;      /* matches footer navy, fully opaque */
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35) !important;
}

/* =============================================
 * Mobile off-canvas menu — always on TOP (2026-10-01)
 * The opened mobile/landscape menu (Astra off-canvas popup drawer) was being
 * dimmed/clipped behind other layers (sticky header, dark-theme bands). Force
 * the drawer, its overlay backdrop, and the mobile header to the very top layer
 * at EVERY breakpoint, with an opaque background so nothing shows through.
 * Astra's own fixed-header sits in the low thousands, so we go far above it.
 * ============================================= */
.ast-mobile-popup-drawer,
.ast-mobile-popup-overlay,
#ast-mobile-header,
.ast-mobile-header-wrap,
.main-header-bar-navigation .ast-mobile-popup-drawer {
    z-index: 2147483000 !important;   /* top layer, beats fixed-header + dark bands */
}

/* The drawer panel itself: opaque so content never bleeds through it.
   Theme-aware (2026-10-04): LIGHT by default (parchment), NAVY in dark mode.
   data-theme="dark" is set on <html> by theme-toggle.js; absent = light. */
.ast-mobile-popup-drawer.active .ast-mobile-popup-inner,
.ast-mobile-popup-drawer .ast-mobile-popup-inner,
#ast-mobile-header,
.ast-mobile-header-wrap {
    background: #f4efe4 !important;      /* parchment — light mode default */
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
html[data-theme="dark"] .ast-mobile-popup-drawer.active .ast-mobile-popup-inner,
html[data-theme="dark"] .ast-mobile-popup-drawer .ast-mobile-popup-inner,
html[data-theme="dark"] #ast-mobile-header,
html[data-theme="dark"] .ast-mobile-header-wrap {
    background: #1a2a3a !important;      /* deep navy — dark mode */
}

/* The dim backdrop behind the open drawer must also sit above page content. */
.ast-mobile-popup-overlay {
    background: rgba(0, 0, 0, 0.6) !important;
}

/* ---------------------------------------------
 * Inline mobile header → full-screen opaque overlay (2026-10-04)
 * This theme uses Astra's INLINE mobile header (ast-mobile-header-inline),
 * not the off-canvas popup drawer. VERIFIED live DOM: opening the hamburger
 * adds `toggle-on` to `#ast-mobile-header .main-header-bar-navigation` (and
 * `ast-main-header-nav-open` to <body>). That nav is shown IN NORMAL FLOW,
 * so a long menu ran past the viewport with no opaque backdrop — the hero/
 * page bled through and lower items were unreachable.
 *
 * Fix: when the nav is toggled on, convert it to a FIXED, full-viewport,
 * opaque, internally-scrollable overlay so every menu item is visible and
 * nothing shows through. Theme-aware background (data-theme lives on <html>).
 * --------------------------------------------- */
#ast-mobile-header .main-header-bar-navigation.toggle-on,
body.ast-main-header-nav-open #ast-mobile-header .main-header-bar-navigation {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
    z-index: 2147483000 !important;
    padding: 116px 0 48px !important;    /* clear the top bar + breathing room before first item */
    background: #f4efe4 !important;      /* parchment — light default */
}
html[data-theme="dark"] #ast-mobile-header .main-header-bar-navigation.toggle-on,
html[data-theme="dark"] body.ast-main-header-nav-open #ast-mobile-header .main-header-bar-navigation {
    background: #1a2a3a !important;      /* deep navy — dark mode */
}
/* The expanded menu content fills the overlay; transparent to show the
   overlay's own opaque background. */
#ast-mobile-header .main-header-bar-navigation.toggle-on .ast-mobile-header-content,
#ast-mobile-header .main-header-bar-navigation.toggle-on .main-header-menu {
    display: block !important;
    background: transparent !important;
}
/* Keep the page body from scrolling behind the open overlay. */
body.ast-main-header-nav-open {
    overflow: hidden !important;
}

/* The hamburger/toggle trigger stays clickable above the sticky header. */
.ast-mobile-menu-buttons,
.ast-button-wrap .menu-toggle,
.main-header-menu-toggle {
    z-index: 2147483001 !important;
    position: relative;
}

/* When the overlay menu is open, keep the mobile top bar (logo + title +
   close X) pinned on top of the overlay so it stays visible and the close
   button is reachable (the ~88px overlay top padding is reserved for it). */
body.ast-main-header-nav-open #ast-mobile-header .ast-primary-header-bar,
body.ast-main-header-nav-open #ast-mobile-header .main-header-bar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 2147483002 !important;
    background: inherit !important;
}
/* Match the top bar background to the overlay (theme-aware) so it reads as
   one surface, not a translucent strip over the menu. */
body.ast-main-header-nav-open #ast-mobile-header .ast-primary-header-bar {
    background: #f4efe4 !important;      /* parchment — light default */
}
html[data-theme="dark"] body.ast-main-header-nav-open #ast-mobile-header .ast-primary-header-bar {
    background: #1a2a3a !important;      /* deep navy — dark mode */
}
/* Top-bar brand title + close (X) carry white/over-photo styling. On the
   parchment panel (light mode) recolour them to dark ink; keep white in dark
   mode. Scoped to the OPEN mobile menu so the normal over-hero header is
   untouched. The brand text drops its over-photo text-shadow too. */
body.ast-main-header-nav-open #ast-mobile-header .iv-brandtext {
    text-shadow: none !important;
}
html:not([data-theme="dark"]) body.ast-main-header-nav-open #ast-mobile-header .iv-brandtext,
html:not([data-theme="dark"]) body.ast-main-header-nav-open #ast-mobile-header .ast-mobile-menu-buttons .ast-menu-toggle,
html:not([data-theme="dark"]) body.ast-main-header-nav-open #ast-mobile-header .menu-toggle-close,
html:not([data-theme="dark"]) body.ast-main-header-nav-open #ast-mobile-header .ast-close-svg,
html:not([data-theme="dark"]) body.ast-main-header-nav-open #ast-mobile-header .ast-mobile-svg {
    color: #1c1a15 !important;          /* dark ink on parchment */
    fill: #1c1a15 !important;           /* close/menu SVG use fill=currentColor */
    text-shadow: none !important;
}

/* The LIGHT/DARK theme pill inside the open mobile menu stretches full-width
   because Astra forces the menu-item button to fill the row. Constrain it to a
   compact pill (~130px) and give it breathing room from the row edges. */
body.ast-main-header-nav-open #ast-mobile-header .iv-theme-toggle-item {
    text-align: center !important;      /* center the inline-flex pill in its row */
}
body.ast-main-header-nav-open #ast-mobile-header .themebtn {
    width: auto !important;
    max-width: 130px !important;
    margin: 20px auto !important;       /* vertical breathing room; auto for block fallback */
    justify-content: center;
}

/* =============================================
 * Enticing buttons + visible links (2026-09-30)
 * Homepage, Contact page, and WPForms submit.
 * Filled warm-accent buttons that read as clickable on both
 * white and the light-blue (#E7F6FF) section backgrounds, plus a
 * high-contrast fix for the inline "More.." links that were
 * blue-on-blue over the #E7F6FF quote sections.
 * ============================================= */

/* --- Enticing call-to-action buttons ---
   Covers Elementor buttons ("Enter the Museum", "Read more") and the
   WPForms submit ("SUBMIT") site-wide. Solid gold-amber fill, dark navy
   text, rounded, with a hover lift so they invite a click. */
.elementor-button,
.elementor-button.elementor-size-sm,
.elementor-button.elementor-size-md,
.wpforms-submit,
.wpforms-container button[type="submit"],
.wpforms-form button[type="submit"] {
    background-color: #e8a13a !important;   /* warm amber gold */
    background-image: none !important;
    color: #1a2a3a !important;              /* deep navy text */
    border: none !important;
    border-radius: 6px !important;
    padding: 14px 34px !important;
    font-weight: 700 !important;
    letter-spacing: 0.03em !important;
    text-transform: uppercase !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.22) !important;
    transition: background-color .18s ease, transform .12s ease, box-shadow .18s ease !important;
    cursor: pointer !important;
}

.elementor-button:hover,
.elementor-button:focus,
.wpforms-submit:hover,
.wpforms-submit:focus,
.wpforms-container button[type="submit"]:hover,
.wpforms-form button[type="submit"]:hover {
    background-color: #f4b455 !important;   /* lighter amber on hover */
    color: #12202e !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28) !important;
}

/* Ensure the button label inherits the navy text (Elementor wraps text in a span) */
.elementor-button .elementor-button-text,
.elementor-button .elementor-button-content-wrapper {
    color: inherit !important;
}

/* --- Visible links on blue backgrounds ---
   The "More.." links inside .images-intro sit over the light-blue
   (#E7F6FF) quote panels and were near-invisible blue-on-blue.
   Recolor to a strong burnt-orange, bold + underlined, with a clear
   hover state so they read as links against the blue. */
.images-intro a,
.images-intro p a {
    color: #c2410c !important;              /* burnt orange, high contrast on #E7F6FF */
    font-weight: 700 !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
}

.images-intro a:hover,
.images-intro a:focus {
    color: #9a3412 !important;              /* darker on hover */
    text-decoration: underline !important;
}

/* =============================================
 * Mobile off-canvas menu — deliberate styling (2026-10-01)
 * The drawer panel is an opaque dark navy (#1a2a3a, set in the top-layer
 * block above). So menu text must be LIGHT, not navy. Cream links in the
 * site's Fraunces serif, gold accent on hover/active, no text-shadow, and
 * light-tinted chevron toggles + row dividers so the dropdown arrows and
 * item separation are visible on the dark panel. Scoped to Astra's
 * off-canvas tree so the desktop over-photo header is untouched.
 * ============================================= */
.ast-mobile-popup-drawer .menu-link,
.ast-mobile-popup-drawer .sub-menu .menu-link,
#ast-mobile-header .menu-link,
.ast-mobile-header-wrap .menu-link {
    font-family: 'Fraunces', 'Fraunces Fallback', Georgia, serif !important;
    font-weight: 600 !important;
    color: #f3ede1 !important;              /* warm cream — legible on the navy panel */
    text-shadow: none !important;           /* kill the over-photo halo */
    letter-spacing: 0 !important;
}
.ast-mobile-popup-drawer .menu-link:hover,
.ast-mobile-popup-drawer .menu-link:focus,
.ast-mobile-popup-drawer .current-menu-item > .menu-link,
#ast-mobile-header .menu-link:hover,
.ast-mobile-header-wrap .menu-link:hover {
    color: #c9a24b !important;              /* site accent gold on hover/active */
    text-shadow: none !important;
}
/* Dropdown chevron toggles: tint the arrow light so it shows on navy. */
.ast-mobile-popup-drawer .ast-menu-toggle,
.ast-mobile-popup-drawer .ast-menu-toggle::before,
#ast-mobile-header .ast-menu-toggle,
.ast-mobile-popup-drawer .menu-item .ast-header-navigation-arrow,
.ast-mobile-popup-drawer .dropdown-menu-toggle {
    color: #f3ede1 !important;
    fill: #f3ede1 !important;
    border-color: #f3ede1 !important;
}
/* Row dividers between items, subtle light hairline on the dark panel. */
.ast-mobile-popup-drawer .menu-item,
#ast-mobile-header .menu-item {
    border-bottom: 1px solid rgba(243, 237, 225, 0.12) !important;
}
/* The off-canvas submenu panel: transparent, tucked under its parent. */
.ast-mobile-popup-drawer .sub-menu,
#ast-mobile-header .sub-menu {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
.ast-mobile-popup-drawer .sub-menu .menu-link,
#ast-mobile-header .sub-menu .menu-link {
    font-weight: 400 !important;            /* child items lighter than parents */
    color: #d9cfbd !important;              /* slightly dimmer cream for hierarchy */
    padding-left: 1.5em !important;         /* indent to show hierarchy */
}

/* ---------------------------------------------
 * LIGHT-MODE drawer text (2026-10-04)
 * The block above is tuned for the navy dark-mode panel (cream text). In
 * LIGHT mode the panel is parchment, so that cream text was invisible. When
 * <html> has NO data-theme="dark" (= light), recolour links/toggles/dividers
 * to dark ink on the parchment panel. Gold hover is kept in both modes.
 * --------------------------------------------- */
html:not([data-theme="dark"]) .ast-mobile-popup-drawer .menu-link,
html:not([data-theme="dark"]) .ast-mobile-popup-drawer .sub-menu .menu-link,
html:not([data-theme="dark"]) #ast-mobile-header .menu-link,
html:not([data-theme="dark"]) .ast-mobile-header-wrap .menu-link {
    color: #1c1a15 !important;              /* near-black ink on parchment */
    text-shadow: none !important;
}
html:not([data-theme="dark"]) .ast-mobile-popup-drawer .sub-menu .menu-link,
html:not([data-theme="dark"]) #ast-mobile-header .sub-menu .menu-link {
    color: #4a4638 !important;              /* dimmer ink for child hierarchy */
}
html:not([data-theme="dark"]) .ast-mobile-popup-drawer .menu-link:hover,
html:not([data-theme="dark"]) .ast-mobile-popup-drawer .menu-link:focus,
html:not([data-theme="dark"]) .ast-mobile-popup-drawer .current-menu-item > .menu-link,
html:not([data-theme="dark"]) #ast-mobile-header .menu-link:hover {
    color: #a9801f !important;              /* darker gold reads on parchment */
}
/* Chevron toggles dark on the light panel. */
html:not([data-theme="dark"]) .ast-mobile-popup-drawer .ast-menu-toggle,
html:not([data-theme="dark"]) .ast-mobile-popup-drawer .ast-menu-toggle::before,
html:not([data-theme="dark"]) #ast-mobile-header .ast-menu-toggle,
html:not([data-theme="dark"]) .ast-mobile-popup-drawer .menu-item .ast-header-navigation-arrow,
html:not([data-theme="dark"]) .ast-mobile-popup-drawer .dropdown-menu-toggle {
    color: #1c1a15 !important;
    fill: #1c1a15 !important;
    border-color: #1c1a15 !important;
}
/* Row dividers: dark hairline on the light panel. */
html:not([data-theme="dark"]) .ast-mobile-popup-drawer .menu-item,
html:not([data-theme="dark"]) #ast-mobile-header .menu-item {
    border-bottom: 1px solid rgba(28, 26, 21, 0.14) !important;
}

/* =============================================
 * Parent menu items with children do not navigate (2026-10-01)
 * "For Institutions" is a heading for its submenu, not a page. Its anchor is
 * href="#"; make it non-navigating (the chevron toggle still expands the
 * submenu). Applies desktop + mobile.
 * ============================================= */
.menu-item-has-children > a[href="#"],
.menu-item-has-children > a.menu-link[href="#"] {
    cursor: default !important;
}

/* =============================================
 * Header Donate button — no mid-word wrap (2026-10-01)
 * The compact header button was wrapping "DONATE" to "DONA/TE".
 * ============================================= */
.ast-header-button-1 .menu-link,
.ast-header-button-1 a.menu-link,
.main-header-bar .ast-button {
    white-space: nowrap !important;
}

/* =============================================
 * Header brand lockup (2026-10-01)
 * "Aliyah Bet & Machal" (Fraunces) sits beside the logo, vertically centered.
 * Desktop: nav links drop UNDER the brand text — the primary bar becomes a
 * column (row 1 = logo + brand text, row 2 = nav indented under the text).
 * ============================================= */

/* Brand text beside the logo (all breakpoints), vertically centered. */
.site-branding.ast-site-identity{display:flex;align-items:center;}
.iv-brandtext{
  font-family:'Oswald','Oswald Fallback',Impact,'Arial Narrow',sans-serif;
  font-weight:600;
  font-size:28px;
  letter-spacing:0.02em;
  line-height:1.05;
  /* White on every page: the header bar is dark/semi-transparent sitewide and
     the primary nav links are already white, so the wordmark matches them.
     Shadow mirrors the nav-link treatment for contrast over the gray/photo bar. */
  color:#fff !important;
  text-shadow:0 1px 4px rgba(0,0,0,.85), 0 0 8px rgba(0,0,0,.6) !important;
  margin-left:16px;
  align-self:center;
  white-space:nowrap;
}
/* Over the homepage photo header the wordmark keeps a slightly softer shadow. */
.iv-front .iv-brandtext{color:#fff !important;text-shadow:0 1px 6px rgba(0,0,0,.55) !important;}

/* Brand wordmark is a home link: pointer cursor, but it inherits the
   .iv-brandtext font/color and shows NO hover/focus/visited color or
   underline change (the wordmark must look identical before/after click). */
.iv-brandlink,
.iv-brandlink:link,
.iv-brandlink:visited,
.iv-brandlink:hover,
.iv-brandlink:focus,
.iv-brandlink:active{
  color:inherit !important;
  text-decoration:none !important;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
}

/* Desktop (>=922px) — LAYOUT A: the nav is moved (via JS) into the left
   branding section; lay that section out as [logo | brand text], with the nav
   on a full-width row beneath, left-aligned under the brand text. */
@media (min-width:922px){
  #ast-desktop-header .site-header-primary-section-left.iv-brand-stack{
    display:grid;
    grid-template-columns:auto 1fr;
    align-items:center;
    column-gap:16px;row-gap:4px;
    flex:1 1 auto;min-width:0;
  }
  /* Logo cell spans both rows, vertically centered against the stack. */
  #ast-desktop-header .iv-brand-stack .site-branding{grid-row:1 / span 2;align-self:center;}
  #ast-desktop-header .iv-brand-stack .iv-brandtext{grid-column:2;grid-row:1;margin-left:0;}
  /* Nav row: under the brand text (column 2), left-aligned. */
  #ast-desktop-header .iv-brand-stack #primary-site-navigation-desktop{
    grid-column:2;grid-row:2;width:100%;
  }
  #ast-desktop-header .iv-brand-stack .main-header-menu{justify-content:flex-start;}
  #ast-desktop-header .iv-brand-stack .main-header-menu > .menu-item:first-child > .menu-link{padding-left:0;}
  /* Tame the stacked nav row: compact height, single line, tight item spacing. */
  #ast-desktop-header .iv-brand-stack #primary-site-navigation-desktop .main-header-menu{flex-wrap:nowrap;}
  #ast-desktop-header .iv-brand-stack .main-header-menu > .menu-item{line-height:1.2 !important;}
  #ast-desktop-header .iv-brand-stack .main-header-menu > .menu-item > .menu-link{
    line-height:1.2 !important;padding-top:4px;padding-bottom:4px;padding-right:22px;height:auto;
  }
  #ast-desktop-header .iv-brand-stack #primary-site-navigation-desktop{margin-top:2px;}
  #ast-desktop-header .iv-brand-stack .main-header-menu > .menu-item > .menu-link{white-space:nowrap;}
  #ast-desktop-header .iv-brand-stack .main-header-menu .menu-item{width:auto;}
  #themebtn,#ast-desktop-header #themebtn{white-space:nowrap;}
  /* Let the left section (logo+brand+nav) take only the space it needs so the
     right section sits beside it on row 1 without wrapping. */
  #ast-desktop-header .site-primary-header-wrap{display:flex;align-items:center;flex-wrap:nowrap;}
  #ast-desktop-header .site-header-primary-section-right{align-items:center;}
  /* Keep DARK + DONATE fully on-screen at the top-right: size to content,
     never shrink or clip. */
  #ast-desktop-header .site-header-primary-section-right{flex:0 0 auto;max-width:none;overflow:visible;}
  #ast-desktop-header .ast-header-button-1{margin-right:0;}
  #ast-desktop-header .ast-custom-button-link{white-space:nowrap;}
}

/* Smaller brand text on narrow desktops to avoid crowding. */
@media (min-width:922px) and (max-width:1100px){
  .iv-brandtext{font-size:24px;}
}

/* Shrink the brand text on narrow screens so it fits beside the logo. */
@media (max-width:921px){
  .iv-brandtext{font-size:22px;margin-left:12px;}
}
@media (max-width:600px){
  .iv-brandtext{font-size:18px;margin-left:10px;}
}
@media (max-width:420px){
  .iv-brandtext{font-size:15px;margin-left:8px;white-space:normal;line-height:1.05;}
}

/* DONATE header button: never wrap mid-word (2026-10-01). */
.ast-custom-button-link,.ast-header-button-1 .ast-custom-button-link,
.ast-builder-button-wrap .ast-custom-button-link,.ast-header-button-1 a{white-space:nowrap !important;}


/* =============================================================
 * Vertically center the desktop header: brand + nav on ONE row,
 * centered against the tall AVILC crest (2026-10-01).
 * Overrides the earlier 2-row brand-over-nav stack so the logo,
 * brand text, and nav links all share one vertically-centered line.
 * ============================================================= */
@media (min-width:922px){
  #ast-desktop-header .site-header-primary-section-left.iv-brand-stack{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    column-gap:20px;
    flex-wrap:nowrap;
  }
  /* Reset the grid cell placements from the stacked layout. */
  #ast-desktop-header .iv-brand-stack .site-branding,
  #ast-desktop-header .iv-brand-stack .iv-brandtext,
  #ast-desktop-header .iv-brand-stack #primary-site-navigation-desktop{
    grid-row:auto !important;grid-column:auto !important;
    align-self:center !important;
  }
  #ast-desktop-header .iv-brand-stack #primary-site-navigation-desktop{
    width:auto !important;margin-top:0 !important;
  }
}

/* =============================================================
 * Theme toggle button (2026-10-01): the pill shows the CURRENT
 * theme. Dark mode -> dark background + light text + crescent moon;
 * Light mode -> light background + dark text + sun. Colours key off
 * data-mode (set by theme-toggle.js) so they are fixed to the
 * current theme, not inherited from surrounding --tokens.
 * ============================================================= */
.themebtn{
  display:inline-flex !important;
  align-items:center;
  gap:7px;
  margin-left:16px;
  cursor:pointer;
  border-radius:999px;
  padding:6px 14px;
  font-size:11px;
  font-weight:700;
  letter-spacing:1px;
  text-transform:uppercase;
  line-height:1;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  text-shadow:none !important;
  transition:background .15s ease,color .15s ease,border-color .15s ease;
}
.themebtn .themebtn-ico{display:inline-block;flex:0 0 auto;width:13px;height:13px;vertical-align:middle;}
/* LIGHT mode active -> light pill, dark text, sun. */
.themebtn[data-mode="light"]{
  background:#f4efe4 !important;   /* parchment */
  color:#1c1a15 !important;        /* near-black */
  border:1px solid #d8cdb4 !important;
}
.themebtn[data-mode="light"]:hover{background:#fff !important;}
/* DARK mode active -> dark pill, light text, moon. */
.themebtn[data-mode="dark"]{
  background:#141c28 !important;   /* deep navy */
  color:#eef1f6 !important;        /* cool off-white */
  border:1px solid #2b3749 !important;
}
.themebtn[data-mode="dark"]:hover{background:#1d2735 !important;}

/* =============================================================
 * Oswald on the "chrome" layer (2026-10-02): CTA buttons, small
 * uppercase eyebrow/label text, and the newsletter card season/year
 * headings. Pairs with the Oswald brand wordmark + nav. Body copy
 * and editorial (Fraunces) headings are intentionally left alone.
 * ============================================================= */
/* CTA buttons (already uppercase + tracked; just the typeface) */
.elementor-button,
.elementor-button .elementor-button-text,
.wpforms-submit,
.wpforms-container button[type="submit"],
.wpforms-form button[type="submit"] {
    font-family: 'Oswald', 'Oswald Fallback', Impact, 'Arial Narrow', sans-serif !important;
    letter-spacing: 0.05em !important;
}
/* Eyebrow / section-label text across the homepage + intro bands */
.iv-intro .k,
.iv-heroA .k,
.iv-ledger .lbl,
.iv-dep .lbl,
.iv-featured .fk,
.iv-featured .more,
.iv-quicklinks .lbl,
.iv-topic .teaser .tk,
.iv-topic .teaser .cta,
.iv-topic .foot .secondary {
    font-family: 'Oswald', 'Oswald Fallback', Impact, 'Arial Narrow', sans-serif !important;
}
/* Newsletter cards (page 643): season/year headings render as
   Elementor headings; Oswald matches the Events card titles. */
.page-id-643 .elementor-widget-heading .elementor-heading-title {
    font-family: 'Oswald', 'Oswald Fallback', Impact, 'Arial Narrow', sans-serif !important;
}