/* =======================================================
   OJS THEME STRUCTURAL OVERRIDES & LAYOUT CORRECTIONS
   ======================================================= */
.pkp_structure_sidebar { display: none !important; }
.pkp_structure_main { width: 100% !important; max-width: 100% !important; float: none !important; border: none !important; box-shadow: none !important; padding-right: 0 !important; }
.has_sidebar .pkp_structure_main { border-right: none !important; padding-right: 0 !important; }
.pkp_structure_content::before, .pkp_structure_content::after, .pkp_structure_main::before, .pkp_structure_main::after, .pkp_structure_page::before, .pkp_structure_page::after { display: none !important; content: none !important; background: none !important; border: none !important; }
.pkp_structure_content, .pkp_structure_page { background-image: none !important; background: none !important; border: none !important; }

.additional_content, .page_index_journal .additional_content {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    clear: both !important;
    width: 100% !important;
    max-width: 960px !important;
    margin: 20px auto 50px auto !important;
}

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght=0,300;0,400;0,500;0,600;0,700;1,400&family=EB+Garamond:ital,wght=0,400;0,500;0,600;0,700;1,400&family=Montserrat:wght=300;400;500;600;700&display=swap');

h1, .page-title, .pkp_structure_page h1 { font-family: 'Cormorant Garamond', Georgia, serif !important; font-size: 34px !important; font-weight: 400 !important; color: #1F4382 !important; text-align: center !important; margin: 20px auto 35px auto !important; display: block !important; }
.pkp_page_index #homepageCurrentIssueTitle, .pkp_page_index .current_issue_title, .pkp_page_index h2.current_issue_title, .pkp_page_index .current_issue > h2,
.pkp_page_index .page .about_journal, .pkp_page_index .about_journal, .pkp_page_index #homepageAboutJournal, .pkp_page_index #homepageCurrentIssueContainer {
    display: none !important; visibility: hidden !important; height: 0 !important; margin: 0 !important; padding: 0 !important; border: none !important; background: none !important;
}

/* =======================================================
   GALLEY PDF ACTION BUTTONS
   ======================================================= */
.obj_article_summary .galleys_links .galley_link, 
.obj_article_details .galley_link, 
.galley_link, 
a.galley_link.pdf,
a.obj_galley_link.pdf {
    background-color: #7A1C1C !important;
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    border: 1px solid #611212 !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    text-decoration: none !important;
}
.obj_article_summary .galleys_links .galley_link:hover, 
.obj_article_details .galley_link:hover, 
.galley_link:hover,
a.galley_link.pdf:hover,
a.obj_galley_link.pdf:hover {
    background-color: #000000 !important;
    border-color: #000000 !important;
    color: #ffffff !important;
}

/* =======================================================
   SECTION 1: ANNOUNCEMENTS SMOOTH CAROUSEL FADE ENGINE
   ======================================================= */
.additional_content > h2:first-of-type {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.15em !important;
    color: #7A1C1C !important;
    text-align: center !important;
    margin: 30px auto 25px auto !important;
}

/* Set up a safe, unified slider deck canvas stage */
.additional_content > ul:first-of-type {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    width: 100% !important;
    position: relative !important;
    height: 200px !important; /* Locks structural bounds so cards stay on top of each other */
}

/* Base rules for stacked sliding layout items */
.additional_content > ul:first-of-type > li {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    box-sizing: border-box !important;
}

/* Attach synchronized 18-second timeline blocks to list item paths */
.additional_content > ul:first-of-type > li:nth-of-type(1) { animation: listFadeTrack1 18s infinite ease-in-out !important; }
.additional_content > ul:first-of-type > li:nth-of-type(2) { animation: listFadeTrack2 18s infinite ease-in-out !important; }
.additional_content > ul:first-of-type > li:nth-of-type(3) { animation: listFadeTrack3 18s infinite ease-in-out !important; }

@keyframes listFadeTrack1 {
    0%, 2%       { opacity: 0; visibility: hidden; transform: translateY(8px); }
    8%, 28%      { opacity: 1; visibility: visible; transform: translateY(0); }
    34%, 100%    { opacity: 0; visibility: hidden; transform: translateY(-8px); }
}
@keyframes listFadeTrack2 {
    0%, 34%      { opacity: 0; visibility: hidden; transform: translateY(8px); }
    40%, 62%     { opacity: 1; visibility: visible; transform: translateY(0); }
    68%, 100%    { opacity: 0; visibility: hidden; transform: translateY(-8px); }
}
@keyframes listFadeTrack3 {
    0%, 68%      { opacity: 0; visibility: hidden; transform: translateY(8px); }
    74%, 94%     { opacity: 1; visibility: visible; transform: translateY(0); }
    98%, 100%    { opacity: 0; visibility: hidden; transform: translateY(-8px); }
}

