/*
Theme Name:  acsdoc26
Theme URI:   https://github.com/drjoeward/acsd
Description: ACS Organic Division WordPress theme. WCAG 2.1 AA compliant. Bootstrap 5 via CDN. No build tools.
Version:     4.0.0
Author:      Joseph Ward
Author URI:  https://github.com/drjoeward
License:     MIT License
License URI: http://opensource.org/licenses/MIT
Text Domain: acsdoc26
*/

/* =============================================================================
   BASE RESETS & ACCESSIBILITY
   ============================================================================= */

/* Skip-to-content link for keyboard users */
.skip-link {
    position: absolute;
    top: -100%;
    left: 0;
    background: #000;
    color: #fff;
    padding: 0.75rem 1.25rem;
    font-size: 1rem;
    font-weight: 600;
    z-index: 9999;
    text-decoration: none;
    transition: top 0.1s;
}
.skip-link:focus {
    top: 0;
}

/* Ensure focus is always visible (WCAG 2.4.7) */
*:focus-visible {
    outline: 3px solid #0056b3;
    outline-offset: 2px;
}

/* =============================================================================
   TYPOGRAPHY & BODY
   ============================================================================= */

body {
    font-family: 'Metropolis', 'Helvetica Neue', Arial, sans-serif;
    font-size: 0.9375rem; /* 15px — rem for WCAG 1.4.4 */
    line-height: 1.6;
    color: #212529;
    background-color: #fff;
}

/* =============================================================================
   LAYOUT
   ============================================================================= */

.site-main {
    min-height: 50vh;
    padding-top: 1.5rem;
    padding-bottom: 2rem;
}

/* =============================================================================
   NAVIGATION
   ============================================================================= */

/* megamenu-pro output inherits Bootstrap 5 navbar — keep selector specificity low */
.navbar {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

/* Active menu item indicator */
.nav-item.active-current-item > .nav-link,
.nav-item.current-menu-item > .nav-link {
    font-weight: 600;
}

/* =============================================================================
   SIDEBAR
   ============================================================================= */

.sidebar .widget {
    margin-bottom: 2rem;
}

.sidebar .widget h3,
.sidebar .widget h4 {
    font-size: 1.1rem;
    font-weight: 600;
    border-bottom: 2px solid #dee2e6;
    padding-bottom: 0.4rem;
    margin-bottom: 1rem;
}

/* =============================================================================
   ENTRIES / POSTS
   ============================================================================= */

.entry-title a {
    color: inherit;
    text-decoration: none;
}
.entry-title a:hover {
    text-decoration: underline;
}

.entry-meta {
    font-size: 0.875rem;
    color: #6c757d;
    margin-bottom: 0.75rem;
}

/* =============================================================================
   BUTTONS
   ============================================================================= */

/* Legacy alias — old content used class="alt-button"; DB migrated to btn btn-primary (2026-03-21) */
.alt-button {
    display: inline-block;
    padding: .375rem .75rem;
    font-weight: 700;
    text-align: center;
    text-decoration: none !important;
    background-color: #ba0000;
    border: 2px solid #ba0000;
    color: #fff !important;
    border-radius: .25rem;
    transition: background-color .15s ease-in-out, border-color .15s ease-in-out;
}
.alt-button:hover,
.alt-button:focus {
    background-color: #8f0000;
    border-color: #8f0000;
    color: #fff !important;
}

/* =============================================================================
   SIDEBAR BLOCK (TinyMCE custom style)
   ============================================================================= */

.sidebar-block {
    background-color: #f8f9fa;
    border-left: 4px solid #0056b3;
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
}

/* =============================================================================
   SEARCH FORM
   ============================================================================= */

.search-form {
    display: flex;
    gap: 0.5rem;
}

.search-form .search-field {
    flex: 1;
}

/* =============================================================================
   PAGINATION
   ============================================================================= */

.acsdoc-pagination {
    margin: 2rem 0;
}

.acsdoc-pagination .pager {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    list-style: none;
    padding: 0;
    margin: 0;
}

.acsdoc-pagination .pager li a,
.acsdoc-pagination .pager li span {
    display: block;
    padding: 0.375rem 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    color: #0056b3;
    text-decoration: none;
    background-color: #fff;
}

.acsdoc-pagination .pager li.active span {
    background-color: #0056b3;
    border-color: #0056b3;
    color: #fff;
}

.acsdoc-pagination .pager li a:hover {
    background-color: #e9ecef;
}

/* =============================================================================
   FOOTER
   ============================================================================= */

.site-footer {
    margin-top: 3rem;
    font-size: 0.9rem;
}

/* Footer top band — blue bg, white text, social icons */
.acsdoc-footer__top {
    background-color: #3a6486;
    color: #fff;
    padding: 12px 0;
}

/* Social icon links */
.footer-social a {
    display: inline-block;
    margin: 0 0.4rem;
    font-size: 1.5rem;
    color: #fff;
    text-decoration: none;
    transition: color 0.15s;
}

.footer-social a:hover {
    color: rgba(255, 255, 255, 0.75);
}

.social-title {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
}

/* Footer bottom band — white bg, logos + copyright */
.acsdoc-footer__bottom {
    background-color: #fff;
    color: #333333;
    border-top: 1px solid #dee2e6;
    font-size: 0.85rem;
}

.acsdoc-footer__bottom a {
    color: #333333;
    text-decoration: none;
}

.acsdoc-footer__bottom a:hover {
    color: #ba0000;
    text-decoration: underline;
}

/* Footer logo images */
.acsdoc-footer__bottom img,
.footer-logo {
    max-height: 130px;
    width: auto;
}

/* Privacy/footer nav — pipe-separated inline list */
.acsdoc-nav__footer-admin {
    list-style: none;
    padding: 0;
    margin: 0.25rem 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0;
}

.acsdoc-nav__footer-admin li {
    display: flex;
    align-items: center;
}

.acsdoc-nav__footer-admin li + li::before {
    content: '|';
    margin: 0 0.4rem;
    color: #767676; /* was #999 — minimum 4.5:1 on white (WCAG 1.4.3) */
}

.site-footer .widget h4 {
    color: #fff;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 1rem;
}

/* =============================================================================
   WORDPRESS CONTENT — image alignment, captions, galleries
   Bootstrap 5 doesn't ship WP-compat styles so we handle them here.
   ============================================================================= */

/* All editor-inserted images must be responsive.
   max-width on .wp-caption uses !important because WordPress outputs
   style="width:Xpx" (the original file dimensions) as an inline attribute
   which would otherwise override the class rule and cause overflow.        */
.main-content img,
.entry-content img,
.wp-caption img {
    max-width: 100%;
    height: auto;
}

.wp-caption {
    max-width: 100% !important; /* beats inline style="width:2560px" etc. */
    margin-bottom: 1rem;
    text-align: center;
}

.wp-caption-text,
.wp-caption figcaption {
    font-size: 0.8rem;
    color: #6c757d;
    text-align: center;
    padding-top: 0.25rem;
}

/* Standard alignment classes */
.alignleft,
img.alignleft,
figure.alignleft,
.wp-caption.alignleft {
    float: left;
    margin: 0 1.5rem 1rem 0;
    max-width: 50%; /* prevent floats from dominating the column */
}

.alignright,
img.alignright,
figure.alignright,
.wp-caption.alignright {
    float: right;
    margin: 0 0 1rem 1.5rem;
    max-width: 50%;
}

.aligncenter,
img.aligncenter,
figure.aligncenter,
.wp-caption.aligncenter {
    display: block;
    float: none;
    margin: 0 auto 1rem;
    text-align: center;
}

.alignnone { float: none; }

/* Inline-styled floated divs (legacy editor content: style="float:right;width:Xpx") */
.main-content div[style*="float"] {
    max-width: 100%;
}

/* Responsive: un-float images and captions on small screens */
@media (max-width: 767px) {
    .alignleft,
    .alignright,
    img.alignleft,
    img.alignright,
    figure.alignleft,
    figure.alignright,
    .wp-caption.alignleft,
    .wp-caption.alignright {
        float: none !important;
        max-width: 100%;
        margin: 0 auto 1rem;
        display: block;
    }

    /* Inline-styled float divs: remove float and hard-coded width on mobile */
    .main-content div[style*="float: right"],
    .main-content div[style*="float:right"],
    .main-content div[style*="float: left"],
    .main-content div[style*="float:left"] {
        float: none !important;
        width: auto !important;
        max-width: 100% !important;
        margin: 0 0 1rem !important;
    }
}

/* WordPress galleries (classic editor shortcode output) */
.gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 1rem 0;
}
.gallery-item {
    flex: 1 1 150px;
    text-align: center;
    overflow: hidden;
}
.gallery-item img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
}
.gallery-caption {
    font-size: 0.75rem;
    color: #666;
    margin-top: 0.25rem;
}