/* Formatting typography definitions inside the fading tracker */
.additional_content > ul:first-of-type > li strong {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 25px !important;
    font-weight: 600 !important;
    color: #000000 !important;
    display: block !important;
    margin-bottom: 8px !important;
    line-height: 1.3 !important;
}
.additional_content > ul:first-of-type > li p {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 16.5px !important;
    color: #334155 !important;
    line-height: 1.55 !important;
    max-width: 820px !important;
    margin: 0 auto 15px auto !important;
}
.additional_content > ul:first-of-type > li a {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #ffffff !important;
    background-color: #1F4382 !important;
    padding: 7px 16px !important;
    border-radius: 4px !important;
    display: inline-block !important;
    text-decoration: none !important;
}
.additional_content > ul:first-of-type > li a:hover { background-color: #000000 !important; }

/* =======================================================
   SECTION 2: DUAL GRID PANEL RECONSTRUCTION
   ======================================================= */
.additional_content > h2:nth-of-type(2) { display: none !important; visibility: hidden !important; font-size: 0px !important; margin: 0 !important; }

/* Full-band animated gradient behind BOTH cards.
   background-image is set separately from background-size so the
   shorthand does not collapse background-size back to auto, which
   was why the previous per-card animation appeared static. */
.additional_content > ul:nth-of-type(2) {
    list-style: none !important;
    padding: 50px 40px !important;
    margin: 40px auto 0 auto !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    border-radius: 8px !important;
    background-image: linear-gradient(135deg, #122C5E 0%, #1a4a72 25%, #1e6b7a 55%, #3a9a8a 78%, #6DBDAE 100%) !important;
    background-size: 250% 250% !important;
    animation: bandGradientShift 9s ease infinite !important;
}
@keyframes bandGradientShift {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* Both cards: no individual background, sitting on the band */
.additional_content > ul:nth-of-type(2) > li {
    width: 48% !important;
    min-height: 400px !important;
    box-sizing: border-box !important;
    border-radius: 6px !important;
    border: none !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 40px !important;
    text-align: center !important;
}

/* Left Panel: Newsletter Card — very subtle glass tint on gradient */
.additional_content > ul:nth-of-type(2) > li:first-of-type {
    background: rgba(255, 255, 255, 0.07) !important;
}
.additional_content > ul:nth-of-type(2) > li:first-of-type img {
    max-width: 230px !important;
    height: auto !important;
    display: block !important;
    margin: 0 auto 20px auto !important;
}
.additional_content > ul:nth-of-type(2) > li:first-of-type p {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 17px !important;
    font-style: italic !important;
    color: #ffffff !important;
    margin: 0 !important;
}
.additional_content > ul:nth-of-type(2) > li:first-of-type p a {
    color: #6DBDAE !important;
    text-decoration: underline !important;
    font-style: normal !important;
    font-weight: 500 !important;
}

/* Right Panel: Editors Pick — frosted white panel over the gradient */
.additional_content > ul:nth-of-type(2) > li:last-of-type {
    background: rgba(255, 255, 255, 0.92) !important;
}
.additional_content > ul:nth-of-type(2) > li:last-of-type strong {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 40px !important;
    font-weight: 700 !important;
    color: #000000 !important;
    display: block !important;
    margin-bottom: 5px !important;
    line-height: 1.1 !important;
}
.additional_content > ul:nth-of-type(2) > li:last-of-type span {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.12em !important;
    color: #7A1C1C !important;
    display: block !important;
    border-bottom: 2px solid #7A1C1C !important;
    padding-bottom: 6px !important;
    margin-bottom: 20px !important;
    width: 45px !important;
}
.additional_content > ul:nth-of-type(2) > li:last-of-type h3 {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 26px !important;
    font-weight: 600 !important;
    color: #000000 !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.3 !important;
}
.additional_content > ul:nth-of-type(2) > li:last-of-type h4 {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 17px !important;
    color: #1F4382 !important;
    font-weight: 400 !important;
    margin: 0 0 5px 0 !important;
}
.additional_content > ul:nth-of-type(2) > li:last-of-type h5 {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 15px !important;
    font-style: italic !important;
    color: #64748b !important;
    font-weight: 400 !important;
    margin: 0 0 25px 0 !important;
}
.additional_content > ul:nth-of-type(2) > li:last-of-type a {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    color: #7A1C1C !important;
    text-decoration: none !important;
}
.additional_content > ul:nth-of-type(2) > li:last-of-type a:hover { color: #000000 !important; }

/* Clear spacing cleanly for Native Issue Feed Below */
.page_index_journal .additional_content { margin-bottom: 60px !important; display: block !important; height: auto !important; }

/* =======================================================
   WHEAT CURRENT ISSUE ARTICLES CARD BLOCKS ARCHITECTURE
   ======================================================= */
@media (min-width: 768px) {
    .pkp_page_index .obj_issue_toc .sections .submissions, .page_issue .obj_issue_toc .sections .submissions {
        display: grid !important; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)) !important; gap: 30px !important; margin: 40px 0 40px 0 !important; list-style: none !important; clear: both !important; padding: 0 !important;
    }
}
.pkp_page_index .obj_article_summary, .page_issue .obj_article_summary {
    display: flex !important; flex-direction: column !important; justify-content: space-between !important; background: #F4F6FA !important; border: 1px solid #DDE3EE !important; border-radius: 6px !important; padding: 24px !important; min-height: 260px !important; width: 100% !important; float: none !important; box-sizing: border-box !important;
}
.obj_article_summary .title, .obj_article_summary .title a {
    font-family: 'Cormorant Garamond', Georgia, serif !important; font-size: 20px !important; font-weight: 600 !important; color: #000000 !important; line-height: 1.4 !important; letter-spacing: normal !important; text-decoration: none !important; display: block !important; text-align: left !important;
}
.pkp_page_index .obj_article_summary .authors, .page_issue .obj_article_summary .authors {
    font-family: 'EB Garamond', Georgia, serif !important; font-size: 15.5px !important; color: #1F4382 !important; display: block !important; margin: 0 0 20px 0 !important; text-align: left !important;
}

/* Crimson Footer Frame Layout */
.pkp_structure_footer_wrapper { background-color: #7A1C1C !important; border-top: 1px solid #611212 !important; padding: 32px 0 28px 0 !important; margin-top: 60px !important; clear: both !important; }
.pkp_structure_footer { display: flex !important; flex-direction: column !important; align-items: center !important; text-align: center !important; justify-content: center !important; gap: 18px !important; }
.pkp_structure_footer p, .pkp_structure_footer div, .pkp_structure_footer span, .pkp_structure_footer a { color: #F9F6EE !important; font-family: 'Montserrat', sans-serif !important; font-size: 11px !important; font-weight: 500 !important; text-decoration: none !important; }
.pkp_brand_footer, .pkp_structure_footer .pkp_brand_footer img { margin-top: 10px !important; filter: brightness(0) invert(1) !important; opacity: 0.9 !important; }

/* ---- Footer Social Row ---- */
.nujs-footer-social {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 20px !important;
    margin: 4px 0 0 0 !important;
}
.nujs-footer-social a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: rgba(255,255,255,0.85) !important;
    transition: color 0.2s ease, transform 0.2s ease !important;
    text-decoration: none !important;
}
.nujs-footer-social a:hover {
    color: #ffffff !important;
    transform: translateY(-2px) !important;
}
.nujs-footer-social svg {
    width: 20px !important;
    height: 20px !important;
    fill: currentColor !important;
    display: block !important;
}
/* The N submissions link — slightly larger, with a thin circle border */
.nujs-footer-sub-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    border: 1.5px solid rgba(255,255,255,0.6) !important;
    border-radius: 50% !important;
    color: rgba(255,255,255,0.85) !important;
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    line-height: 1 !important;
    transition: border-color 0.2s ease, color 0.2s ease, transform 0.2s ease !important;
}
.nujs-footer-sub-link:hover {
    border-color: #ffffff !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
}

/* =======================================================
   ARTICLE LISTING: YALE-STYLE PLACARD LAYOUT
   ======================================================= */

/* Hide published date everywhere it appears */
.pkp_page_index .obj_article_summary .published,
.page_issue .obj_article_summary .published,
.obj_article_summary .published,
.obj_article_summary .date_published,
.obj_article_summary time,
.obj_article_summary .meta_data .published,
.obj_article_summary .article_meta .published,
.pkp_page_index .obj_issue_toc .published,
.page_issue .obj_issue_toc .published,
.pkp_page_index .obj_article_summary .pub_date,
.page_issue .obj_article_summary .pub_date,
.obj_article_summary .pub_date { display: none !important; visibility: hidden !important; }

/* Reset the grid-based card layout to a stacked placard list */
@media (min-width: 768px) {
    .pkp_page_index .obj_issue_toc .sections .submissions,
    .page_issue .obj_issue_toc .sections .submissions {
        display: block !important;
        grid-template-columns: none !important;
        gap: 0 !important;
        margin: 20px 0 40px 0 !important;
        list-style: none !important;
        padding: 0 !important;
        border-top: 2px solid #7A1C1C !important;
    }
}

/* Each article becomes a horizontal placard row */
.pkp_page_index .obj_article_summary,
.page_issue .obj_article_summary {
    display: block !important;
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid #DDE3EE !important;
    border-radius: 0 !important;
    padding: 28px 10px 28px 10px !important;
    min-height: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    float: none !important;
    position: relative !important;
}

/* Section/type label above title — "ESSAY", "ARTICLE" etc */
.pkp_page_index .obj_article_summary .section,
.page_issue .obj_article_summary .section,
.obj_article_summary .series,
.obj_article_summary .type {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.14em !important;
    color: #7A1C1C !important;
    display: block !important;
    border-bottom: 2px solid #7A1C1C !important;
    padding-bottom: 4px !important;
    margin-bottom: 14px !important;
    width: fit-content !important;
}

/* Article title */
.pkp_page_index .obj_article_summary .title,
.page_issue .obj_article_summary .title,
.obj_article_summary .title a {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 22px !important;
    font-weight: 600 !important;
    color: #000000 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
    display: block !important;
    text-align: left !important;
    margin: 0 0 8px 0 !important;
    letter-spacing: normal !important;
}
.obj_article_summary .title a:hover { color: #7A1C1C !important; }

/* Author name in blue */
.pkp_page_index .obj_article_summary .authors,
.page_issue .obj_article_summary .authors {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 16px !important;
    color: #1F4382 !important;
    font-weight: 400 !important;
    display: block !important;
    margin: 0 0 12px 0 !important;
    text-align: left !important;
}

/* Abstract / description snippet */
.pkp_page_index .obj_article_summary .abstract,
.page_issue .obj_article_summary .abstract,
.obj_article_summary .abstract p {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 16px !important;
    color: #334155 !important;
    line-height: 1.6 !important;
    text-align: left !important;
    margin: 0 0 14px 0 !important;
    display: block !important;
}

/* Galley / PDF button row — keep existing crimson button styling, just align left */
.pkp_page_index .obj_article_summary .galleys_links,
.page_issue .obj_article_summary .galleys_links {
    text-align: left !important;
    margin-top: 4px !important;
}

/* =======================================================
   RESPONSIVE MEDIA CONTROLS FOR SMALL MOBILE DEVICES
   ======================================================= */
@media (max-width: 767px) {
    .additional_content > ul:first-of-type { height: auto !important; }
    .additional_content > ul:first-of-type > li { position: relative !important; animation: none !important; opacity: 1 !important; visibility: visible !important; margin-bottom: 30px !important; border-bottom: 1px dashed #DDE3EE !important; padding-bottom: 20px !important; }
    .additional_content > ul:first-of-type > li:last-of-type { border-bottom: none !important; }
    .additional_content > ul:nth-of-type(2) > li { width: 100% !important; min-height: auto !important; margin-bottom: 25px !important; padding: 30px 20px !important; }
    .pkp_page_index .obj_issue_toc .sections .submissions, .page_issue .obj_issue_toc .sections .submissions { display: block !important; padding: 0 !important; }
    .pkp_page_index .obj_article_summary, .page_issue .obj_article_summary { margin-bottom: 20px !important; min-height: auto !important; }
}

/* =======================================================
   ADDED ENGINE ADDITIONS: EDITORS PICK SLIDER + ABSTRACTS
   ======================================================= */
/* 1. Justify all abstract views globally across article view page modules */
.page_article .item.abstract, 
.page_article .article-abstract, 
.obj_article_details .abstract,
.obj_article_details .abstract .value,
.obj_article_details .abstract .value p {
    text-align: justify !important;
    text-justify: inter-word !important;
}

/* 2. Embedded horizontal sliding animation setup for the layout container */
.lr-editors-slider-container {
    width: 100% !important;
    overflow: hidden !important;
    position: relative !important;
    margin-top: 10px !important;
}
.lr-editors-slider-track {
    display: flex !important;
    width: 200% !important;
    animation: lrEditorsRightToLeftSlide 14s infinite ease-in-out !important;
}
.lr-editors-slide-card {
    width: 50% !important;
    box-sizing: border-box !important;
    padding: 0 5px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

/* 3. Scale handling layout rules for long paper headers to look beautiful */
.additional_content > ul:nth-of-type(2) > li:last-of-type h3.lr-long-title-fix {
    font-size: 16px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.02em !important;
    line-height: 1.4 !important;
    max-width: 100% !important;
    margin: 0 auto 12px auto !important;
}

/* Sliding timeline: right-to-left loop */
@keyframes lrEditorsRightToLeftSlide {
    0%, 45%   { transform: translateX(0%); }      /* Slide 1 stays active */
    50%, 95%  { transform: translateX(-50%); }    /* Slides right-to-left to Slide 2 */
    100%      { transform: translateX(0%); }      /* Loops seamlessly back to start */
}
#final-unbroken-engine {
    width: 100% !important;
    max-width: 100% !important;
    margin: 40px auto !important;
    padding: 20px 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    position: relative !important;
    background: transparent !important;
}

#final-unbroken-engine .features-header-wrapper {
    text-align: center !important;
    margin: 0 auto 30px auto !important;
}

#final-unbroken-engine .features-header-text {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.15em !important;
    color: #7A1C1C !important;
    display: inline-block !important;
    border-bottom: 2px solid #7A1C1C !important;
    padding-bottom: 5px !important;
}

#final-unbroken-engine #unbrokenStageViewport {
    width: 100% !important;
    max-width: 1200px !important;
    height: 560px !important;
    position: relative !important;
    overflow: hidden !important;
    margin: 0 auto !important;
}

#final-unbroken-engine #unbrokenPrevBtn {
    position: absolute !important;
    top: 45% !important;
    transform: translateY(-50%) !important;
    left: 15px !important;
    width: 44px !important;
    height: 44px !important;
    background: rgba(255, 255, 255, 0.95) !important;
    border: 1px solid #DDE3EE !important;
    border-radius: 50% !important;
    color: #1F4382 !important;
    font-size: 18px !important;
    cursor: pointer !important;
    z-index: 999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important;
    padding: 0 !important;
}

#final-unbroken-engine #unbrokenNextBtn {
    position: absolute !important;
    top: 45% !important;
    transform: translateY(-50%) !important;
    right: 15px !important;
    width: 44px !important;
    height: 44px !important;
    background: rgba(255, 255, 255, 0.95) !important;
    border: 1px solid #DDE3EE !important;
    border-radius: 50% !important;
    color: #1F4382 !important;
    font-size: 18px !important;
    cursor: pointer !important;
    z-index: 999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important;
    padding: 0 !important;
}

#final-unbroken-engine #unbrokenScrollerTrack {
    position: absolute !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    top: 25px !important;
    left: 0 !important;
    height: auto !important;
    width: max-content !important;
    transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1) !important;
    will-change: transform !important;
    padding: 10px 0 !important;
}

#final-unbroken-engine .slider-deck-card {
    width: 420px !important;
    min-width: 420px !important;
    margin: 0 25px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    background: none !important;
    transition: transform 0.4s ease, opacity 0.4s ease, box-shadow 0.4s ease !important;
}

#final-unbroken-engine .card-image-wrapper {
    width: 100% !important;
    height: 230px !important;
    border-radius: 4px 4px 0 0 !important;
    overflow: hidden !important;
    background-color: #ffffff !important;
    border: 1px solid #DDE3EE !important;
    border-bottom: none !important;
}

#final-unbroken-engine .card-image-wrapper img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

#final-unbroken-engine .card-content-wrapper {
    width: 100% !important;
    box-sizing: border-box !important;
    background: #F4F6FA !important;
    border: 1px solid #DDE3EE !important;
    border-radius: 0 0 4px 4px !important;
    padding: 25px 30px 30px 30px !important;
}

#final-unbroken-engine .card-tag {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.12em !important;
    color: #7A1C1C !important;
    display: inline-block !important;
    border-bottom: 2px solid #7A1C1C !important;
    padding-bottom: 3px !important;
    margin-bottom: 14px !important;
}

#final-unbroken-engine .card-title {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 21px !important;
    font-weight: 600 !important;
    color: #000000 !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.3 !important;
}

#final-unbroken-engine .card-author {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 16px !important;
    color: #1F4382 !important;
    font-weight: 400 !important;
    margin: 0 0 5px 0 !important;
}

#final-unbroken-engine .card-volume {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 14px !important;
    font-style: italic !important;
    color: #64748b !important;
    font-weight: 400 !important;
    margin: 0 0 18px 0 !important;
}

#final-unbroken-engine .card-read-link {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    color: #7A1C1C !important;
    text-decoration: none !important;
}

#final-unbroken-engine .tracker-rail {
    width: 160px !important;
    height: 4px !important;
    background: #e2e8f0 !important;
    margin: 15px auto 0 auto !important;
    border-radius: 2px !important;
    position: relative !important;
    overflow: hidden !important;
}

#final-unbroken-engine #unbrokenTrackerBar {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    height: 100% !important;
    width: 33.33% !important;
    background: #1F4382 !important;
    border-radius: 2px !important;
    transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1) !important;
}
#final-unbroken-engine {
    width: 100% !important;
    max-width: 100% !important;
    margin: 40px auto !important;
    padding: 20px 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    position: relative !important;
    background: transparent !important;
}

.slide-radio-state {
    display: none !important;
    visibility: hidden !important;
}

#final-unbroken-engine .features-header-wrapper {
    text-align: center !important;
    margin: 0 auto 30px auto !important;
}

#final-unbroken-engine .features-header-text {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.15em !important;
    color: #7A1C1C !important;
    display: inline-block !important;
    border-bottom: 2px solid #7A1C1C !important;
    padding-bottom: 5px !important;
}

#final-unbroken-engine #unbrokenStageViewport {
    width: 100% !important;
    max-width: 1200px !important;
    height: 560px !important;
    position: relative !important;
    overflow: hidden !important;
    margin: 0 auto !important;
}

/* Background Click Targets Mechanics */
.hotspot-overlay {
    position: absolute !important;
    top: 0 !important;
    width: 280px !important;
    height: 100% !important;
    z-index: 900 !important;
    cursor: pointer !important;
}
.to-left-zone { left: 0 !important; }
.to-right-zone { right: 0 !important; }

/* Dynamic Hotspot Route Configurations based on Active Slide */
#slide-tab-1:checked ~ #unbrokenStageViewport .to-left-zone { label[for="slide-tab-3"]; }
#slide-tab-1:checked ~ #unbrokenStageViewport .to-right-zone { display: none !important; }