/* =============================================================================
   METROPOLIS FONT FACE (loaded from /metropolis-font/)
   ============================================================================= */

@import url('metropolis-font/regular.css');
@import url('metropolis-font/medium.css');
@import url('metropolis-font/bold.css');
@import url('metropolis-font/light.css');

/* =============================================================================
   PHASE 3: BRAND COLORS & SITE-SPECIFIC STYLES
   Ported from assets/styles/sass/ source files.
   Bootstrap 5 loads from CDN. This file handles all site-specific overrides.
   Brand: red #ba0000 | blue #3a6486 | dark gray #333333 | bg #eaf0f5
   ============================================================================= */

/* --- Container ---------------------------------------------------------------- */

/* Match old theme's 90% / 1400px constraint inside Bootstrap's container-fluid */
.container-fluid {
    max-width: 1400px;
    width: 90%;
    margin-right: auto;
    margin-left: auto;
}

/* --- Global Typography -------------------------------------------------------- */

a {
    color: #ba0000;
}

a:hover,
a:focus {
    color: #3a6486;
}

h1, h2, h5 {
    color: #3a6486;
}

h3, h4 {
    color: #333333;
}

h6 {
    color: #333333;
}

/* --- Site Header -------------------------------------------------------------- */

#acsdoc-header {
    background-color: #fff;
    border-top: 5px solid #ba0000;
    position: relative;    /* logo uses position:absolute against this */
    min-height: 130px;
    z-index: 100;
    transition: all 0.6s ease-in-out;
}

/* Container-fluid is the positioning parent for the absolute logo */
#acsdoc-header .container-fluid {
    position: relative;
}

/* Logo: absolutely positioned at the left edge of the container (not the viewport) */
#acsdoc-header .acsdoc-logo-wrap {
    position: absolute;
    top: 10px;
    left: 0;
    z-index: 10;
}

#acsdoc-header .acsdoc-logo-wrap .acsdoc-logo {
    display: inline-block;
    margin: 15px 0 0 10px;
}

#acsdoc-header .acsdoc-logo img.main-logo {
    max-width: 140px;
    width: auto;
    height: auto;
    display: block;
}

/* Secondary (white) logo: hidden until .shrink */
#acsdoc-header .acsdoc-logo img.secondary-logo {
    display: none;
}

/* Nav wrap: full-width inline-block — megamenu #{$wrap} floats right inside */
#acsdoc-header .acsdoc-nav__action-wrap {
    display: inline-block;
    width: 100%;
}

/* Search + action buttons: float right, above the megamenu row */
#acsdoc-header .acsdoc-nav__action-right {
    float: right;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding-top: 10px;
}

/* Search field sizing */
#acsdoc-header .utility-bar .search-form {
    min-width: 180px;
}