/* Arrow Design Mechanics */
.arrow-btn {
    position: absolute !important;
    top: 45% !important;
    transform: translateY(-50%) !important;
    width: 44px !important;
    height: 44px !important;
    background: rgba(255, 255, 255, 0.95) !important;
    border: 1px solid #DDE3EE !important;
    border-radius: 50% !important;
    color: #1F4382 !important;
    font-size: 18px !important;
    cursor: pointer !important;
    z-index: 999 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important;
    user-select: none !important;
}
.prev-btn { left: 15px !important; }
.next-btn { right: 15px !important; }

/* Display appropriate directional navigators */
#slide-tab-1:checked ~ #unbrokenStageViewport .control-1 { display: flex !important; }
#slide-tab-2:checked ~ #unbrokenStageViewport .control-2 { display: flex !important; }
#slide-tab-3:checked ~ #unbrokenStageViewport .control-3 { display: flex !important; }

#final-unbroken-engine #unbrokenScrollerTrack {
    position: absolute !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    top: 25px !important;
    left: 50% !important;
    height: auto !important;
    width: max-content !important;
    transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1) !important;
    will-change: transform !important;
    padding: 10px 0 !important;
}

#final-unbroken-engine .slider-deck-card {
    width: 420px !important;
    min-width: 420px !important;
    margin: 0 25px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    background: none !important;
    transition: transform 0.4s ease, opacity 0.4s ease, box-shadow 0.4s ease !important;
    opacity: 0.45 !important;
    transform: scale(0.88) !important;
}

/* TRACK RAIL ALIGNMENT PLACEMENTS */
#slide-tab-1:checked ~ #unbrokenStageViewport #unbrokenScrollerTrack { transform: translateX(-210px) !important; }
#slide-tab-2:checked ~ #unbrokenStageViewport #unbrokenScrollerTrack { transform: translateX(-680px) !important; }
#slide-tab-3:checked ~ #unbrokenStageViewport #unbrokenScrollerTrack { transform: translateX(-1150px) !important; }

/* FOCUS CARD EMISSION CHANGES */
#slide-tab-1:checked ~ #unbrokenStageViewport #unbrokenScrollerTrack .card-index-1,
#slide-tab-2:checked ~ #unbrokenStageViewport #unbrokenScrollerTrack .card-index-2,
#slide-tab-3:checked ~ #unbrokenStageViewport #unbrokenScrollerTrack .card-index-3 {
    transform: scale(1.04) !important;
    opacity: 1 !important;
    box-shadow: 0 15px 35px rgba(0,0,0,0.07) !important;
}

#final-unbroken-engine .card-image-wrapper {
    width: 100% !important;
    height: 230px !important;
    border-radius: 4px 4px 0 0 !important;
    overflow: hidden !important;
    background-color: #ffffff !important;
    border: 1px solid #DDE3EE !important;
    border-bottom: none !important;
}

#final-unbroken-engine .card-image-wrapper img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

#final-unbroken-engine .card-content-wrapper {
    width: 100% !important;
    box-sizing: border-box !important;
    background: #F4F6FA !important;
    border: 1px solid #DDE3EE !important;
    border-radius: 0 0 4px 4px !important;
    padding: 25px 30px 30px 30px !important;
}

#final-unbroken-engine .card-tag {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.12em !important;
    color: #7A1C1C !important;
    display: inline-block !important;
    border-bottom: 2px solid #7A1C1C !important;
    padding-bottom: 3px !important;
    margin-bottom: 14px !important;
}

#final-unbroken-engine .card-title {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 21px !important;
    font-weight: 600 !important;
    color: #000000 !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.3 !important;
}

#final-unbroken-engine .card-author {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 16px !important;
    color: #1F4382 !important;
    font-weight: 400 !important;
    margin: 0 0 5px 0 !important;
}

#final-unbroken-engine .card-volume {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 14px !important;
    font-style: italic !important;
    color: #64748b !important;
    font-weight: 400 !important;
    margin: 0 0 18px 0 !important;
}

#final-unbroken-engine .card-read-link {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    color: #7A1C1C !important;
    text-decoration: none !important;
}

#final-unbroken-engine .tracker-rail {
    width: 160px !important;
    height: 4px !important;
    background: #e2e8f0 !important;
    margin: 15px auto 0 auto !important;
    border-radius: 2px !important;
    position: relative !important;
    overflow: hidden !important;
}

#final-unbroken-engine #unbrokenTrackerBar {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    height: 100% !important;
    width: 33.33% !important;
    background: #1F4382 !important;
    border-radius: 2px !important;
    transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

/* TRACKER RAIL HIGHLIGHTS */
#slide-tab-1:checked ~ .tracker-rail #unbrokenTrackerBar { transform: translateX(0%) !important; }
#slide-tab-2:checked ~ .tracker-rail #unbrokenTrackerBar { transform: translateX(100%) !important; }
#slide-tab-3:checked ~ .tracker-rail #unbrokenTrackerBar { transform: translateX(200%) !important; }

}
/* ==========================================================================
   SCROLL LOCK REMOVED — was causing the page to be unscrollable
   ========================================================================== */
/* =======================================================
   LOGO ENTRANCE ANIMATION
   ======================================================= */
@keyframes nujs-logo-entrance {
    0%   { opacity: 0; transform: translateY(-18px) scale(0.96); }
    60%  { opacity: 1; transform: translateY(2px) scale(1.01); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}

.pkp_site_name .is_img img,
.pkp_site_name a.is_img img {
    animation: nujs-logo-entrance 1.1s cubic-bezier(0.22, 1, 0.36, 1) both !important;
    animation-delay: 0.1s !important;
    will-change: opacity, transform !important;
}

/* =======================================================
   YALE-STYLE TWO-COLUMN ARTICLE CARD GRID
   (matches screenshot layout with NUJS colour palette)
   ======================================================= */

/* --- Container: turn the OJS article list into a 2-col grid --- */
.pkp_page_index .obj_issue_toc .sections .cmp_article_list,
.page_issue .obj_issue_toc .sections .cmp_article_list {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 28px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 32px 0 40px 0 !important;
    border-top: none !important;
}

/* --- Each <li> is a card --- */
.pkp_page_index .obj_issue_toc .sections .cmp_article_list > li,
.page_issue .obj_issue_toc .sections .cmp_article_list > li {
    display: block !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
}

/* --- The card shell --- */
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary,
.page_issue .obj_issue_toc .sections .cmp_article_list .obj_article_summary {
    display: flex !important;
    flex-direction: column !important;
    background: #ffffff !important;
    border: 1px solid #e8e8e8 !important;
    border-top: 3px solid #7A1C1C !important;
    border-radius: 0 !important;
    padding: 24px 26px 22px 26px !important;
    min-height: 220px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    float: none !important;
    position: relative !important;
    transition: box-shadow 0.2s ease !important;
}

.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary:hover,
.page_issue .obj_issue_toc .sections .cmp_article_list .obj_article_summary:hover {
    box-shadow: 0 4px 18px rgba(0,0,0,0.09) !important;
}

/* --- Section label (e.g. "ARTICLE") injected via the <h3> section heading above --- */
/* Inject "ARTICLE" label badge on every card using the section h3 context */
.pkp_page_index .obj_issue_toc .section > h3,
.page_issue .obj_issue_toc .section > h3 {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    color: #7A1C1C !important;
    border-bottom: none !important;
    margin: 32px 0 0 0 !important;
    padding: 0 !important;
    display: block !important;
}

/* --- Per-card section pill (shown at top of each card) --- */
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary::before,
.page_issue .obj_issue_toc .sections .cmp_article_list .obj_article_summary::before {
    content: "ARTICLE" !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    color: #7A1C1C !important;
    display: block !important;
    margin-bottom: 10px !important;
    padding-bottom: 0 !important;
    border-bottom: none !important;
}

/* Short maroon rule below the section label (mimics the "—" in screenshot) */
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary .title,
.page_issue .obj_issue_toc .sections .cmp_article_list .obj_article_summary .title {
    border-top: 2px solid #e8e8e8 !important;
    padding-top: 12px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* --- Article title --- */
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary .title a,
.page_issue .obj_issue_toc .sections .cmp_article_list .obj_article_summary .title a {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 21px !important;
    font-weight: 700 !important;
    color: #111111 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
    display: block !important;
    margin-bottom: 10px !important;
}

.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary .title a:hover,
.page_issue .obj_issue_toc .sections .cmp_article_list .obj_article_summary .title a:hover {
    color: #7A1C1C !important;
}

/* --- Author name in NUJS navy --- */
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary .authors,
.page_issue .obj_issue_toc .sections .cmp_article_list .obj_article_summary .authors {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 16.5px !important;
    font-style: italic !important;
    color: #1F4382 !important;
    font-weight: 500 !important;
    display: block !important;
    margin: 6px 0 16px 0 !important;
    text-align: left !important;
}

/* --- Meta wrapper flex push to bottom --- */
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary .meta,
.page_issue .obj_issue_toc .sections .cmp_article_list .obj_article_summary .meta {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
}

/* --- Galleys row pinned to card bottom --- */
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary .galleys_links,
.page_issue .obj_issue_toc .sections .cmp_article_list .obj_article_summary .galleys_links {
    margin-top: auto !important;
    padding-top: 14px !important;
    text-align: left !important;
    list-style: none !important;
    padding-left: 0 !important;
}

/* Restore border-top on the section list after the reset earlier */
.pkp_page_index .obj_issue_toc .sections .submissions,
.page_issue .obj_issue_toc .sections .submissions {
    border-top: none !important;
}

/* --- Responsive: single column on mobile --- */
@media (max-width: 767px) {
    .pkp_page_index .obj_issue_toc .sections .cmp_article_list,
    .page_issue .obj_issue_toc .sections .cmp_article_list {
        grid-template-columns: 1fr !important;
    }
}


/* =======================================================
   FINAL v3 — HOME / CURRENT ISSUE DISTINCTION
   Volume banner · Equal cards · 4-article home limit
   "View the Entire Volume" button (wired via JS below)
   Logo animation upgrade
   ======================================================= */

/* -------------------------------------------------------
   1. LOGO ANIMATION — prominent entrance with shimmer
   ------------------------------------------------------- */
@keyframes nujs-logo-v3 {
    0%   { opacity: 0;    transform: translateY(-24px) scale(0.93); filter: blur(3px); }
    55%  { opacity: 1;    transform: translateY(3px)   scale(1.03); filter: blur(0);   }
    75%  { opacity: 1;    transform: translateY(-1px)  scale(0.995);filter: blur(0);   }
    100% { opacity: 1;    transform: translateY(0)     scale(1);    filter: blur(0);   }
}
@keyframes nujs-logo-glow {
    0%,100% { box-shadow: none; filter: drop-shadow(0 0 0px rgba(122,28,28,0)); }
    30%     { filter: drop-shadow(0 0 8px rgba(122,28,28,0.28)); }
    60%     { filter: drop-shadow(0 0 3px rgba(31,67,130,0.18)); }
}

.pkp_site_name .is_img img,
.pkp_site_name a.is_img img {
    animation:
        nujs-logo-v3  1.3s cubic-bezier(0.22, 1, 0.36, 1) 0.05s both,
        nujs-logo-glow 3.5s ease-in-out 1.35s 1 forwards !important;
    will-change: opacity, transform, filter !important;
}

/* -------------------------------------------------------
   2. VOLUME BANNER — home page only
      Use .obj_issue_toc .heading which OJS renders;
      hide its inner content and inject our text safely
      using a data attribute trick avoided by using
      a literal ASCII-only content string (no \00a0 digits)
   ------------------------------------------------------- */

/* Hide the built-in published-date text */
.pkp_page_index .obj_issue_toc .heading .published,
.pkp_page_index .obj_issue_toc .heading p {
    display: none !important;
    visibility: hidden !important;
}

/* Style the heading container as the HLR-style band */
.pkp_page_index .obj_issue_toc .heading {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #eef3fa !important;
    border-top: 1.5px solid #9cb4d4 !important;
    border-bottom: 1.5px solid #9cb4d4 !important;
    padding: 13px 0 !important;
    margin: 28px 0 0 0 !important;
    min-height: 44px !important;
}

/*
   CRITICAL FIX: the previous blocks used \00a018 which the
   CSS parser reads as a single hex codepoint U+00A018, eating
   the "18". We now write the number directly in ASCII after
   closing the unicode-escape with a space-terminated sequence.
   The safest approach: use a CSS custom property set on :root
   so the content is never parsed as a hex escape.
*/
:root {
    --vol-banner: "Volume 18   Issue 3\2013 4";
}

.pkp_page_index .obj_issue_toc .heading::after {
    content: var(--vol-banner) !important;
    font-family: 'EB Garamond', 'Cormorant Garamond', Georgia, serif !important;
    font-size: 22px !important;
    font-weight: 600 !important;
    letter-spacing: 0.18em !important;
    text-transform: none !important;
    color: #1F4382 !important;
    display: block !important;
    text-align: center !important;
}

/* Hide the old section h3 labels on home (they say "Articles" etc) */
.pkp_page_index .obj_issue_toc .section > h3 {
    display: none !important;
}

/* -------------------------------------------------------
   3. ARTICLE CARD GRID — both pages, equal-height rows,
      NO fixed height so titles never clip
   ------------------------------------------------------- */
.pkp_page_index .obj_issue_toc .sections .cmp_article_list,
.page_issue    .obj_issue_toc .sections .cmp_article_list {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 26px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 28px 0 0 0 !important;
    align-items: stretch !important;  /* all cards in a row match the tallest */
}

.pkp_page_index .obj_issue_toc .sections .cmp_article_list > li,
.page_issue    .obj_issue_toc .sections .cmp_article_list > li {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    /* stretch li to fill grid cell so card inside gets full height */
    display: flex !important;
}

/* Card shell: flex column, min-height 300px for visual weight,
   height: 100% so it stretches to match sibling in the same row.
   overflow: visible so long titles are NEVER cut. */
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary,
.page_issue    .obj_issue_toc .sections .cmp_article_list .obj_article_summary {
    display: flex !important;
    flex-direction: column !important;
    background: #ffffff !important;
    border: 1px solid #e8e8e8 !important;
    border-top: 3px solid #7A1C1C !important;
    border-radius: 0 !important;
    padding: 26px 28px 24px 28px !important;
    min-height: 300px !important;
    height: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
    float: none !important;
    overflow: visible !important;
    position: relative !important;
    transition: box-shadow 0.2s ease !important;
}

.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary:hover,
.page_issue    .obj_issue_toc .sections .cmp_article_list .obj_article_summary:hover {
    box-shadow: 0 4px 20px rgba(0,0,0,0.10) !important;
}

/* Title: full text, no clamping, no ellipsis */
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary .title a,
.page_issue    .obj_issue_toc .sections .cmp_article_list .obj_article_summary .title a {
    overflow: visible !important;
    white-space: normal !important;
    text-overflow: unset !important;
    -webkit-line-clamp: unset !important;
    display: block !important;
}

/* Push PDF button to card bottom */
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary .meta,
.page_issue    .obj_issue_toc .sections .cmp_article_list .obj_article_summary .meta {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
}

.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary .galleys_links,
.page_issue    .obj_issue_toc .sections .cmp_article_list .obj_article_summary .galleys_links {
    margin-top: auto !important;
    padding-top: 16px !important;
}

/* -------------------------------------------------------
   4. HOME PAGE ONLY — show first 4 articles, hide rest
      Hide all sections after the first (Note/Interviews/etc)
      and within the first section hide items 5+
   ------------------------------------------------------- */
.pkp_page_index .obj_issue_toc .sections .section:not(:first-child) {
    display: none !important;
}
.pkp_page_index .obj_issue_toc .sections .section:first-child .cmp_article_list > li:nth-child(n+5) {
    display: none !important;
}

/* -------------------------------------------------------
   5. "VIEW THE ENTIRE VOLUME" BUTTON
      We inject a real <a> element via the <script> block
      below. The CSS here just styles the #lr-vol-btn id.
   ------------------------------------------------------- */
#lr-vol-btn {
    display: block !important;
    width: fit-content !important;
    margin: 34px auto 54px auto !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.16em !important;
    color: #7A1C1C !important;
    border: 1.5px solid #7A1C1C !important;
    padding: 12px 30px !important;
    border-radius: 3px !important;
    text-decoration: none !important;
    background: #ffffff !important;
    transition: background 0.2s ease, color 0.2s ease !important;
    cursor: pointer !important;
}
#lr-vol-btn:hover {
    background: #7A1C1C !important;
    color: #ffffff !important;
}