/* Action nav items are red buttons (EC MEMBER / LOGOUT / JOIN / LOGIN) */
.acsdoc-nav__action ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.acsdoc-nav__action ul li a {
    display: inline-block;
    background: #ba0000;
    color: #fff !important;
    border: 2px solid #ba0000;
    padding: 10px 16px;
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none !important;
    line-height: 1;
    transition: background 0.2s ease, color 0.2s ease;
    white-space: nowrap;
}

.acsdoc-nav__action ul li a:hover,
.acsdoc-nav__action ul li a:focus {
    background: #fff;
    color: #ba0000 !important;
    border-color: #ba0000;
}

/* Sticky/shrink: JS adds .shrink to #acsdoc-header on scroll past 50px (desktop only) */
#acsdoc-header.shrink {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    min-height: 72px;
    background-color: #ba0000;
    border-top: none;
    box-shadow: 0 2px 6px rgba(0,0,0,0.3);
    z-index: 1000;
}

/* Admin bar pushes fixed header down 32px (46px on small screens) */
body.admin-bar #acsdoc-header.shrink {
    top: 32px;
}

@media screen and (max-width: 782px) {
    body.admin-bar #acsdoc-header.shrink {
        top: 46px;
    }
}

#acsdoc-header.shrink .acsdoc-logo-wrap {
    top: 0;
    left: 5px;
}

#acsdoc-header.shrink .acsdoc-logo-wrap .acsdoc-logo {
    margin: 0;
}

#acsdoc-header.shrink .acsdoc-logo-wrap .acsdoc-logo img.main-logo {
    max-width: 115px;
    max-height: 60px;
    width: auto;
    height: auto;
}

#acsdoc-header.shrink .acsdoc-logo-wrap .acsdoc-logo img.primary-logo {
    display: none;
}

#acsdoc-header.shrink .acsdoc-logo-wrap .acsdoc-logo img.secondary-logo {
    display: block;
    max-width: 115px;
    max-height: 60px;
    width: auto;
    height: auto;
}

#acsdoc-header.shrink .acsdoc-nav__action-right {
    display: none; /* hide search+buttons when shrunk */
}

/* Push content down when header is sticky (JS sets exact px value) */
body.header-shrunk {
    padding-top: 130px; /* fallback; JS overrides with measured value */
}

/* --- Primary Nav Megamenu (compiled from plugin Custom Styling SCSS) ----------- */
/*
 * Source SCSS used #{$wrap} = #mega-menu-wrap-primary_navigation
 *                  #{$menu} = #mega-menu-primary_navigation
 *                  @include desktop = min-width 992px
 *                  @include mobile  = max-width 991px
 * Once confirmed working, clear the plugin's "Custom Styling" box to avoid conflicts.
 */

@media (min-width: 992px) {
    /* Push primary nav to the right, leaving room for the absolutely-positioned logo */
    #mega-menu-wrap-primary_navigation {
        width: calc(100% - 200px);
        clear: both;
        float: right;
        margin-top: 15px;
    }

    /* Sticky header: red background on the nav bar */
    #acsdoc-header.shrink #mega-menu-wrap-primary_navigation #mega-menu-primary_navigation {
        background: #ba0000;
        clear: both;
        float: right;
        margin-top: 15px;
    }

    /* Sticky header: white text on nav items */
    #acsdoc-header.shrink #mega-menu-primary_navigation > li.mega-menu-item > a.mega-menu-link {
        color: #fff;
    }
}

@media (max-width: 991px) {
    /* Mobile header: logo lives in the mobile hero below, not the header */
    #acsdoc-header .acsdoc-logo-wrap {
        display: none;
    }

    /* Compact header — just hamburger + utility row */
    #acsdoc-header {
        min-height: 70px;
    }

    /* No logo → no left padding needed */
    #acsdoc-header .acsdoc-nav__action-wrap {
        padding-left: 0;
    }

    /* Hamburger: float right, centred vertically in its row */
    #mega-menu-wrap-primary_navigation {
        float: right;
        padding-top: 12px;
    }

    /* Utility links: full-width row, right-aligned, below the hamburger */
    #acsdoc-header .acsdoc-nav__action-right {
        float: none;
        clear: both;
        display: flex;
        justify-content: flex-end;
        align-items: center;
        padding: 4px 0 6px;
        border-top: 1px solid rgba(186, 0, 0, 0.15);
    }

    /* Hide search on mobile */
    #acsdoc-header .utility-bar {
        display: none;
    }

    /* WCAG touch targets: min 44px height, comfortable padding */
    .acsdoc-nav__action ul li a {
        padding: 10px 16px;
        font-size: 0.8rem;
        min-height: 44px;
        display: flex;
        align-items: center;
    }

    /* Slider is replaced by the mobile logo hero — hide it on mobile */
    #acsdoc-home-slider-section {
        display: none;
    }
}

/* ── Mobile logo hero (front-page only, hidden on desktop via d-lg-none) ─────── */
.acsdoc-mobile-hero {
    background: #fff;
    text-align: center;
    padding: 24px 20px 16px;
    border-bottom: 3px solid #ba0000;
}

.acsdoc-mobile-hero__logo {
    max-width: 220px;
    width: 80%;
    height: auto;
    display: block;
    margin: 0 auto;
}

.acsdoc-mobile-hero__tagline {
    color: #444;
    font-size: 0.9rem;
    margin: 10px 0 0;
    line-height: 1.4;
}

/* --- Sidebar Megamenu (accordion mode) ---------------------------------------- */

/* Ensure the sidebar megamenu renders as a block (vertical accordion) */
#mega-menu-wrap-sidebar_navigation {
    display: block !important;
    width: 100% !important;
    float: none !important;
    clear: both;
    margin-top: 0 !important;
}

#mega-menu-sidebar_navigation {
    display: block !important;
    width: 100% !important;
}

#mega-menu-sidebar_navigation > li.mega-menu-item {
    display: block !important;
    float: none !important;
    width: 100% !important;
}