/* -------------------------------------------------------
   6. RESPONSIVE
   ------------------------------------------------------- */
@media (max-width: 767px) {
    .pkp_page_index .obj_issue_toc .sections .cmp_article_list,
    .page_issue    .obj_issue_toc .sections .cmp_article_list {
        grid-template-columns: 1fr !important;
    }
    .pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary,
    .page_issue    .obj_issue_toc .sections .cmp_article_list .obj_article_summary {
        min-height: 0 !important;
    }
}


/* =======================================================
   FULL SECTION REORDER: Announcements -> Current Articles ->
   Editors' Pick -> Newsletter -> Features

   additional_content currently bundles four pieces together
   in the HTML (announcements ul, hidden h2, the combined
   newsletter+editors-pick ul, and the features engine). To
   give each piece its own position relative to current_issue,
   we promote additional_content's children to be direct flex
   items of page_index_journal via display:contents, then order
   each one individually. The same trick splits the combined
   newsletter+editors-pick <ul> so those two <li>s can also be
   ordered independently of each other.
   ======================================================= */
.page_index_journal {
    display: flex !important;
    flex-direction: column !important;
}

/* Un-wrap additional_content: its direct children become
   direct flex items of page_index_journal instead of being
   locked together as a single block. */
.page_index_journal .additional_content {
    display: contents !important;
}

/* Announcements list: first */
.page_index_journal .additional_content > h2:first-of-type,
.page_index_journal .additional_content > ul:first-of-type {
    order: 1 !important;
}

/* Current issue articles: second */
.page_index_journal .current_issue {
    order: 2 !important;
}

/* Hidden "BOARD LAYOUT DECK" heading stays inert, grouped with
   whichever sibling it's visually nearest (no visible effect). */
.page_index_journal .additional_content > h2:nth-of-type(2) {
    order: 3 !important;
}

/* Newsletter + Editors' Pick: kept together as ONE flex item
   so their original side-by-side row (defined earlier in this
   file as a flex row with two 48%-width <li>s) is preserved.
   Only the pair as a whole moves to position 3 — we do NOT
   unwrap this <ul>, since doing so previously broke the
   side-by-side layout and stacked the two cards vertically. */
.page_index_journal .additional_content > ul:nth-of-type(2) {
    order: 3 !important;
}

/* Features engine: fourth */
.page_index_journal #final-unbroken-engine {
    order: 4 !important;
}

/* Ensure all promoted sections stay full-width and centered in
   the column layout, since display:contents strips the parent
   box that used to constrain width. */
.page_index_journal .current_issue,
.page_index_journal .additional_content > h2:first-of-type,
.page_index_journal .additional_content > ul:first-of-type,
.page_index_journal .additional_content > ul:nth-of-type(2),
.page_index_journal #final-unbroken-engine {
    width: 100% !important;
    max-width: 960px !important;
    float: none !important;
    align-self: center !important;
    box-sizing: border-box !important;
}

/* =======================================================
   EDITORS' PICK "ARTICLE" LABEL
   The word "ARTICLE" sits as bare text directly after the
   <strong>Editors' Pick</strong> heading in the markup. A
   matching JS snippet (see nujs-scroll-reveal.js) wraps that
   bare text in a <span class="lr-article-tag"> on load so it
   can be styled as a centered red label with underline,
   matching the rest of the card's centered alignment.
   ======================================================= */
.additional_content > ul:nth-of-type(2) > li:last-of-type strong {
    text-align: center !important;
}
.additional_content > ul:nth-of-type(2) > li:last-of-type .lr-article-tag {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.15em !important;
    color: #B02418 !important;
    display: table !important;
    margin: 0 auto 20px auto !important;
    border-bottom: 2px solid #B02418 !important;
    padding-bottom: 6px !important;
    align-self: center !important;
}
/* READ HERE link colour updated to match the reference image */
.additional_content > ul:nth-of-type(2) > li:last-of-type a {
    color: #B02418 !important;
}


/* =======================================================
   SCROLL REVEAL: slide-in transition on first entry into viewport

   Pairs with a JS snippet (Custom Header plugin's Footer HTML
   field) that uses IntersectionObserver to add .is-visible the
   first time each [data-reveal] section enters the viewport.
   No JS = no risk: the fallback below keeps everything fully
   visible if the script fails to load or run for any reason,
   so this can never hide content the way the old loader did.

   Default direction: slide in from the LEFT. The Editors' Pick
   / Newsletter pair is a special case -- since they sit side by
   side, each slides in from its own outer edge toward the
   centre (Newsletter from the left, Editors' Pick from the
   right) for a more deliberate, two-sided convergence effect.
   ======================================================= */
[data-reveal] {
    opacity: 0;
    transform: translateX(-90px);
    transition: opacity 1.4s cubic-bezier(0.16, 1, 0.3, 1),
                transform 1.4s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: transform, opacity;
}
[data-reveal].is-visible {
    opacity: 1 !important;
    transform: translateX(0) !important;
}

/* Editors' Pick card: slides in from the RIGHT instead of the
   default left, so it converges toward the Newsletter card. */
.page_index_journal .additional_content > ul:nth-of-type(2) > li:last-of-type[data-reveal] {
    transform: translateX(90px);
}
.page_index_journal .additional_content > ul:nth-of-type(2) > li:last-of-type[data-reveal].is-visible {
    transform: translateX(0) !important;
}

/* Safety net: if JS never runs at all, force everything visible
   after a short delay via pure CSS so nothing stays hidden.
   Scoped specifically to the absence of html.nujs-js-ready (set
   by the script the moment it runs) so this fallback does NOT
   fire when JS is working correctly -- otherwise it would mask
   the real scroll-triggered reveal by forcing visibility on a
   fixed timer regardless of scroll position. */
html:not(.nujs-js-ready) [data-reveal] {
    animation: revealFallback 0s 2.5s forwards;
}
@keyframes revealFallback {
    to { opacity: 1; transform: translateX(0); }
}

/* Stagger article cards inside Current Issue so they slide in
   one after another, left to right, rather than all at once. */
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary {
    transition-delay: 0s !important;
}
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary:nth-child(1) { transition-delay: 0.1s !important; }
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary:nth-child(2) { transition-delay: 0.22s !important; }
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary:nth-child(3) { transition-delay: 0.34s !important; }
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary:nth-child(4) { transition-delay: 0.46s !important; }
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary:nth-child(5) { transition-delay: 0.58s !important; }
.pkp_page_index .obj_issue_toc .sections .cmp_article_list .obj_article_summary:nth-child(6) { transition-delay: 0.7s !important; }

/* Respect users who've asked their OS/browser to reduce motion */
@media (prefers-reduced-motion: reduce) {
    [data-reveal] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        animation: none !important;
    }
}

/* =======================================================
   ARTICLE PAGE REDESIGN — v2
   Fixes applied:
   1. PDF button: clean maroon pill with icon, not weird browser default
   2. main_entry starts from page left edge (no extra left indent)
   3. Title: smaller (32px), full-width, justified
   4. Abstract/Keywords headings: larger, bolder red labels
   5. Author bios: better font/colour treatment
   6. More Citation Formats button: single clean border, no double outline
   ======================================================= */

/* --- Page container: full width, no centre-squish --- */
.page_article {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
}

/* --- Article title: full-width, justified, moderate size --- */
.page_article .page_title,
.obj_article_details .page_title {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 32px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    color: #111111 !important;
    text-align: justify !important;
    text-justify: inter-word !important;
    max-width: none !important;
    width: 100% !important;
    margin: 30px 0 24px 0 !important;
    letter-spacing: -0.01em !important;
}