/* Third-level indent from megamenu custom CSS */
#mega-menu-wrap-sidebar_navigation #mega-menu-sidebar_navigation.mega-menu-accordion > li.mega-menu-flyout > ul.mega-sub-menu li.mega-menu-item ul.mega-sub-menu li.mega-menu-item ul.mega-sub-menu a.mega-menu-link {
    padding-left: 40px;
}

/* --- Miscellaneous site-specific overrides --------------------------------- */

/* Anchor offset for sticky header */
a.anchor {
    display: block;
    position: relative;
    top: -115px;
    visibility: hidden;
}

/* Event date no-wrap */
#acsdoc-widgets-section .home-widget .acsdoc-event-widget .acsdoc-date span {
    white-space: nowrap;
}

/* Footer bucket alignment — right-aligned on desktop (last column) */
#acsdoc-footer .acsdoc-footer__bottom .footer-bucket,
.acsdoc-footer__bottom .footer-bucket {
    text-align: right;
}

@media (max-width: 575.98px) {
    .acsdoc-footer__bottom .footer-bucket {
        text-align: center;
    }
    .acsdoc-nav__footer-admin {
        justify-content: center;
    }

    /* Extra-small phones: slightly smaller mobile hero logo */
    .acsdoc-mobile-hero__logo {
        max-width: 170px;
    }
}

/* Shrink the "Website by" attribution line so it stays on one line */
.footer-bucket .privacy p:last-child {
    font-size: 0.75rem;
}

/* Content links should not be bold */
.main-content a {
    font-weight: normal;
}

/* Gravity Forms font fixes */
.gfield_description {
    font-size: 100%;
}
.gform_wrapper form .gform_body input,
.gform_wrapper form .gform_body textarea,
.gform_wrapper form .gform_body select {
    font-weight: normal;
}

/* Search results */
.acsdoc-search__result article {
    padding-bottom: 17px;
    margin-top: 17px;
}

.acsdoc-search__result .btn-primary {
    background: none;
    color: #ba0000;
    border: none;
}

.acsdoc-search__result .btn-primary:hover {
    background: none;
    color: #ba0000;
    border: none;
}

/* Video post category */
article.category-histvid .entry-title {
    display: none;
}

div.acsdoc-post-video__wrap {
    margin-bottom: 7px;
    padding-bottom: 7px;
    border-bottom: 1px solid #eee;
}

/* Faculty list */
ul.faclist {
    font-size: larger;
}

/* Home section padding */
#acsdoc-info-section,
#acsdoc-home-news-section,
#acsdoc-widgets-section {
    padding-top: 15px;
    padding-bottom: 15px;
}

/* Caption callout links */
a.acsdoc-caption-callout {
    color: white;
}
a.acsdoc-caption-callout:hover {
    color: #ba0000;
}

/* Upcoming events */
ul.upcoming-events {
    list-style-type: none;
    width: 100%;
}

/* Footer social FA icons */
.acsdoc-footer__top .fa,
.acsdoc-footer__top .fab,
.acsdoc-footer__top .fas,
.footer-social .fa,
.footer-social .fab,
.footer-social .fas {
    padding: 5px;
    font-size: 1.35rem;
    color: white;
}

.acsdoc-footer__top .fa:hover,
.acsdoc-footer__top .fab:hover,
.acsdoc-footer__top .fas:hover,
.footer-social .fa:hover,
.footer-social .fab:hover,
.footer-social .fas:hover {
    color: #3a6486;
    background: white;
    opacity: 0.7;
}

/* My Calendar plugin */
.mc-event-list-container {
    width: 100%;
}

/* News title min-height (md+) */
@media (min-width: 768px) {
    #acsdoc-home-news-section .acsdoc-news-title {
        min-height: 48px;
    }
}

/* --- Pages Header / Banner (#acsdoc-banner) --------------------------------------- */

#acsdoc-banner {
    position: relative;
    overflow: hidden;
    background-color: #3a6486;
    height: 200px;
}

@media (min-width: 576px) {
    #acsdoc-banner { height: 300px; }
}

@media (min-width: 768px) {
    #acsdoc-banner { height: 400px; }
}

/* Banner with background image */
#acsdoc-banner.img-bg {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

/* Banner with inline image (Image type) */
#acsdoc-banner .acsdoc-banner__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Wrap fills the banner and positions caption */
#acsdoc-banner .acsdoc-banner__wrap {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: flex-end;
}

/* Caption outer container */
.acsdoc-caption-outer {
    width: 100%;
}

/* Caption: full-width red overlay at bottom */
.acsdoc-caption {
    background-color: rgba(186, 0, 0, 0.78);
    color: #fff;
    padding: 10px 20px;
}

.acsdoc-caption.acsdoc-caption__left  { text-align: left; }
.acsdoc-caption.acsdoc-caption__right { text-align: right; }
.acsdoc-caption.acsdoc-caption__center { text-align: center; }

.acsdoc-caption h1,
.acsdoc-caption h2 {
    color: #fff;
    margin: 0;
    font-size: 1.4rem;
}

@media (min-width: 768px) {
    .acsdoc-caption h1,
    .acsdoc-caption h2 {
        font-size: 1.9rem;
    }
}

/* Color-bg variant: solid brand-2 blue, no image */
#acsdoc-banner.color-bg {
    background-color: #3a6486;
}

/* --- Inner Page Layout -------------------------------------------------------- */

/* Main content + sidebar wrapper */
#acsdoc-main {
    padding-top: 1.5rem;
    padding-bottom: 2rem;
}

/* Clearfix: floated images inside content must not bleed outside the container */
.content-primary::after {
    content: "";
    display: table;
    clear: both;
}

/* Content column — sidebar is on LEFT so border goes on the left */
.main-content.with-sidebar {
    border-left: 5px solid #eaf0f5;
    padding-left: 25px;
}

@media (max-width: 991.98px) {
    .main-content.with-sidebar {
        border-left: none;
        padding-left: 0;
        border-top: 5px solid #eaf0f5;
        padding-top: 1.5rem;
    }
}

/* Sidebar */
.acsdoc-aside {
    padding-right: 1rem;
}

@media (max-width: 991.98px) {
    .acsdoc-aside {
        padding-right: 0;
        border-top: 1px solid #dee2e6;
        padding-top: 1.5rem;
        margin-top: 1.5rem;
    }
}

.inner-sidebar {
    padding: 0 10px;
}

/* Sidebar navigation: only show current-menu-item children */
.acsdoc-aside .widget_nav_menu ul ul {
    display: none;
}

.acsdoc-aside .widget_nav_menu .current-menu-item > ul,
.acsdoc-aside .widget_nav_menu .current-menu-ancestor > ul {
    display: block;
}

.acsdoc-aside .widget_nav_menu a {
    color: #3a6486;
    text-decoration: none;
    display: block;
    padding: 3px 0;
    font-size: 0.9rem;
}

.acsdoc-aside .widget_nav_menu a:hover {
    color: #ba0000;
    text-decoration: underline;
}

.acsdoc-aside .widget_nav_menu .current-menu-item > a {
    font-weight: 600;
    color: #ba0000;
}

/* --- Blog / Post List --------------------------------------------------------- */

.post-row .entry-title a {
    color: #3a6486;
}

.post-row .entry-title a:hover {
    color: #ba0000;
    text-decoration: underline;
}

.post-row article {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #dee2e6;
}

.post-row article:last-child {
    border-bottom: none;
}

/* --- Pagination (brand colors) ------------------------------------------------ */

.acsdoc-pagination .pager li a {
    color: #3a6486;
}

.acsdoc-pagination .pager li.active span {
    background-color: #ba0000;
    border-color: #ba0000;
}

/* --- Sidebar Block (brand accent) --------------------------------------------- */

.sidebar-block {
    border-left-color: #3a6486;
}

/* --- Buttons (brand) ---------------------------------------------------------- */

.btn-primary {
    background-color: #ba0000;
    border-color: #ba0000;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #8f0000;
    border-color: #8f0000;
}

.btn-secondary {
    background-color: #3a6486;
    border-color: #3a6486;
}

.btn-secondary:hover,
.btn-secondary:focus {
    background-color: #2e5070;
    border-color: #2e5070;
}

/* --- Gravity Forms overrides -------------------------------------------------- */

.gform_wrapper .gform_title {
    color: #3a6486;
}

.gform_wrapper .gform_submit input[type="submit"],
.gform_wrapper input[type="submit"] {
    background-color: #ba0000 !important;
    border-color: #ba0000 !important;
    color: #fff !important;
}

.gform_wrapper input[type="submit"]:hover {
    background-color: #8f0000 !important;
    border-color: #8f0000 !important;
}

/* Required field asterisk */
.gform_wrapper .gfield_required {
    color: #ba0000;
}

/* --- Events (The Events Calendar / ai1ec) ------------------------------------- */

.tribe-events-calendar td.tribe_events_cat-featured {
    background-color: #eaf0f5;
}

/* --- Virtual Symposia --------------------------------------------------------- */

.blog-cont h1 {
    color: #3a6486;
    border-bottom: 3px solid #ba0000;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
}

/* --- Utility classes (carried from old theme) --------------------------------- */

/* Full-width background section */
.acsdoc-section {
    padding: 3rem 0;
}

.acsdoc-section-blue {
    background-color: #3a6486;
    color: #fff;
}

.acsdoc-section-blue h2,
.acsdoc-section-blue h3 {
    color: #fff;
}

.acsdoc-section-red {
    background-color: #ba0000;
    color: #fff;
}

.acsdoc-section-red h2,
.acsdoc-section-red h3 {
    color: #fff;
}

.acsdoc-section-light {
    background-color: #eaf0f5;
}

/* Tagline / subtitle text style */
.tagline {
    font-size: 1.1rem;
    color: #3a6486;
    font-style: italic;
}

/* =============================================================================
   HOME SLIDER
   Bootstrap 5 carousel. Compiled from _s__slider.scss.
   ============================================================================= */

#acsdoc-home-slider-section {
    background-color: #fff;
    position: relative;
}

/* Slide background image — responsive heights */
#acsdoc-home-slider-section .carousel-item .bg-img {
    background-size: cover !important;
    background-position: center 15% !important;
    height: 150px;
}

@media (min-width: 768px) {
    #acsdoc-home-slider-section .carousel-item .bg-img { height: 390px; }
}

@media (min-width: 992px) {
    #acsdoc-home-slider-section .carousel-item .bg-img { height: 525px; }
}

@media (min-width: 1275px) {
    #acsdoc-home-slider-section .carousel-item .bg-img { height: 550px; }
}

@media (min-width: 1700px) {
    #acsdoc-home-slider-section .carousel-item .bg-img { height: 600px; }
}

/* Caption overlay — semi-transparent backdrop for WCAG 1.4.3 contrast over photos */
#acsdoc-home-slider-section .carousel-caption {
    position: absolute;
    text-shadow: none;
    color: #fff;
    background: rgba(0, 0, 0, 0.45);
    border-radius: 4px;
    bottom: 20px;
    top: auto;
    left: 0;
    right: 0;
    width: 100%;
    text-align: center;
    padding: 0.75rem 35px;
}

#acsdoc-home-slider-section .carousel-caption.caption-left  { text-align: left; }
#acsdoc-home-slider-section .carousel-caption.caption-right { text-align: right; }

@media (min-width: 768px) {
    #acsdoc-home-slider-section .carousel-caption { top: 70px; bottom: auto; }
}

@media (min-width: 992px) {
    #acsdoc-home-slider-section .carousel-caption { top: 130px; }
}

#acsdoc-home-slider-section .carousel-caption h1 {
    color: #fff;
    font-size: 28px;
    font-weight: 700;
    margin: 0 0 10px;
    text-transform: uppercase;
}