/* --- Two-column row: main (wide left) + sidebar (narrow right) --- */
.obj_article_details .row {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 48px !important;
}
.obj_article_details .main_entry {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    order: 1 !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}
.obj_article_details .entry_details {
    flex: 0 0 200px !important;
    width: 200px !important;
    min-width: 200px !important;
    order: 2 !important;
    border-left: 1px solid #e2e8f0 !important;
    padding-left: 24px !important;
    position: sticky !important;
    top: 24px !important;
}

/* --- PDF / galley button: clean crimson pill --- */
.obj_article_details .entry_details .galleys_links {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 4px 0 !important;
}
.obj_article_details .entry_details .galleys_links li {
    margin-bottom: 8px !important;
}
.obj_article_details .entry_details a.obj_galley_link,
.obj_article_details .entry_details a.obj_galley_link.pdf {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background-color: #7A1C1C !important;
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    padding: 8px 18px !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
}
.obj_article_details .entry_details a.obj_galley_link:hover,
.obj_article_details .entry_details a.obj_galley_link.pdf:hover {
    background-color: #111111 !important;
    color: #ffffff !important;
}

/* --- Author names --- */
.obj_article_details .authors li {
    list-style: none !important;
    margin-bottom: 10px !important;
}
.obj_article_details .authors .name {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    color: #1F4382 !important;
    display: block !important;
}
.obj_article_details .authors .affiliation {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    color: #64748b !important;
    display: block !important;
    margin-top: 2px !important;
}
.obj_article_details .authors .affiliation a svg { display: none !important; }
.obj_article_details .authors .userGroup { display: none !important; }

/* --- Keywords --- */
.obj_article_details .item.keywords {
    margin: 22px 0 !important;
    padding: 14px 18px !important;
    background: #F4F6FA !important;
    border-left: 3px solid #1F4382 !important;
    border-radius: 0 4px 4px 0 !important;
}
.obj_article_details .item.keywords .label {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.12em !important;
    color: #7A1C1C !important;
    margin: 0 0 8px 0 !important;
    display: block !important;
}
.obj_article_details .item.keywords .value {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 15.5px !important;
    color: #334155 !important;
    line-height: 1.5 !important;
}

/* --- Abstract --- */
.obj_article_details .item.abstract .label {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.12em !important;
    color: #7A1C1C !important;
    border-bottom: 2.5px solid #7A1C1C !important;
    padding-bottom: 8px !important;
    margin-bottom: 20px !important;
    display: block !important;
}
.obj_article_details .item.abstract p,
.obj_article_details .abstract .value p {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 18px !important;
    line-height: 1.8 !important;
    color: #1a1a1a !important;
    text-align: justify !important;
    text-justify: inter-word !important;
    margin: 0 0 16px 0 !important;
}

/* --- Author bios: clean, legible, less cluttered --- */
.obj_article_details .item.author_bios {
    margin-top: 36px !important;
    border-top: 1px solid #e2e8f0 !important;
    padding-top: 24px !important;
}
.obj_article_details .item.author_bios > .label {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.12em !important;
    color: #7A1C1C !important;
    border-bottom: 2.5px solid #7A1C1C !important;
    padding-bottom: 8px !important;
    margin-bottom: 20px !important;
    display: block !important;
    border-top: none !important;
}
.obj_article_details .item.author_bios .sub_item {
    margin-bottom: 20px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid #e2e8f0 !important;
}
.obj_article_details .item.author_bios .sub_item:last-child {
    border-bottom: none !important;
}
.obj_article_details .item.author_bios .sub_item .label {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    color: #1F4382 !important;
    border: none !important;
    padding: 0 !important;
    margin-bottom: 5px !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    display: block !important;
}
.obj_article_details .item.author_bios .sub_item .value p {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 15.5px !important;
    color: #334155 !important;
    line-height: 1.65 !important;
    margin: 0 !important;
    font-style: italic !important;
}

/* --- Right rail: entry_details labels & values --- */
.obj_article_details .entry_details .item {
    margin-bottom: 20px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid #e2e8f0 !important;
}
.obj_article_details .entry_details .item:last-child {
    border-bottom: none !important;
}
.obj_article_details .entry_details .label {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.14em !important;
    color: #94a3b8 !important;
    display: block !important;
    margin-bottom: 5px !important;
}
.obj_article_details .entry_details .value,
.obj_article_details .entry_details .value a {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 14px !important;
    color: #1a1a1a !important;
    line-height: 1.5 !important;
}
.obj_article_details .entry_details .value a {
    color: #1F4382 !important;
    text-decoration: none !important;
}
.obj_article_details .entry_details .value a:hover {
    text-decoration: underline !important;
}

/* --- Citation output text --- */
.obj_article_details .entry_details #citationOutput,
.obj_article_details .entry_details .csl-bib-body,
.obj_article_details .entry_details .csl-entry {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
    color: #334155 !important;
}

/* --- More Citation Formats button: single clean border, no double outline --- */
.obj_article_details .citation_formats_button {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    border: 1px solid #DDE3EE !important;
    border-radius: 4px !important;
    padding: 7px 12px !important;
    background: #F4F6FA !important;
    color: #334155 !important;
    cursor: pointer !important;
    margin-top: 10px !important;
    width: 100% !important;
    box-shadow: none !important;
    outline: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    display: block !important;
    text-align: left !important;
}
.obj_article_details .citation_formats_button:focus {
    outline: none !important;
    border-color: #1F4382 !important;
    box-shadow: none !important;
}

/* Downloads chart */
.obj_article_details .item.downloads_chart canvas {
    max-width: 100% !important;
    height: auto !important;
}

/* Mobile: stack to single column */
@media (max-width: 900px) {
    .obj_article_details .row {
        flex-direction: column !important;
        gap: 0 !important;
    }
    .obj_article_details .main_entry,
    .obj_article_details .entry_details {
        width: 100% !important;
        flex: none !important;
        min-width: 0 !important;
        border-left: none !important;
        padding-left: 0 !important;
        position: static !important;
    }
    .obj_article_details .entry_details {
        border-top: 2px solid #e2e8f0 !important;
        padding-top: 24px !important;
        margin-top: 24px !important;
    }
    .page_article .page_title,
    .obj_article_details .page_title {
        font-size: 24px !important;
    }
}

/* =======================================================
   INLINE GALLEY READER
   When an article has an HTML galley (class .nujs-galley-body
   added to a div in OJS's HTML galley field), this makes it
   render as a clean blog/longform reading experience.
   Footnote superscripts with data-fn="N" show a hover popup
   containing the footnote text (added via JS in footer script).
   ======================================================= */
.nujs-galley-reader {
    max-width: 680px !important;
    margin: 50px auto 80px auto !important;
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 19px !important;
    line-height: 1.8 !important;
    color: #1a1a1a !important;
}
.nujs-galley-reader h1 {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 38px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    margin: 0 0 12px 0 !important;
    color: #111 !important;
}
.nujs-galley-reader h2 {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 26px !important;
    font-weight: 600 !important;
    margin: 48px 0 14px 0 !important;
    color: #111 !important;
    border-bottom: 1px solid #e2e8f0 !important;
    padding-bottom: 8px !important;
}
.nujs-galley-reader h3 {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    margin: 36px 0 10px 0 !important;
    color: #7A1C1C !important;
}
.nujs-galley-reader p {
    margin: 0 0 22px 0 !important;
    text-align: justify !important;
}
.nujs-galley-reader blockquote {
    border-left: 3px solid #1F4382 !important;
    margin: 28px 0 28px 0 !important;
    padding: 6px 0 6px 24px !important;
    font-style: italic !important;
    color: #334155 !important;
}