@media (min-width: 768px) {
    #acsdoc-home-slider-section .carousel-caption h1 { font-size: 45px; white-space: normal; }
}

@media (min-width: 992px) {
    #acsdoc-home-slider-section .carousel-caption h1 { font-size: 60px; line-height: 82px; margin-bottom: 20px; }
}

#acsdoc-home-slider-section .carousel-caption p          { font-size: 12px; line-height: 1; }
@media (min-width: 768px) { #acsdoc-home-slider-section .carousel-caption p { font-size: 18px; } }
@media (min-width: 992px) { #acsdoc-home-slider-section .carousel-caption p { font-size: 24px; } }

/* Caption callout / CTA button */
.acsdoc-caption-callout {
    display: inline-block;
    background: #ba0000;
    color: #fff !important;
    border: 2px solid #ba0000;
    padding: 10px 24px;
    font-weight: 700;
    font-size: 0.9rem;
    text-transform: uppercase;
    text-decoration: none !important;
    margin-top: 15px;
    transition: background 0.2s ease, color 0.2s ease;
}

.acsdoc-caption-callout:hover {
    background: #fff;
    color: #ba0000 !important;
}

/* Slide indicators — hidden on mobile/tablet, flex on desktop */
#acsdoc-home-slider-section .carousel-indicators {
    display: none;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 10px;
    padding: 0;
    margin: 0;
    justify-content: center;
}

@media (min-width: 992px) {
    #acsdoc-home-slider-section .carousel-indicators { display: flex; }
}

#acsdoc-home-slider-section .carousel-indicators button {
    width: 95px;
    height: 7px;
    background: rgba(255, 255, 255, 0.5);
    border: none;
    border-radius: 0 !important;
    margin: 0 2px;
    padding: 0;
    opacity: 1;
    text-indent: -9999px;
}

#acsdoc-home-slider-section .carousel-indicators .active {
    background-color: #fff;
}

/* Prev/next controls — hidden until hover, hidden on mobile */
#acsdoc-home-slider-section .carousel-control-prev,
#acsdoc-home-slider-section .carousel-control-next {
    display: none;
    z-index: 100;
}

@media (min-width: 768px) {
    #acsdoc-home-slider-section .home-slider:hover .carousel-control-prev,
    #acsdoc-home-slider-section .home-slider:hover .carousel-control-next {
        display: flex;
    }
}

/* =============================================================================
   HOME CTAs — HEXAGONAL TILES
   Compiled from _s__ctas.scss + hexagon() mixin.
   hexagon(170px, #fff, 4px solid #fff):
     height = 170 * 0.577 = 98px  |  margin = 170 * 0.288 = 49px
     pseudo w/h = 170 * 0.707 = 120px  |  left = 170 * 0.129 = 22px
     top/bottom offset = 170 * 0.353 = 60px
   ============================================================================= */

/* Mobile: solid background bar */
#acsdoc-ctas-section {
    position: relative;
    width: 100%;
    background-color: #eaf0f5;
    padding: 20px 0;
}

/* Desktop: absolute, overlapping the bottom of the slider */
@media (min-width: 768px) {
    #acsdoc-ctas-section {
        position: absolute;
        background: none;
        margin-top: -210px;
        padding: 0;
        z-index: 100;
        width: 100%;
    }
}

@media (min-width: 992px) {
    #acsdoc-ctas-section { margin-top: -250px; }
}

/* Text BEFORE/AFTER the CTA tiles (section-level headings) is white over the image.
   h4 is intentionally excluded — hex tile titles use brand red, set below. */
#acsdoc-ctas-section .acsdoc-section__before,
#acsdoc-ctas-section .acsdoc-section__after {
    color: #fff;
}

/* Hex tile title: brand red — overrides any inherited white with high specificity */
#acsdoc-ctas-section .cta-item .hex h4 {
    color: #ba0000 !important;
}

/* Inner wrap: centred, max-width 890px */
#acsdoc-ctas-section .acsdoc-section__wrap {
    max-width: 890px;
    width: 90%;
    margin: 0 auto;
    padding: 0 15px;
}

/* CTA row — flexbox replacement for BS3 .row */
.cta-group {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0;
    border: 1px solid #c0cdd6;
    border-bottom: none;
}

@media (min-width: 768px) {
    .cta-group {
        border: none;
        margin-left: -18px;
    }
}

/* Individual CTA item — full width on mobile, fractional on desktop */
.cta-item {
    width: 100%;
    border-bottom: 1px solid #c0cdd6;
    background: #fff;
    isolation: isolate; /* keeps hex z-index: -1 pseudo-elements scoped */
}

@media (min-width: 768px) {
    .cta-item {
        border: none;
        background: none;
        text-align: center;
        padding-left: 18px;
    }
    .cta-item__one   { width: 100%; }
    .cta-item__two   { width: 50%; }
    .cta-item__three { width: 33.333%; }
    .cta-item__four  { width: 25%; }
    .cta-item__five  { width: 20%; }
    .cta-item__six   { width: 16.666%; }
}

/* Link wrapper */
.cta-item a {
    padding: 18px 18px 14px;
    display: inline-block;
    width: 100%;
    text-decoration: none !important;
    transition: all 0.2s ease-in-out;
}

@media (min-width: 768px) {
    .cta-item a { padding: 0; }
}

/* --- Hexagon shape (desktop only) --- */

/* Mobile: plain block, no clipping */
.cta-item .hex {
    display: block;
}

@media (min-width: 768px) {
    .cta-item .hex {
        position: relative;
        width: 170px;
        height: 98px;
        background-color: #fff;
        margin: 49px 0;
        border-left: 4px solid #fff;
        border-right: 4px solid #fff;
        display: inline-block;
        text-align: center;
        transition: background-color 0.2s ease, border-color 0.2s ease;
    }

    .cta-item .hex::before,
    .cta-item .hex::after {
        content: "";
        position: absolute;
        z-index: -1;
        width: 120px;
        height: 120px;
        transform: scaleY(0.5774) rotate(-45deg);
        background-color: inherit;
        left: 22px;
        transition: border-color 0.2s ease;
    }

    .cta-item .hex::before {
        top: -60px;
        border-top: 4px solid #fff;
        border-right: 4px solid #fff;
    }

    .cta-item .hex::after {
        bottom: -60px;
        border-bottom: 4px solid #fff;
        border-left: 4px solid #fff;
    }
}

/* Mobile: icon + title as a flex row — vertically centered */
.cta-item .hex {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px 14px;
}

/* Icon (Font Awesome) inside hex */
.cta-item .hex .fa,
.cta-item .hex [class^="fa-"],
.cta-item .hex [class*=" fa-"] {
    color: #666666;
    font-size: 28px;
    flex-shrink: 0;
    width: 1.25em; /* mirrors fa-fw */
    text-align: center;
}

/* Title inside hex */
.cta-item .hex h4 {
    color: #ba0000;
    font-family: Arial, sans-serif;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0;
    line-height: 1.3;
    text-align: left;
}

/* Desktop: switch to centered block layout inside the hexagon shape */
@media (min-width: 768px) {
    .cta-item .hex {
        display: inline-block;
        text-align: center;
        padding: 0;
        gap: 0;
    }

    .cta-item .hex .fa,
    .cta-item .hex [class^="fa-"],
    .cta-item .hex [class*=" fa-"] {
        display: inline-block;
        font-size: 24px;
        width: auto;
    }

    .cta-item .hex h4 {
        display: inline-block;
        margin: 16px 0 0;
        font-size: 20px;
        line-height: 27px !important;
        width: 100%;
        padding: 0 15px;
        text-align: center;
    }
}

/* Image inside hex */
.cta-item .hex img {
    max-width: 32px;
    flex-shrink: 0;
}

@media (min-width: 768px) {
    .cta-item .hex img {
        display: inline-block;
        max-width: 22px;
    }
}

/* Description / hover text — hidden by default */
.cta-item .hex > span {
    color: #fff;
    background: #0e2d47;
    display: none;
    font-size: 10px;
}

/* --- Hover state (desktop only) ---
   Swap to dark-blue hex, blue border; hide icon/title; show description. */
@media (min-width: 768px) {
    .cta-item a:hover .hex .fa,
    .cta-item a:hover .hex [class^="fa-"],
    .cta-item a:hover .hex [class*=" fa-"],
    .cta-item a:hover .hex h4,
    .cta-item a:hover .hex img {
        display: none;
    }

    .cta-item a:hover .hex {
        background-color: #0e2d47;
        border-color: #3a6486;
    }

    .cta-item a:hover .hex::before {
        border-top-color: #3a6486;
        border-right-color: #3a6486;
    }

    .cta-item a:hover .hex::after {
        border-bottom-color: #3a6486;
        border-left-color: #3a6486;
    }

    .cta-item a:hover .hex > span {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 15px;
        font-family: Arial, sans-serif;
        height: 100%;
        padding: 0 10px;
        text-align: center;
    }

    .cta-item a:hover {
        color: #fff;
    }
}

/* Wrap slider + CTAs together so the absolutely-positioned CTA section has a
   positioned ancestor to anchor to. The wrapper height = slider height; the CTAs
   overlap the slider bottom via negative margin-top. Content after the wrapper
   needs padding to clear the protruding bottom of the CTA hexagons (~40px). */
.home-hero-wrap {
    position: relative;
}

/* Push content after the hero wrap down to clear the hexagon overhang */
@media (min-width: 768px) {
    .home-hero-wrap + * {
        padding-top: 20px;
    }
}

@media (min-width: 992px) {
    .home-hero-wrap + * {
        padding-top: 10px;
    }
}

/* =============================================================================
   SECTION LAYOUT SYSTEM (.acsdoc-section__wrap / __outer / __inner)
   Used by every home-page section: info, news, widgets, features, testimonials.
   Compiled from _e__section.scss + individual section SCSS files.
   ============================================================================= */

/* Section spacing (replaces %acsdoc-section-spacing) */
#acsdoc-info-section,
#acsdoc-home-news-section,
#acsdoc-widgets-section,
#acsdoc-features-section,
#acsdoc-testimonials-section {
    margin: 0;
    padding: 30px 0;
}

@media (min-width: 768px) {
    #acsdoc-info-section,
    #acsdoc-home-news-section,
    #acsdoc-widgets-section,
    #acsdoc-features-section,
    #acsdoc-testimonials-section {
        padding: 50px 0;
    }
}

@media (min-width: 992px) {
    #acsdoc-info-section,
    #acsdoc-home-news-section,
    #acsdoc-widgets-section,
    #acsdoc-features-section,
    #acsdoc-testimonials-section {
        padding: 70px 0;
    }
}

/* __wrap: centred container, 95% wide (matches production width: 95%) */
.acsdoc-section__wrap {
    width: 95%;
    max-width: 1400px;
    margin-right: auto;
    margin-left: auto;
    padding-right: 15px;
    padding-left: 15px;
}

/* News section gets a tighter max-width */
#acsdoc-home-news-section .acsdoc-section__wrap {
    max-width: 1200px;
}

/* __outer: Bootstrap 5 flex row */
.acsdoc-section__outer {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}

/* __inner: full width mobile → col-sm-10 offset-sm-1 → col-md-8 offset-md-2 */
.acsdoc-section__inner {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    box-sizing: border-box;
}

@media (min-width: 768px) {
    .acsdoc-section__inner {
        width: 83.333%;           /* col-sm-10 */
        margin-left: 8.333%;      /* offset-sm-1 */
    }
}

@media (min-width: 992px) {
    .acsdoc-section__inner {
        width: 66.666%;           /* col-md-8 */
        margin-left: 16.666%;     /* offset-md-2 */
    }
}