/* Footnote superscripts */
.nujs-fn-ref {
    font-size: 0.65em !important;
    vertical-align: super !important;
    color: #7A1C1C !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    position: relative !important;
    text-decoration: none !important;
    font-family: 'Montserrat', sans-serif !important;
}
/* Hover popup tooltip */
.nujs-fn-ref::after {
    content: attr(data-fn-text) !important;
    display: none !important;
    position: absolute !important;
    bottom: 125% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: #1a1a1a !important;
    color: #f8f8f8 !important;
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    font-style: normal !important;
    line-height: 1.55 !important;
    padding: 12px 16px !important;
    border-radius: 6px !important;
    width: 340px !important;
    z-index: 1000 !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.25) !important;
    white-space: normal !important;
    pointer-events: none !important;
    vertical-align: baseline !important;
}
.nujs-fn-ref:hover::after {
    display: block !important;
}
/* Small triangle pointer */
.nujs-fn-ref::before {
    content: '' !important;
    display: none !important;
    position: absolute !important;
    bottom: calc(125% - 6px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    border: 6px solid transparent !important;
    border-top-color: #1a1a1a !important;
    z-index: 1001 !important;
    pointer-events: none !important;
}
.nujs-fn-ref:hover::before {
    display: block !important;
}

/* Footnotes list at bottom of galley */
.nujs-galley-footnotes {
    margin-top: 60px !important;
    padding-top: 28px !important;
    border-top: 2px solid #e2e8f0 !important;
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
    color: #334155 !important;
}
.nujs-galley-footnotes h2 {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.14em !important;
    color: #7A1C1C !important;
    margin: 0 0 16px 0 !important;
}
.nujs-galley-footnotes ol {
    padding-left: 20px !important;
    margin: 0 !important;
}
.nujs-galley-footnotes li {
    margin-bottom: 8px !important;
    padding-left: 4px !important;
}

/* =======================================================
   CURRENT ISSUE HERO BAND — Full-width sliding carousel
   Replaces the rectangular blob. Spans edge-to-edge,
   very slight rounding (4px only), animated gradient
   matching the newsletter/editors-pick band.
   Auto-advances left→right every 5s, same mechanic as
   the editors pick slider.
   ======================================================= */

/* The band container — injected by JS as #nujs-hero-band */
#nujs-hero-band {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    left: auto !important;
    right: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 24px !important;
    margin-bottom: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    border-radius: 4px !important;
    background-image: linear-gradient(135deg, #122C5E 0%, #1a4a72 25%, #1e6b7a 55%, #3a9a8a 78%, #6DBDAE 100%) !important;
    background-size: 250% 250% !important;
    animation: bandGradientShift 9s ease infinite !important;
    order: 1 !important;
}

/* The sliding viewport — clips overflow so only one slide shows */
#nujs-hero-band .nhb-viewport {
    width: 100% !important;
    overflow: hidden !important;
    position: relative !important;
}

/* The track — all slides in a row, moves via transform */
#nujs-hero-band .nhb-track {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    transition: transform 0.65s cubic-bezier(0.25, 1, 0.5, 1) !important;
    will-change: transform !important;
}

/* Each slide — full band width */
#nujs-hero-band .nhb-slide {
    min-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    padding: 48px 60px !important;
    gap: 60px !important;
}

/* Left column: logo + volume label */
#nujs-hero-band .nhb-left {
    flex: 0 0 220px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    border-right: 1px solid rgba(255,255,255,0.25) !important;
    padding-right: 60px !important;
}

#nujs-hero-band .nhb-logo {
    font-family: 'EB Garamond', 'Cormorant Garamond', Georgia, serif !important;
    font-size: 62px !important;
    font-weight: 500 !important;
    color: #ffffff !important;
    line-height: 0.9 !important;
    letter-spacing: -0.01em !important;
    text-align: center !important;
    display: block !important;
    text-decoration: none !important;
}

#nujs-hero-band .nhb-logo span {
    display: block !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    letter-spacing: 0.28em !important;
    margin-top: 8px !important;
    font-family: 'Montserrat', sans-serif !important;
    text-transform: uppercase !important;
    opacity: 0.85 !important;
}

#nujs-hero-band .nhb-vol {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 0.2em !important;
    text-transform: uppercase !important;
    color: #6DBDAE !important;
    margin-top: 18px !important;
    text-align: center !important;
    white-space: nowrap !important;
}

/* Right column: article content */
#nujs-hero-band .nhb-right {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
}

#nujs-hero-band .nhb-tag {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0.2em !important;
    text-transform: uppercase !important;
    color: #6DBDAE !important;
    margin-bottom: 16px !important;
    display: block !important;
}

#nujs-hero-band .nhb-title {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    line-height: 1.25 !important;
    margin: 0 0 12px 0 !important;
    text-decoration: none !important;
    display: block !important;
}

#nujs-hero-band .nhb-title:hover {
    color: #6DBDAE !important;
}

#nujs-hero-band .nhb-author {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 17px !important;
    font-style: italic !important;
    color: #6DBDAE !important;
    margin: 0 0 16px 0 !important;
    display: block !important;
}

#nujs-hero-band .nhb-abstract {
    font-family: 'EB Garamond', Georgia, serif !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
    color: rgba(255,255,255,0.82) !important;
    margin: 0 0 24px 0 !important;
    display: block !important;
    max-width: 680px !important;
}

#nujs-hero-band .nhb-read {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    color: #ffffff !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    border-bottom: 1.5px solid rgba(255,255,255,0.4) !important;
    padding-bottom: 3px !important;
    transition: color 0.2s ease, border-color 0.2s ease !important;
}

#nujs-hero-band .nhb-read:hover {
    color: #6DBDAE !important;
    border-color: #6DBDAE !important;
}

#nujs-hero-band .nhb-read svg {
    transition: transform 0.2s ease !important;
}

#nujs-hero-band .nhb-read:hover svg {
    transform: translateX(3px) !important;
}

/* Dot navigator */
#nujs-hero-band .nhb-dots {
    display: flex !important;
    gap: 8px !important;
    justify-content: center !important;
    padding: 0 0 22px 0 !important;
}

#nujs-hero-band .nhb-dot {
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.3) !important;
    cursor: pointer !important;
    transition: background 0.3s ease, transform 0.3s ease !important;
    border: none !important;
    padding: 0 !important;
}

#nujs-hero-band .nhb-dot.active {
    background: #ffffff !important;
    transform: scale(1.4) !important;
}

/* Prev/next arrow buttons */
#nujs-hero-band .nhb-prev,
#nujs-hero-band .nhb-next {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-60%) !important;
    width: 40px !important;
    height: 40px !important;
    background: rgba(255,255,255,0.12) !important;
    border: 1px solid rgba(255,255,255,0.25) !important;
    border-radius: 50% !important;
    color: #ffffff !important;
    font-size: 16px !important;
    cursor: pointer !important;
    z-index: 10 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background 0.2s ease !important;
    padding: 0 !important;
}

#nujs-hero-band .nhb-prev:hover,
#nujs-hero-band .nhb-next:hover {
    background: rgba(255,255,255,0.22) !important;
}

#nujs-hero-band .nhb-prev { left: 14px !important; }
#nujs-hero-band .nhb-next { right: 14px !important; }

/* Slide counter pill */
#nujs-hero-band .nhb-counter {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 0.1em !important;
    color: rgba(255,255,255,0.5) !important;
    text-align: right !important;
    padding: 0 20px 18px 0 !important;
}

/* Responsive */
@media (max-width: 767px) {
    #nujs-hero-band .nhb-slide {
        flex-direction: column !important;
        padding: 32px 24px !important;
        gap: 28px !important;
    }
    #nujs-hero-band .nhb-left {
        border-right: none !important;
        border-bottom: 1px solid rgba(255,255,255,0.2) !important;
        padding-right: 0 !important;
        padding-bottom: 28px !important;
        flex: none !important;
        width: 100% !important;
    }
    #nujs-hero-band .nhb-logo { font-size: 42px !important; }
    #nujs-hero-band .nhb-title { font-size: 22px !important; }
}


/* nhb-footer: flex row holding dots + counter */
#nujs-hero-band .nhb-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 20px 18px 20px !important;
}

/* =======================================================
   HIDE PARTICIPANTS PANEL — AUTHOR & EDITOR VIEWS
   Targets the exact data-cy="participant-manager" container
   confirmed from DOM inspection. Hides on both the author
   dashboard and editorial workflow pages.
   ======================================================= */
[data-cy="participant-manager"] {
    display: none !important;
}