/* Section title / before text */
.acsdoc-section__title,
.acsdoc-section__before {
    font-size: 1.8rem;
    text-align: center;
    margin-top: 0;
    margin-bottom: 1.5rem;
}

@media (min-width: 768px) {
    .acsdoc-section__title,
    .acsdoc-section__before {
        font-size: 2.2rem;
    }
}

/* Section after text */
.acsdoc-section__after {
    text-align: center;
    margin-top: 1rem;
}

/* Info section: centred text */
#acsdoc-info-section {
    text-align: center;
}

#acsdoc-info-section .acsdoc-section__inner > *:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
}

/* =============================================================================
   HOME NEWS SECTION
   Compiled from _s__news-items.scss.
   2-col grid at md+. 60px gutter (outer: margin-left -60px; items: padding-left 60px).
   ============================================================================= */

/* Override general __inner for news title row (full width, no centring offset) */
#acsdoc-home-news-section .acsdoc-section__inner {
    width: 100%;
    margin-left: 0;
    padding-left: 15px;
    padding-right: 15px;
}

@media (min-width: 992px) {
    #acsdoc-home-news-section .acsdoc-section__inner {
        padding-left: 60px;
    }

    /* Wide gutter: negative margin on outer, positive padding on each article */
    #acsdoc-home-news-section .acsdoc-section__outer {
        margin-left: -60px;
        margin-right: 0;
    }
}

/* Section title / headline */
#acsdoc-home-news-section .acsdoc-home-news__title h1,
#acsdoc-home-news-section .headline h1 {
    display: inline-block;
    padding-bottom: 10px;
    border-bottom: 2px solid #e1e1e1;
    margin-bottom: 25px;
}

@media (min-width: 768px) {
    #acsdoc-home-news-section .headline h1 {
        padding-bottom: 15px;
        margin-bottom: 50px;
    }
}

/* Each news article: full-width mobile → 50% (2 col) at md+ */
.acsdoc-news__wrap {
    width: 100%;
    padding: 0 15px;
    margin-bottom: 25px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}

@media (min-width: 992px) {
    .acsdoc-news__wrap {
        width: 50%;
        padding-left: 60px;
        padding-right: 0;
    }
}

/* Excerpt wrap: stretch to fill article height for equal-height rows */
.acsdoc-news__excerpt-wrap {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* News title link */
.acsdoc-news-title {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 1.35;
    margin-bottom: 5px;
    color: #ba0000;
    text-decoration: none;
    font-weight: 700;
}

@media (min-width: 768px) {
    .acsdoc-news-title {
        font-size: 18px;
        line-height: 24px;
    }
}

.acsdoc-news-title:hover,
.acsdoc-news-title:focus {
    color: #3a6486;
    text-decoration: underline;
}

/* Excerpt text */
.acsdoc-news-excerpt {
    font-size: 13px;
    font-weight: 300;
    line-height: 18px;
    color: #333;
}

@media (min-width: 768px) {
    .acsdoc-news-excerpt {
        font-size: 15px;
        line-height: 24px;
    }
}

/* "More News" callout button row */
.acsdoc-home-news__callout {
    text-align: center;
    margin-top: 15px;
}

/* Before/after section text */
#acsdoc-home-news-section .acsdoc-section__before {
    text-align: center;
}

#acsdoc-home-news-section .acsdoc-section__after {
    text-align: center;
    margin-top: 25px;
}

/* =============================================================================
   HOME NEWS SECTION (s__news-items.php — new Bootstrap 5 classes)
   ============================================================================= */

#home-news-section {
    background-color: #fff;
}

.section-title {
    color: #3a6486;
    font-size: 1.5rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 1.5rem;
}

/* Each news column: left padding matches old 60px indent, bottom margin spaces rows */
.news-col {
    padding-left: 60px;
    margin-bottom: 25px;
}

/* Counteract first column's left padding so items align with page edge */
#home-news-section .row {
    margin-left: -60px;
}

.news-title {
    display: block;
    font-size: 16px;
    line-height: 18px;
    font-weight: 700;
    color: #ba0000;
    text-decoration: none;
    margin-bottom: 5px;
}

@media (min-width: 576px) {
    .news-title {
        font-size: 18px;
        line-height: 24px;
    }
}

.news-title:hover,
.news-title:focus {
    color: #3a6486;
    text-decoration: underline;
}

.news-excerpt {
    font-size: 13px;
    font-weight: 300;
    line-height: 18px;
    color: #333;
}

@media (min-width: 576px) {
    .news-excerpt {
        font-size: 15px;
        line-height: 24px;
    }
}

.news-callout {
    text-align: center;
}

.section-after {
    text-align: center;
    margin-top: 1.5rem;
}

/* =============================================================================
   WCAG / ACCESSIBILITY ADDITIONS
   ============================================================================= */

/* Event cards rendered as <button> — reset browser defaults so card styling wins */
button.acsdoc-event-card {
    appearance: none;
    -webkit-appearance: none;
    border: none;
    background: none;
    padding: 0;
    font: inherit;
    color: inherit;
    text-align: left;
    width: 100%;
    cursor: pointer;
}

/* Respect user preference to reduce motion — disable all carousel transitions */
@media (prefers-reduced-motion: reduce) {
    .carousel .carousel-item {
        transition: none;
    }
    .carousel-fade .carousel-item {
        opacity: 1;
        transition: none;
    }
    .acsdoc-caption-callout {
        transition: none;
    }
    .btn {
        transition: none;
    }
}

/* Home slider pause/play button */
.acsdoc-slider-pause {
    position: absolute;
    bottom: 12px;
    right: 12px;
    z-index: 200;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    border: 2px solid rgba(255, 255, 255, 0.7);
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    cursor: pointer;
    line-height: 1;
}

.acsdoc-slider-pause:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 2px;
}

@media (min-width: 768px) {
    .acsdoc-slider-pause { bottom: 18px; right: 18px; }
}