/*
 * OWS Dashboard 3.10.426.0
 *
 * Homepage "Articles" tabs: Published (current issue) / Articles in
 * Press / Most Viewed. Pure CSS radio-driven tabs (no JavaScript),
 * mirroring the same visual language as the journal's own uploaded
 * Journal Details/Instruction for Authors tab widget
 * (public/journals/<id>/styleSheet.css) so the homepage reads as one
 * consistent design, without editing that journal-managed asset.
 */

/*
 * Palette tokens. Defaults match the approved reference design; when a
 * journal manager uploads a cover image via the "Homepage Sidebar"
 * dashboard tab, frontendHomepageCover.js overrides --ows-primary on
 * :root with a color sampled from that image (SidebarSettingsHandler.php
 * averages it server-side at upload time), and every tint/shade below
 * recomputes from it via color-mix() - so the whole page's teal recolors
 * from the cover instead of staying hardcoded to one fixed palette.
 */
:root {
    --ows-primary: #0d3b36;
    --ows-primary-light: color-mix(in srgb, var(--ows-primary) 75%, #2f8f7f 25%);
    --ows-mint: color-mix(in srgb, var(--ows-primary) 8%, white 92%);
    --ows-mint-soft: color-mix(in srgb, var(--ows-primary) 3%, white 97%);
    --ows-mint-border: color-mix(in srgb, var(--ows-primary) 16%, white 84%);
    --ows-mint-hover: color-mix(in srgb, var(--ows-primary) 28%, white 72%);
    --ows-accent: #b9772f;
    --ows-accent-soft: #f6e9da;

    /*
     * Rounded-card design tokens (approved 2nd-pass reference mockup:
     * D:/Storage/homepageredesign.html). This supersedes the earlier
     * "crisp 3px, no large rounded cards" pass below - every card-like
     * surface on the page now uses these instead of a bare 3px radius.
     */
    --ows-radius-lg: 16px;
    --ows-radius-md: 14px;
    --ows-radius-sm: 10px;
    --ows-shadow: 0 1px 2px rgba(13, 59, 54, 0.06), 0 8px 24px rgba(13, 59, 54, 0.05);
}

.ows_articles_tabs {
    margin: 2rem 0;
}

.ows_articles_tabs__input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

/*
 * Pill segmented control (reference mockup .article-tabs), not the
 * earlier thin-underline tab bar - still pure CSS/radio-driven, no
 * JavaScript: each label gets its own background/shadow when its radio
 * is checked (see further down), rather than a separately positioned
 * sliding pill div.
 */
.ows_articles_tabs__nav {
    display: flex;
    position: relative;
    background: var(--ows-mint-soft);
    border: 1px solid var(--ows-mint-border);
    border-radius: var(--ows-radius-sm);
    padding: 4px;
    gap: 4px;
    width: max-content;
    max-width: 100%;
}

/*
 * Content-sized labels (flex: 0 0 auto), not equal-width columns - the
 * three labels are different lengths ("Published" vs "Articles in
 * Press"), and forcing equal-width columns to fit the longest one left
 * visibly lopsided padding around the two shorter labels. The active
 * label gets its own white pill background directly (see the :checked
 * rule below) instead of a separately positioned/sized sliding div -
 * that div's percentage-based left/width math is what depended on the
 * equal-width assumption in the first place, so it's retired along with it.
 */
.ows_articles_tabs__label {
    flex: 0 0 auto;
    padding: 0.6rem 1rem;
    text-align: center;
    color: #5c716b;
    font-size: 13px;
    font-weight: bold;
    cursor: pointer;
    border-radius: 8px;
    transition: color 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
    white-space: nowrap;
}

.ows_articles_tabs__activeSlide {
    display: none;
}

#ows_articles_published:checked ~ .ows_articles_tabs__nav .ows_articles_tabs__label--published,
#ows_articles_inpress:checked ~ .ows_articles_tabs__nav .ows_articles_tabs__label--inpress,
#ows_articles_mostviewed:checked ~ .ows_articles_tabs__nav .ows_articles_tabs__label--mostviewed {
    color: var(--ows-primary);
    background-color: #ffffff;
    box-shadow: var(--ows-shadow);
}

/*
 * Outer card (reference mockup .article-card): one constant white,
 * rounded, shadowed box - the radio-toggled panels inside only swap
 * their own content/visibility, the card boundary around them stays put.
 */
.ows_articles_tabs__panels {
    margin-top: 14px;
    background-color: #ffffff;
    border: 1px solid var(--ows-mint-border);
    border-radius: var(--ows-radius-md);
    box-shadow: var(--ows-shadow);
    overflow: hidden;
}

.ows_articles_tabs__panel {
    display: none;
    padding: 0.4rem 20px;
}

#ows_articles_published:checked ~ .ows_articles_tabs__panels .ows_articles_tabs__panel--published,
#ows_articles_inpress:checked ~ .ows_articles_tabs__panels .ows_articles_tabs__panel--inpress,
#ows_articles_mostviewed:checked ~ .ows_articles_tabs__panels .ows_articles_tabs__panel--mostviewed {
    display: block;
}

.ows_articles_tabs__item {
    padding: 0.9rem 0;
    border-bottom: 3px solid var(--ows-accent);
}

.ows_articles_tabs__item + .ows_articles_tabs__item {
    border-top: 1px solid #eef1f5;
    border-bottom: none;
}

.ows_articles_tabs__item:last-child {
    border-bottom: none;
}

.ows_articles_tabs__item .title {
    margin: 0 0 4px;
    font-size: 15.5px;
    font-weight: 700;
    line-height: 1.4;
}

.ows_articles_tabs__item .title a {
    color: var(--ows-primary);
    text-decoration: none;
}

.ows_articles_tabs__item .title a:hover {
    text-decoration: underline;
}

.ows_articles_tabs__item .authors {
    color: #5c716b;
    font-size: 13px;
    margin-bottom: 4px;
}

/*
 * DOI badge (reference mockup .article-doi .dot): a small circular
 * letter badge before the link. The native Published tab gets a real
 * uploaded icon image from the doiInSummary plugin (see article_summary
 * rules above); these Articles in Press/Most Viewed rows are this
 * plugin's own markup (indexJournal.tpl) with a plain text link, so the
 * same badge look is drawn here in CSS instead.
 */
.ows_articles_tabs__item .doi {
    display: flex;
    align-items: center;
    gap: 6px;
}

.ows_articles_tabs__item .doi::before {
    content: "D";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--ows-accent-soft);
    color: var(--ows-accent);
    font-size: 9px;
    font-weight: 900;
}

.ows_articles_tabs__item .doi a {
    color: var(--ows-accent);
    font-size: 12.5px;
    text-decoration: none;
}

.ows_articles_tabs__item .views {
    margin-top: 4px;
    color: #5c716b;
    font-size: 12px;
}

.ows_articles_tabs__empty {
    color: #5c716b;
    font-style: italic;
    padding: 1.5rem 0;
    text-align: center;
}

/* ==========================================================
 * OWS Dashboard 3.10.409.0 - full homepage redesign pass
 *
 * Palette: pine teal (var(--ows-primary)) + warm amber accent (var(--ows-accent)) on white/
 * mint. Originally built with a crisp flat 3px radius everywhere; the
 * 3.10.420.0 pass further down superseded that with the shared radius and
 * shadow tokens (rounded, shadowed cards) to match the approved
 * 2nd-pass reference mockup (D:/Storage/homepageredesign.html).
 * ========================================================== */

/* ---------- "About the Journal" hero ---------- */
.homepage_about {
    background: linear-gradient(135deg, var(--ows-mint), var(--ows-mint-soft));
    border: 1px solid var(--ows-mint-border);
    border-radius: var(--ows-radius-lg);
    padding: 1.6rem 1.8rem;
    margin-bottom: 1.5rem;
}

.homepage_about h2 {
    color: var(--ows-primary);
    font-size: 1.3rem;
    margin-top: 0;
}

/*
 * ---------- Native "Journal Details/Instruction for Authors/..." tabs ----------
 * The reference mockup renders this whole block as its own white, rounded,
 * shadowed card (.tabs-card) below the hero - previously this container was
 * forced transparent with no card boundary of its own, so the four tabs and
 * their info cards just floated on the bare page background.
 */
html body .container_tabs {
    background-color: #ffffff !important;
    border: 1px solid var(--ows-mint-border);
    border-radius: var(--ows-radius-lg) !important;
    box-shadow: var(--ows-shadow);
    height: auto !important;
    padding: 6px 20px 20px !important;
    margin-top: 20px;
    display: block !important;
}

html body .section_tabs nav label {
    color: #5c716b !important;
    border-bottom-color: var(--ows-mint-border) !important;
}

html body .section_tabs input#journal_details:checked ~ nav label.journal_details,
html body .section_tabs input#instruction_for_authors:checked ~ nav label.instruction_for_authors,
html body .section_tabs input#journal_policy:checked ~ nav label.journal_policy,
html body .section_tabs input#associated_journals:checked ~ nav label.associated_journals {
    color: var(--ows-primary) !important;
}

/*
 * .active_slide is a highlight pill positioned exactly over the active
 * label (same rect, same native z-index) and painted after it in DOM
 * order, so giving it an opaque background here without also lifting
 * the label above it hid the label's own text entirely. Pin the slide
 * behind and the label text in front instead.
 */
html body .active_slide {
    background-color: var(--ows-mint) !important;
    border-bottom-color: var(--ows-primary) !important;
    border-radius: 3px !important;
    z-index: 1 !important;
}

html body .section_tabs nav label {
    position: relative !important;
    z-index: 2 !important;
}

/*
 * The reference mockup uses flat rectangular info cards for
 * Details/Scope/Metrics/Instruction for Authors/Journal Policy (icon +
 * title + optional subtitle), not the round badges from an earlier pass.
 * All four tabs are now dashboard-driven lists of an arbitrary number of
 * cards (see indexJournal.tpl), so their shells share one generic set of
 * selectors (.nav_card / .author_card / .policy_card) instead of the
 * fixed-count "_one/_two/_three" classes a hardcoded three-card markup
 * used to need. The journal's own uploaded stylesheet has no competing
 * border-radius on these specific selectors, so this can restyle them
 * directly without an !important war.
 */
/*
 * Grid, not flex: with flex-wrap, a row that doesn't evenly divide by
 * the flex-basis (e.g. 3 cards where only 2 fit per row) leaves the
 * last card alone on its own row, where flex-grow stretches/centers it
 * oddly instead of lining up with the cards above it. A grid with
 * auto-fit/minmax columns always fills each row with equal-width
 * columns - 3 across when there's room, collapsing to a single column
 * on narrow viewports - and still works for however many cards a
 * manager adds from the dashboard, not just a fixed count of 3.
 */
html body .container_nav,
html body .container_authors,
html body .container_policy {
    background-color: transparent !important;
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
}

html body .container_nav .nav_card,
html body .container_authors .author_card,
html body .container_policy .policy_card {
    background-color: var(--ows-mint-soft) !important;
    border: 1px solid var(--ows-mint-border) !important;
    border-radius: var(--ows-radius-sm) !important;
    padding: 16px !important;
    height: auto !important;
    width: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    box-shadow: none;
}

/* Icon circle (left) + title/subtitle stack (right), horizontal row */
html body .nav_card .one,
html body .author_card .one,
html body .policy_card .one {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 14px;
    width: 100%;
}

html body .nav_card img,
html body .author_card img,
html body .policy_card img {
    height: 22px !important;
    width: 22px !important;
    object-fit: contain;
    flex-shrink: 0;
    background-color: var(--ows-mint-border);
    border-radius: 50%;
    padding: 13px;
    box-sizing: content-box;
}

html body .nav_card .one > a,
html body .author_card .one > a,
html body .policy_card .one > a {
    display: flex;
    flex-direction: column;
    text-decoration: none !important;
}

html body .nav_card h2,
html body .author_card h2,
html body .policy_card h2 {
    color: var(--ows-primary) !important;
    font-size: 15px !important;
    margin: 0 !important;
    text-align: left !important;
}

.ows_nav_card_subtitle {
    display: block;
    color: #5c716b;
    font-size: 12px;
    font-weight: 400;
    margin-top: 2px;
}

/*
 * "Associated Journals" logos - unlike the three card tabs above, these
 * were never a title/icon card, just a linked partner-journal cover
 * image, so they only need a plain row layout rather than the shared
 * card treatment.
 */
html body .container_images {
    background-color: transparent !important;
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px;
}

html body .container_images .img_item img {
    max-height: 90px;
    max-width: 160px;
    object-fit: contain;
}

/* ---------- Native "Indexing and Abstracting" sidebar block ---------- */
.indexing {
    position: relative;
    display: block;
    margin: 0 0 18px;
    padding: 1px 0 1px 14px;
    color: #09131f;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: 0.045em;
    text-transform: uppercase;
    border: 0 !important;
    border-bottom: 0 !important;
}

/* 3.10.450.0: explicitly suppress any legacy/theme underline that may be
 * attached to the Indexing & Abstracting heading. The only accent left is
 * the vertical bar on the physical left side. */
.indexing::after {
    content: none !important;
    display: none !important;
    border: 0 !important;
    background: none !important;
}

.indexing::before {
    content: '';
    position: absolute;
    left: 0;
    top: 2px;
    bottom: 2px;
    width: 3px;
    border-radius: 0;
    background: var(--ows-accent);
}

/*
 * The logo links are siblings of .indexing (not its children - see
 * enhanceIndexingLabels() in frontendHomepageCover.js), so they're
 * targeted here via the .ows_indexing_link class that script adds.
 */
.ows_indexing_link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 14px;
    border: 1px solid #dbe5e1;
    border-radius: 4px;
    text-decoration: none;
    background: #ffffff;
    margin-top: 12px;
    box-shadow: 0 1px 2px rgba(13, 59, 54, 0.06), 0 4px 12px rgba(13, 59, 54, 0.05);
}

.ows_indexing_link:hover,
.ows_indexing_link:focus-visible {
    border-color: color-mix(in srgb, var(--ows-accent) 28%, white 72%);
    box-shadow: 0 1px 2px rgba(13, 59, 54, 0.06), 0 6px 14px rgba(13, 59, 54, 0.08);
}

.ows_indexing_link img {
    display: block;
    width: 84px;
    max-width: 84px;
    height: 42px;
    max-height: 42px;
    padding: 5px 8px;
    border: 1px solid #edf1ef;
    border-radius: 4px;
    background: #ffffff;
    object-fit: contain;
    flex-shrink: 0;
}

/*
 * The "REA" cover-ad banner (.cover_sidebar) advertises a different
 * journal in this family (Intelligent Decision and Computational
 * Modelling) - it isn't in the approved reference mockup and doesn't
 * belong on this journal's homepage, same reasoning as the removed
 * "Editorial Board" flip-card banner.
 */
.cover_sidebar {
    display: none !important;
}

.ows_indexing_label {
    color: #5c716b;
    font-weight: 700;
    font-size: 13.5px;
    text-transform: none;
    letter-spacing: normal;
    line-height: 1.3;
}

/* ==========================================================
 * OWS Dashboard 3.10.411.0 - reference-mockup alignment pass
 *
 * Matches the approved teal/mint/amber reference exactly: one unified
 * dark journal card (was two separate cover/info panels), a visible
 * header brand mark, flat/iconic left nav, mint Keywords chips, an
 * "About the Journal" hero with kicker + CTA + decorative circles, and
 * rectangular Details/Scope/Metrics cards instead of circular badges.
 * ========================================================== */

/*
 * Unified journal card: an upper "cover" zone (decorative pattern, or
 * a real admin-uploaded cover image when set) and a lower solid dark
 * zone with icon + label/value rows - matches the approved reference
 * (a single card reading as an actual journal cover + spec sheet).
 */
.ows_journal_card {
    display: flex;
    flex-direction: column;
    border-radius: var(--ows-radius-lg);
    overflow: hidden;
    margin-bottom: 14px;
    box-shadow: var(--ows-shadow);
}

.ows_journal_card__cover {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 6px;
    padding: 20px 18px;
    min-height: 130px;
    color: var(--ows-mint-soft);
    background:
        radial-gradient(circle at 15% 20%, rgba(243, 249, 246, 0.08) 0, rgba(243, 249, 246, 0.08) 2px, transparent 2px),
        linear-gradient(135deg, var(--ows-primary), var(--ows-primary-light));
    background-size: 18px 18px, cover;
}

/* Real uploaded cover: shown in full at its natural aspect ratio - no crop. */
.ows_journal_card__coverImage {
    line-height: 0;
}

.ows_journal_card__coverImage img {
    display: block;
    width: 100%;
    height: auto;
}

.ows_journal_card__caption {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 18px;
    background: var(--ows-primary);
    color: var(--ows-mint-soft);
}

.ows_journal_card__caption .ows_journal_card__kicker,
.ows_journal_card__caption .ows_journal_card__title {
    position: static;
}

.ows_journal_card__kicker {
    position: relative;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.75;
}

.ows_journal_card__title {
    position: relative;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.3;
}

.ows_journal_card__rows {
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: var(--ows-primary);
    padding: 16px 18px;
}

.ows_journal_card__row {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12.5px;
}

.ows_journal_card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    flex-shrink: 0;
    color: var(--ows-mint-hover);
}

.ows_journal_card__icon svg {
    width: 16px;
    height: 16px;
}

.ows_journal_card__text {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.ows_journal_card__label {
    color: var(--ows-mint-hover);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: 0.04em;
}

.ows_journal_card__value {
    color: #ffffff;
    font-weight: 700;
}

/*
 * Header: white bg only. The approved reference keeps the site's real
 * REA logo + name (native markup, untouched) - an earlier pass had
 * replaced it with a generated per-journal "CSI" mark, which the
 * user's fuller reference screenshot shows is wrong; reverted.
 */
html body .pkp_structure_head {
    background-color: #ffffff !important;
    background-image: none !important;
    border-bottom: 1px solid var(--ows-mint-border);
}

html body .pkp_site_nav_toggle {
    color: var(--ows-primary) !important;
}

/*
 * Header's Home/Search icon buttons (.box-new, journal-authored markup)
 * use the same stray pale-yellow border as .house_left above - recolored
 * to the page's neutral mint border so they read as part of one palette
 * instead of a leftover accent color.
 */
html body .box-new .search-box-new,
html body .box-new .home-box-new {
    border-color: var(--ows-mint-border) !important;
    background-color: #ffffff !important;
}

html body .box-new .fa-search,
html body .box-new .fa-home {
    color: var(--ows-primary) !important;
}

/*
 * The native theme's header nav (top menu, and Register/Login or the
 * logged-in user menu) was styled for the old dark-orange header
 * background - likely white/light text, invisible now that the header
 * is white (same root cause already found and fixed once for the left
 * sidebar's Journal Info/Editors/Reviewers labels). Force dark, visible
 * text/icons here defensively rather than waiting to find it broken.
 */
html body .pkp_site_nav_menu,
html body .pkp_site_nav_menu a,
html body .pkp_navigation_primary_wrapper,
html body .pkp_navigation_primary_wrapper a,
html body .pkp_navigation_user_wrapper,
html body .pkp_navigation_user_wrapper a,
html body .pkp_navigation_user_wrapper button {
    color: var(--ows-primary) !important;
}

html body .pkp_site_nav_menu svg,
html body .pkp_navigation_user_wrapper svg {
    fill: var(--ows-primary) !important;
    stroke: var(--ows-primary) !important;
}

/* ---------- Left sidebar navigation — approved REA flat menu (3.10.433.0) ---------- */
/*
 * The journal's Home/Submit/Guide/Info/Editors/Reviewers/Contact entries are
 * native custom blocks. frontendHomepageCover.js tags only those real rows and
 * injects lightweight line icons; URLs, labels, and accordion inputs stay
 * exactly where OJS/the journal created them.
 */
html body .pkp_structure_sidebar.left .pkp_block.block_custom.ows_sidebar_nav_block {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Retire the old decorative/ribbon icon used only by the previous Home card. */
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .house_left {
    display: none !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_row,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .house_right,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .heaedr_accordion {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    gap: 11px !important;
    width: 100% !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    border: 0 !important;
    border-radius: 6px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #3d504b !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    text-align: left !important;
    transition: background-color .16s ease, color .16s ease !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_row:hover,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_row:focus-within {
    background: var(--ows-mint-soft) !important;
    color: var(--ows-primary) !important;
}

/* Home is the only active row on the journal homepage. */
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block.ows_nav_active .ows_sidebar_nav_row,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block.ows_nav_active .house_right {
    background: var(--ows-mint) !important;
    color: var(--ows-primary) !important;
}

/* Hide legacy bitmap/font icons in these rows; the new inline SVG occupies a
 * consistent 18px icon column like the supplied reference. */
html body .pkp_structure_sidebar.left .ows_sidebar_nav_row > img,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_row > i,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_row > .fa,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_row > .fas,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_row > .far,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_row > svg {
    display: none !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_row::after {
    content: none !important;
    display: none !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px !important;
    color: #5c7470 !important;
}

html body .pkp_structure_sidebar.left .ows_nav_active .ows_sidebar_nav_icon {
    color: var(--ows-primary) !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_icon svg,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_chevron svg {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.75 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_chevron {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 14px !important;
    height: 14px !important;
    flex: 0 0 14px !important;
    margin-left: auto !important;
    color: #607570 !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_row p,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_row a,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_row span:not(.ows_sidebar_nav_icon):not(.ows_sidebar_nav_chevron) {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    color: inherit !important;
    background: transparent !important;
    font: inherit !important;
    text-decoration: none !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_row p,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_row > a {
    min-width: 0 !important;
    flex: 1 1 auto !important;
}

/* Existing dropdown content for Journal Info / Editors / Reviewers remains
 * functional, but loses the old rounded-card shell when opened. */
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion {
    margin: 0 0 2px !important;
    padding: 3px 0 5px 41px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion a {
    display: block !important;
    padding: 6px 8px !important;
    border-radius: 5px !important;
    color: #5c6f6a !important;
    font-size: 12px !important;
    text-decoration: none !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion a:hover,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion a:focus-visible {
    background: var(--ows-mint-soft) !important;
    color: var(--ows-primary) !important;
}

/* ---------- Keywords cloud: mint chips ---------- */
html body .pkp_block.block_keyword_cloud a {
    display: inline-block;
    background: var(--ows-mint) !important;
    color: var(--ows-primary) !important;
    border: 1px solid var(--ows-mint-border);
    border-radius: 999px !important;
    padding: 5px 11px !important;
    font-size: 12px !important;
    text-decoration: none !important;
    margin: 0 6px 6px 0 !important;
}

/*
 * ---------- "About the Journal" hero ----------
 * 3.10.426.0: geometry is matched to the supplied desktop reference.
 * frontendHomepageCover.js supplies only the semantic wrapper/kicker/CTA;
 * the journal's existing description HTML remains the content source.
 */
html body .homepage_about {
    position: relative !important;
    isolation: isolate;
    overflow: hidden !important;
    box-sizing: border-box;
    min-height: 244px;
    margin: 0 0 20px !important;
    padding: 25px 25px 24px !important;
    background: linear-gradient(135deg, #ffffff 0%, color-mix(in srgb, var(--ows-primary, #1a1a1a) 12%, white 88%) 100%) !important;
    border: 1px solid color-mix(in srgb, var(--ows-primary, #1a1a1a) 14%, white 86%) !important;
    border-radius: 16px !important;
    box-shadow: none !important;
    color: #233b35;
}

html body .homepage_about > * {
    position: relative;
    z-index: 2;
}

html body .homepage_about__kicker {
    display: flex;
    align-items: center;
    gap: 7px;
    width: max-content;
    max-width: 100%;
    margin: 0 0 9px !important;
    color: var(--ows-primary) !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    line-height: 1.2;
    letter-spacing: 0.085em !important;
    text-transform: uppercase;
}

html body .homepage_about__kicker::before {
    content: '';
    display: block;
    width: 14px;
    height: 2px;
    flex: 0 0 14px;
    border-radius: 2px;
    background: var(--ows-primary);
}

html body .homepage_about h2,
html body .homepage_about__title {
    max-width: 520px;
    margin: 0 0 12px !important;
    padding: 0 !important;
    color: var(--ows-primary) !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    line-height: 1.18 !important;
    letter-spacing: -0.015em;
}

html body .homepage_about__description {
    max-width: 515px;
    margin: 0 !important;
    color: #263b36 !important;
    font-size: 13px !important;
    line-height: 1.48 !important;
}

html body .homepage_about__description > :first-child {
    margin-top: 0 !important;
}

html body .homepage_about__description > :last-child {
    margin-bottom: 0 !important;
}

html body .homepage_about__description p {
    margin: 0 !important;
    color: inherit !important;
    font-size: inherit !important;
    line-height: inherit !important;
}

html body .homepage_about__description a {
    color: var(--ows-primary) !important;
}

html body .homepage_about__cta {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 35px;
    box-sizing: border-box;
    margin: 15px 0 0 !important;
    padding: 8px 16px 8px 17px !important;
    background: var(--ows-primary, #1a1a1a) !important;
    border: 1px solid var(--ows-primary, #1a1a1a) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    color: #ffffff !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    white-space: nowrap;
}

html body .homepage_about__cta:hover,
html body .homepage_about__cta:focus {
    background: color-mix(in srgb, var(--ows-primary, #1a1a1a) 88%, black 12%) !important;
    border-color: var(--ows-primary, #1a1a1a) !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

html body .homepage_about__cta::after {
    content: '\2192';
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
}

/* Large clipped ring in the upper-right corner of the reference. */
html body .homepage_about::after {
    content: '';
    position: absolute;
    z-index: 1;
    right: -55px;
    top: -66px;
    width: 226px;
    height: 226px;
    box-sizing: content-box;
    border: 20px solid color-mix(in srgb, var(--ows-primary) 12%, transparent 88%);
    border-radius: 50%;
    pointer-events: none;
}

/* Smaller clipped ring at the lower-right, aligned like the reference. */
html body .homepage_about::before {
    content: '';
    position: absolute;
    z-index: 1;
    right: 28px;
    bottom: -70px;
    width: 120px;
    height: 120px;
    box-sizing: content-box;
    border: 12px solid color-mix(in srgb, var(--ows-primary) 10%, transparent 90%);
    border-radius: 50%;
    pointer-events: none;
}

@media (max-width: 760px) {
    html body .homepage_about {
        min-height: 0;
        padding: 22px 20px !important;
    }

    html body .homepage_about__title,
    html body .homepage_about__description {
        max-width: calc(100% - 54px);
    }

    html body .homepage_about::after {
        right: -118px;
        top: -78px;
        transform: scale(0.78);
    }

    html body .homepage_about::before {
        right: -30px;
        bottom: -76px;
        transform: scale(0.78);
    }
}

/*
 * ---------- Published articles list (native issue_toc/article summary) ----------
 * This list now renders inside the same outer .ows_articles_tabs__panels card
 * as the Articles in Press/Most Viewed tabs (see above), so each row uses
 * the shared amber-accent-divider row treatment instead of its own nested
 * white/bordered box - matching the reference mockup's .article-row.
 */
html body .ows_articles_tabs__panel--published .cmp_article_list {
    list-style: none;
    margin: 0;
    padding: 0;
}

html body .ows_articles_tabs__panel--published .cmp_article_list > li {
    padding: 0.9rem 0;
    border-bottom: 3px solid var(--ows-accent);
}

html body .ows_articles_tabs__panel--published .cmp_article_list > li + li {
    border-top: 1px solid #eef1f5;
    border-bottom: none;
}

html body .ows_articles_tabs__panel--published .cmp_article_list > li:last-child {
    border-bottom: none;
}

/*
 * Two-column layout (reference mockup .article-row): title + meta text on
 * the left, the PDF/galley button and page range stacked top-right. The
 * native template's DOM order doesn't match that visual order (the
 * doiInSummary plugin JS-inserts its badge right after the title, ahead
 * of .meta), so every piece is placed on explicit grid lines here rather
 * than relying on source order or flex-wrap - .meta itself is unwrapped
 * with display:contents so its children (.authors/.pages/.published)
 * become independently placeable grid items instead of one fixed block.
 */
html body .ows_articles_tabs__panel--published .obj_article_summary {
    display: grid;
    grid-template-columns: 1fr auto;
    column-gap: 16px;
    row-gap: 4px;
    align-items: start;
}

html body .ows_articles_tabs__panel--published .obj_article_summary .meta {
    display: contents;
}

html body .ows_articles_tabs__panel--published .obj_article_summary .title {
    grid-column: 1;
    grid-row: 1;
    margin: 0;
    font-size: 15.5px;
    font-weight: 700;
    line-height: 1.4;
}

html body .ows_articles_tabs__panel--published .obj_article_summary .title a {
    color: var(--ows-primary);
    text-decoration: none;
}

html body .ows_articles_tabs__panel--published .obj_article_summary .title a:hover {
    text-decoration: underline;
}

html body .ows_articles_tabs__panel--published .obj_article_summary .authors {
    grid-column: 1;
    grid-row: 2;
    color: #5c716b;
    font-size: 13px;
}

html body .ows_articles_tabs__panel--published .obj_article_summary .published {
    grid-column: 1;
    grid-row: 4;
    color: #5c716b;
    font-size: 12px;
}

html body .ows_articles_tabs__panel--published .obj_article_summary .doiInSummary {
    grid-column: 1 / -1;
    grid-row: 3;
    display: flex;
    align-items: center;
    gap: 6px;
}

html body .ows_articles_tabs__panel--published .obj_article_summary .doiInSummary a {
    color: var(--ows-accent);
    font-size: 12.5px;
    text-decoration: none;
}

html body .ows_articles_tabs__panel--published .obj_article_summary .galleys_links {
    grid-column: 2;
    grid-row: 1;
    list-style: none;
    margin: 0;
    padding: 0;
    justify-self: end;
}

html body .ows_articles_tabs__panel--published .obj_article_summary .pages {
    grid-column: 2;
    grid-row: 2;
    justify-self: end;
    color: #5c716b;
    font-size: 12px;
}

html body .ows_articles_tabs__panel--published .obj_article_summary .galleys_links a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--ows-mint);
    color: var(--ows-primary);
    border: 1px solid var(--ows-mint-border);
    font-weight: 700;
    font-size: 12px;
    text-decoration: none;
    padding: 7px 12px;
    border-radius: 999px;
    white-space: nowrap;
}

html body .ows_articles_tabs__panel--published .obj_article_summary .galleys_links a.pdf::before {
    content: "";
    width: 13px;
    height: 13px;
    flex-shrink: 0;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M6 3h9l3 3v15H6z'/%3E%3Cpath d='M9 13h6M9 17h6'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M6 3h9l3 3v15H6z'/%3E%3Cpath d='M9 13h6M9 17h6'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ==========================================================
 * OWS Dashboard 3.10.429.0 - homepage journal information tabs
 * Reference match for the section immediately below the About hero.
 * This pass is intentionally scoped to the existing native/custom
 * .container_tabs / .section_tabs markup and changes presentation only.
 * ========================================================== */

/* White framed panel shown in the supplied reference. */
html body .container_tabs {
    box-sizing: border-box !important;
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 0 20px !important;
    padding: 0 19px 18px !important;
    overflow: hidden !important;
    background: #ffffff !important;
    border: 1px solid color-mix(in srgb, var(--ows-primary) 12%, white 88%) !important;
    border-radius: 14px !important;
    box-shadow: 0 1px 2px rgba(13, 59, 54, 0.05), 0 8px 20px rgba(13, 59, 54, 0.045) !important;
}

html body .container_tabs .section_tabs {
    width: 100% !important;
    min-width: 0 !important;
}

/* Flat text tab bar with one thin active underline. */
html body .container_tabs .section_tabs > nav,
html body .container_tabs .section_tabs nav {
    position: relative !important;
    display: flex !important;
    align-items: stretch !important;
    gap: 28px !important;
    width: 100% !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid #e3ebe8 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    scrollbar-width: none;
}

html body .container_tabs .section_tabs nav::-webkit-scrollbar {
    display: none;
}

html body .container_tabs .section_tabs nav label {
    position: relative !important;
    z-index: 2 !important;
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    width: auto !important;
    height: 58px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 2px 1px 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: #4d5e59 !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    white-space: nowrap !important;
    cursor: pointer;
}

/* Retire the old moving/highlight pill; the selected label itself draws
 * the exact short underline from the reference. */
html body .container_tabs .active_slide {
    display: none !important;
}

html body .container_tabs .section_tabs input#journal_details:checked ~ nav label.journal_details,
html body .container_tabs .section_tabs input#instruction_for_authors:checked ~ nav label.instruction_for_authors,
html body .container_tabs .section_tabs input#journal_policy:checked ~ nav label.journal_policy,
html body .container_tabs .section_tabs input#associated_journals:checked ~ nav label.associated_journals {
    color: var(--ows-primary) !important;
    font-weight: 700 !important;
    box-shadow: inset 0 -2px 0 var(--ows-primary) !important;
}

html body .container_tabs .section_tabs input#journal_details:checked ~ nav label.journal_details::after,
html body .container_tabs .section_tabs input#instruction_for_authors:checked ~ nav label.instruction_for_authors::after,
html body .container_tabs .section_tabs input#journal_policy:checked ~ nav label.journal_policy::after,
html body .container_tabs .section_tabs input#associated_journals:checked ~ nav label.associated_journals::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    border-radius: 2px 2px 0 0;
    background: var(--ows-primary);
}

/* Active panel/card row spacing. Keep the existing radio-tab mechanics; only
 * the contents are arranged to the three equal cards in the reference. */
html body .container_tabs .container_nav,
html body .container_tabs .container_authors,
html body .container_tabs .container_policy {
    box-sizing: border-box !important;
    width: 100% !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 13px !important;
    margin: 0 !important;
    padding: 17px 0 0 !important;
    background: transparent !important;
}

html body .container_tabs .container_nav .nav_card,
html body .container_tabs .container_authors .author_card,
html body .container_tabs .container_policy .policy_card {
    box-sizing: border-box !important;
    min-width: 0 !important;
    width: 100% !important;
    min-height: 82px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 13px 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
    background: #ffffff !important;
    border: 1px solid color-mix(in srgb, var(--ows-primary, #1a1a1a) 28%, white 72%) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    transition: border-color .18s ease !important;
}

html body .container_tabs .container_nav .nav_card:hover,
html body .container_tabs .container_authors .author_card:hover,
html body .container_tabs .container_policy .policy_card:hover {
    border-color: var(--ows-primary, #1a1a1a) !important;
}

html body .container_tabs .nav_card .one,
html body .container_tabs .author_card .one,
html body .container_tabs .policy_card .one {
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: 11px !important;
    row-gap: 2px !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Mint circular icon, 38px overall, matching the reference cards. */
html body .container_tabs .nav_card img,
html body .container_tabs .author_card img,
html body .container_tabs .policy_card img {
    display: block !important;
    box-sizing: content-box !important;
    flex: 0 0 16px !important;
    width: 16px !important;
    height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
    margin: 0 !important;
    padding: 11px !important;
    object-fit: contain !important;
    background: color-mix(in srgb, var(--ows-primary, #1a1a1a) 14%, white 86%) !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: none !important;
}

html body .container_tabs .nav_card .one > img,
html body .container_tabs .author_card .one > img,
html body .container_tabs .policy_card .one > img,
html body .container_tabs .nav_card .one > svg,
html body .container_tabs .author_card .one > svg,
html body .container_tabs .policy_card .one > svg {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    align-self: center !important;
    justify-self: start !important;
}

html body .container_tabs .nav_card .one > a,
html body .container_tabs .author_card .one > a,
html body .container_tabs .policy_card .one > a,
html body .container_tabs .nav_card .one > h2,
html body .container_tabs .author_card .one > h2,
html body .container_tabs .policy_card .one > h2,
html body .container_tabs .nav_card .one > .ows_nav_card_subtitle,
html body .container_tabs .author_card .one > .ows_nav_card_subtitle,
html body .container_tabs .policy_card .one > .ows_nav_card_subtitle,
html body .container_tabs .nav_card .one > p,
html body .container_tabs .author_card .one > p,
html body .container_tabs .policy_card .one > p,
html body .container_tabs .nav_card .one > div:not(:first-child),
html body .container_tabs .author_card .one > div:not(:first-child),
html body .container_tabs .policy_card .one > div:not(:first-child) {
    grid-column: 2 !important;
    min-width: 0 !important;
}

html body .container_tabs .nav_card .one > a,
html body .container_tabs .author_card .one > a,
html body .container_tabs .policy_card .one > a {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
    text-decoration: none !important;
}

html body .container_tabs .nav_card h2,
html body .container_tabs .author_card h2,
html body .container_tabs .policy_card h2 {
    grid-column: 2 !important;
    width: 100% !important;
    margin: 0 0 3px !important;
    padding: 0 !important;
    color: var(--ows-primary) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
    white-space: normal !important;
    align-self: end !important;
}

html body .container_tabs .ows_nav_card_subtitle,
html body .container_tabs .nav_card .one > p,
html body .container_tabs .author_card .one > p,
html body .container_tabs .policy_card .one > p {
    display: block !important;
    grid-column: 2 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #6b7280 !important;
    font-size: 11.5px !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
    white-space: normal !important;
    align-self: start !important;
}

/* Associated-journal logos keep their real aspect ratio but use the same
 * clean content padding as the card panels. */
html body .container_tabs .container_images {
    box-sizing: border-box !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 17px 0 0 !important;
    gap: 14px !important;
}

@media (max-width: 900px) {
    html body .container_tabs .container_nav,
    html body .container_tabs .container_authors,
    html body .container_tabs .container_policy {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 620px) {
    html body .container_tabs {
        padding: 0 14px 14px !important;
        border-radius: 12px !important;
    }

    html body .container_tabs .section_tabs > nav,
    html body .container_tabs .section_tabs nav {
        gap: 22px !important;
        min-height: 54px !important;
    }

    html body .container_tabs .section_tabs nav label {
        height: 54px !important;
        font-size: 12px !important;
    }

    html body .container_tabs .container_nav,
    html body .container_tabs .container_authors,
    html body .container_tabs .container_policy {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        padding-top: 14px !important;
    }

    html body .container_tabs .container_nav .nav_card,
    html body .container_tabs .container_authors .author_card,
    html body .container_tabs .container_policy .policy_card {
        min-height: 76px !important;
        height: auto !important;
    }
}


/* ==========================================================
 * OWS Dashboard 3.10.428.0 - compact tabs content + associated journals covers
 * Removes excess empty space below tab content and renders the
 * Associated Journals covers as compact pseudo-3D magazine covers.
 * ========================================================== */

/* The journal-authored tabs block keeps some fixed-height wrappers in its
 * original stylesheet; collapse them so the bottom whitespace under the
 * cards/covers is reduced to the minimum needed by real content only. */
html body .container_tabs,
html body .container_tabs .section_tabs,
html body .container_tabs .section_tabs > *:not(nav):not(input):not(label),
html body .container_tabs .section_tabs .container_nav,
html body .container_tabs .section_tabs .container_authors,
html body .container_tabs .section_tabs .container_policy,
html body .container_tabs .section_tabs .container_images {
    min-height: 0 !important;
    height: auto !important;
}

html body .container_tabs .section_tabs .container_nav,
html body .container_tabs .section_tabs .container_authors,
html body .container_tabs .section_tabs .container_policy {
    padding-bottom: 2px !important;
}

/* Associated Journals: centered compact cover grid instead of one tiny flat
 * image in a large empty area. The wrappers become pseudo-3D covers with a
 * visible spine and soft floor shadow. */
html body .container_tabs .container_images {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(132px, 156px)) !important;
    justify-content: center !important;
    align-items: start !important;
    align-content: start !important;
    gap: 22px 26px !important;
    padding: 18px 0 6px !important;
}

html body .container_tabs .container_images .img_item {
    position: relative !important;
    display: block !important;
    width: 138px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    transform: perspective(1200px) rotateY(-22deg) rotateX(2deg) !important;
    transform-style: preserve-3d;
    transform-origin: left center;
    transition: transform 0.24s ease, filter 0.24s ease !important;
    filter: saturate(1.02);
}

html body .container_tabs .container_images .img_item:hover {
    transform: perspective(1200px) rotateY(-14deg) rotateX(1deg) translateY(-2px) !important;
}

html body .container_tabs .container_images .img_item::before {
    content: '';
    position: absolute;
    top: 3px;
    bottom: 3px;
    left: -10px;
    width: 10px;
    border-radius: 2px 0 0 2px;
    background: linear-gradient(180deg, #b6c7c1 0%, #8fa29b 48%, #6c817a 100%);
    box-shadow: inset 1px 0 0 rgba(255,255,255,0.35), inset -1px 0 0 rgba(20,50,45,0.12);
}

html body .container_tabs .container_images .img_item::after {
    content: '';
    position: absolute;
    left: 14px;
    right: 8px;
    bottom: -16px;
    height: 16px;
    background: rgba(11, 41, 36, 0.18);
    filter: blur(8px);
    border-radius: 50%;
    z-index: -1;
}

html body .container_tabs .container_images .img_item > a,
html body .container_tabs .container_images .img_item > span,
html body .container_tabs .container_images .img_item > div {
    display: block !important;
}

html body .container_tabs .container_images .img_item img {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    border-radius: 3px 7px 7px 3px !important;
    border: 1px solid #d7e2de !important;
    background: #ffffff !important;
    box-shadow: 0 10px 18px rgba(12, 39, 34, 0.18), 0 2px 4px rgba(12, 39, 34, 0.10) !important;
    overflow: hidden;
}

@media (max-width: 620px) {
    html body .container_tabs .container_images {
        grid-template-columns: repeat(auto-fit, minmax(116px, 132px)) !important;
        gap: 18px 16px !important;
        padding-top: 14px !important;
    }

    html body .container_tabs .container_images .img_item {
        width: 120px !important;
    }
}


/* ==========================================================
 * OWS Dashboard 3.10.434.0 - desktop spacing + readable type
 *
 * The previous homepage inherited a wide-theme `space-between` layout.
 * At 1600-1920px this created large empty bands between the left navigation,
 * journal content, and cover/sidebar. The JS marker above is added only when
 * those three real OJS columns are siblings on the journal homepage.
 * ========================================================== */

@media (min-width: 1180px) {
    html body .ows_homepage_three_column {
        box-sizing: border-box !important;
        display: grid !important;
        grid-template-columns: 270px minmax(0, 1fr) 260px !important;
        column-gap: 14px !important;
        row-gap: 0 !important;
        align-items: start !important;
        justify-content: stretch !important;
        width: min(1540px, calc(100% - 64px)) !important;
        max-width: 1540px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    html body .ows_homepage_three_column > .pkp_structure_sidebar.left {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    html body .ows_homepage_three_column > .pkp_structure_main {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }

    html body .ows_homepage_three_column > .pkp_structure_sidebar:not(.left) {
        grid-column: 3 !important;
        grid-row: 1 !important;
    }

    html body .ows_homepage_three_column > .pkp_structure_sidebar,
    html body .ows_homepage_three_column > .pkp_structure_main {
        box-sizing: border-box !important;
        float: none !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* Keep the explicit columns comfortable on medium desktop widths instead of
 * squeezing the article column. */
@media (min-width: 1180px) and (max-width: 1399px) {
    html body .ows_homepage_three_column {
        grid-template-columns: 245px minmax(0, 1fr) 235px !important;
        column-gap: 12px !important;
        width: calc(100% - 40px) !important;
    }
}

/* ---- Homepage typography: intentionally one step larger than 3.10.433 ---- */
html body.ows_homepage_three_column_mounted .pkp_structure_main,
html body.ows_homepage_three_column_mounted .pkp_structure_sidebar {
    font-size: 15px;
}

html body.ows_homepage_three_column_mounted .pkp_structure_sidebar.left .ows_sidebar_nav_row,
html body.ows_homepage_three_column_mounted .pkp_structure_sidebar.left .ows_sidebar_nav_block .house_right,
html body.ows_homepage_three_column_mounted .pkp_structure_sidebar.left .ows_sidebar_nav_block .heaedr_accordion {
    min-height: 42px !important;
    padding: 9px 12px !important;
    font-size: 15px !important;
}

html body.ows_homepage_three_column_mounted .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion a {
    padding: 7px 8px !important;
    font-size: 13.5px !important;
    line-height: 1.4 !important;
}

html body.ows_homepage_three_column_mounted .ows_sidebar_browse__label {
    font-size: 11.5px !important;
}

html body.ows_homepage_three_column_mounted .ows_sidebar_browse__row {
    min-height: 42px !important;
    padding: 9px 12px !important;
    font-size: 14.5px !important;
}

html body.ows_homepage_three_column_mounted .ows_sidebar_browse__volumeRow {
    min-height: 40px !important;
    font-size: 13.5px !important;
}

html body.ows_homepage_three_column_mounted .ows_sidebar_browse__issue {
    font-size: 13px !important;
}

html body.ows_homepage_three_column_mounted .pkp_block.block_keyword_cloud .title {
    font-size: 15px !important;
}

html body.ows_homepage_three_column_mounted .pkp_block.block_keyword_cloud a {
    font-size: 13px !important;
}

html body.ows_homepage_three_column_mounted .homepage_about__kicker {
    font-size: 11.5px !important;
}

html body.ows_homepage_three_column_mounted .homepage_about h2,
html body.ows_homepage_three_column_mounted .homepage_about__title {
    max-width: 620px !important;
    font-size: 25px !important;
}

html body.ows_homepage_three_column_mounted .homepage_about__description {
    max-width: 650px !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

html body.ows_homepage_three_column_mounted .homepage_about__cta {
    min-height: 38px !important;
    font-size: 13.5px !important;
}

html body.ows_homepage_three_column_mounted .container_tabs .section_tabs nav label {
    font-size: 14.5px !important;
}

html body.ows_homepage_three_column_mounted .container_tabs .nav_card h2,
html body.ows_homepage_three_column_mounted .container_tabs .author_card h2,
html body.ows_homepage_three_column_mounted .container_tabs .policy_card h2 {
    font-size: 14.5px !important;
}

html body.ows_homepage_three_column_mounted .container_tabs .ows_nav_card_subtitle,
html body.ows_homepage_three_column_mounted .container_tabs .nav_card .one > p,
html body.ows_homepage_three_column_mounted .container_tabs .author_card .one > p,
html body.ows_homepage_three_column_mounted .container_tabs .policy_card .one > p {
    font-size: 12.5px !important;
}

html body.ows_homepage_three_column_mounted .ows_articles_tabs__label {
    font-size: 14.5px !important;
}

html body.ows_homepage_three_column_mounted .ows_articles_tabs__item .title,
html body.ows_homepage_three_column_mounted .ows_articles_tabs__panel--published .obj_article_summary .title {
    font-size: 17px !important;
}

html body.ows_homepage_three_column_mounted .ows_articles_tabs__item .authors,
html body.ows_homepage_three_column_mounted .ows_articles_tabs__panel--published .obj_article_summary .authors {
    font-size: 14px !important;
}

html body.ows_homepage_three_column_mounted .ows_articles_tabs__item .doi a,
html body.ows_homepage_three_column_mounted .ows_articles_tabs__panel--published .obj_article_summary .doiInSummary a {
    font-size: 13.5px !important;
}

html body.ows_homepage_three_column_mounted .ows_articles_tabs__panel--published .obj_article_summary .galleys_links a {
    font-size: 13px !important;
}

html body.ows_homepage_three_column_mounted .ows_journal_card__kicker {
    font-size: 11.5px !important;
}

html body.ows_homepage_three_column_mounted .ows_journal_card__title {
    font-size: 21px !important;
}

html body.ows_homepage_three_column_mounted .ows_journal_card__row {
    font-size: 13.5px !important;
}

html body.ows_homepage_three_column_mounted .ows_journal_card__label {
    font-size: 10.5px !important;
}

html body.ows_homepage_three_column_mounted .indexing {
    font-size: 15px !important;
}

html body.ows_homepage_three_column_mounted .ows_indexing_label {
    font-size: 13.5px !important;
}

html body.ows_homepage_three_column_mounted .ows_indexing_link img {
    width: 84px !important;
    max-width: 84px !important;
    height: 42px !important;
    max-height: 42px !important;
}

/* Footer text was visually much smaller than the now-readable content. Keep
 * the footer hierarchy but bring normal copy/links to the same visual scale. */
html body.ows_homepage_three_column_mounted .pkp_structure_footer {
    font-size: 13.5px !important;
}

/* Header utility text should not remain at the older 13px scale when the
 * homepage body has been enlarged. Geometry/spacing from 3.10.432 stays intact. */
html body.ows_homepage_three_column_mounted .ows_public_header__control,
html body.ows_homepage_three_column_mounted .ows_public_header__locale,
html body.ows_homepage_three_column_mounted .ows_public_header__userButton,
html body.ows_homepage_three_column_mounted .ows_public_header__userLink {
    font-size: 14px !important;
}

html body.ows_homepage_three_column_mounted .ows_public_header__userMenu a {
    font-size: 14px !important;
}


/*
 * OWS Dashboard 3.10.435.0 — left-menu polish.
 * Keep only the OWS line icon on Home and compact the native accordion
 * children so journal-managed links do not inherit large paragraph margins.
 */
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .house_left,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row::before,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row::after,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .house_right::before,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .house_right::after,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row p::before,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row p::after,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row a::before,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row a::after {
    content: none !important;
    display: none !important;
    background: none !important;
    background-image: none !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row p,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row a {
    background-image: none !important;
}

/* Native Home blocks from older journal markup sometimes contain a second
 * bitmap/font icon nested inside the row. The generated .ows_sidebar_nav_icon
 * is deliberately excluded so exactly one home icon remains visible. */
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row img,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row i,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row .fa,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row .fas,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row .far,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row .fal,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row .fab,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row [class*="fa-home"],
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row [class*="icon-home"] {
    display: none !important;
}

/* Compact Journal Info / Editors / Reviewers children. Custom-block content
 * commonly wraps every link in <p>; the theme's paragraph margins were the
 * source of the large vertical gaps shown in the supplied screenshot. */
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion {
    margin: 0 0 2px !important;
    padding: 2px 0 4px 41px !important;
    gap: 0 !important;
    row-gap: 0 !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion > p,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion > div,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion > ul,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion > ol,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion li {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    min-height: 0 !important;
    line-height: 1.3 !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion ul,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion ol {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    list-style: none !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion br {
    display: none !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion a,
html body.ows_homepage_three_column_mounted .pkp_structure_sidebar.left .ows_sidebar_nav_block .content_accordion a {
    box-sizing: border-box !important;
    display: block !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 5px 8px !important;
    font-size: 13.5px !important;
    line-height: 1.3 !important;
}

/*
 * OWS Dashboard 3.10.436.0 — Home row alignment.
 * The Home custom block uses a different native wrapper than the other
 * navigation rows. Do not let that wrapper stretch across the remaining row,
 * because it visually pushes the Home label away from its line icon.
 */
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row > p,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row > a,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row > span:not(.ows_sidebar_nav_icon):not(.ows_sidebar_nav_chevron) {
    width: auto !important;
    max-width: none !important;
    flex: 0 1 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row {
    justify-content: flex-start !important;
    column-gap: 11px !important;
}

/*
 * OWS Dashboard 3.10.437.0 — Home row exact sibling alignment.
 *
 * The Home custom block has one extra native <p> wrapper around its link.
 * That wrapper kept the full row width and centered the anchor, so the Home
 * label sat much farther from the icon than Submit/Guide/etc. Flatten only
 * that harmless wrapper into the flex row and force the real Home anchor to
 * size to its text. This gives Home the exact same icon-column + 11px gap
 * geometry used by every other top-level sidebar item.
 */
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row > p {
    display: contents !important;
}

html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row > p > a,
html body .pkp_structure_sidebar.left .ows_sidebar_nav_block--home .ows_sidebar_nav_row > a {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
    line-height: inherit !important;
}


/* ==========================================================
 * OWS Dashboard 3.10.438.0 — Homepage hero cover composition
 * Reference: user-approved TQFB screenshot (circled hero only).
 * Moves the configured journal cover into the homepage About hero,
 * keeps real journal content/URLs, and does not alter the right sidebar.
 * ========================================================== */
html body .homepage_about[data-ows-hero="1"] {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 220px !important;
    align-items: stretch !important;
    gap: 28px !important;
    min-height: 330px !important;
    padding: 28px 30px !important;
    background:
        radial-gradient(circle at 82% 36%, color-mix(in srgb, var(--ows-primary) 7%, transparent 93%) 0 2px, transparent 3px),
        radial-gradient(circle at 91% 63%, color-mix(in srgb, var(--ows-primary) 6%, transparent 94%) 0 2px, transparent 3px),
        linear-gradient(118deg, #f2f8f7 0%, #f6faf9 52%, color-mix(in srgb, var(--ows-primary) 6%, white 94%) 100%) !important;
    background-size: 64px 64px, 82px 82px, auto !important;
    border: 1px solid color-mix(in srgb, var(--ows-primary) 12%, white 88%) !important;
    border-radius: 9px !important;
    box-shadow: none !important;
}

html body .homepage_about[data-ows-hero="1"]::before,
html body .homepage_about[data-ows-hero="1"]::after {
    display: none !important;
    content: none !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 2px 0;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__kicker {
    display: block !important;
    width: auto !important;
    margin: 0 0 15px !important;
    color: color-mix(in srgb, var(--ows-primary) 86%, #245ea8 14%) !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.09em !important;
    text-transform: uppercase !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__kicker::before {
    display: none !important;
    content: none !important;
}

html body .homepage_about[data-ows-hero="1"] h2,
html body .homepage_about[data-ows-hero="1"] .homepage_about__title,
html body.ows_homepage_three_column_mounted .homepage_about[data-ows-hero="1"] h2,
html body.ows_homepage_three_column_mounted .homepage_about[data-ows-hero="1"] .homepage_about__title {
    max-width: 540px !important;
    margin: 0 0 22px !important;
    color: #102f3b !important;
    font-size: clamp(27px, 2vw, 34px) !important;
    font-weight: 700 !important;
    line-height: 1.14 !important;
    letter-spacing: -0.02em !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__description,
html body.ows_homepage_three_column_mounted .homepage_about[data-ows-hero="1"] .homepage_about__description {
    max-width: 540px !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    overflow: visible !important;
    color: #304840 !important;
    font-size: 13.5px !important;
    line-height: 1.6 !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__description p {
    margin: 0 !important;
    font-size: 13.5px !important;
    line-height: 1.6 !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__actions {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px !important;
    margin-top: 24px !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__cta,
html body.ows_homepage_three_column_mounted .homepage_about[data-ows-hero="1"] .homepage_about__cta {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 43px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 10px 18px !important;
    border-radius: 5px !important;
    box-shadow: none !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    text-decoration: none !important;
    white-space: nowrap;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__cta--primary {
    gap: 10px !important;
    background: var(--ows-primary) !important;
    border: 1px solid var(--ows-primary) !important;
    color: #ffffff !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__cta--primary::after {
    content: '\2192' !important;
    font-size: 16px !important;
    line-height: 1 !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__cta--primary:hover,
html body .homepage_about[data-ows-hero="1"] .homepage_about__cta--primary:focus-visible {
    background: color-mix(in srgb, var(--ows-primary) 90%, black 10%) !important;
    border-color: color-mix(in srgb, var(--ows-primary) 90%, black 10%) !important;
    color: #ffffff !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__cta--secondary {
    background: rgba(255,255,255,0.74) !important;
    border: 1px solid color-mix(in srgb, var(--ows-primary) 58%, white 42%) !important;
    color: var(--ows-primary) !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__cta--secondary::after {
    display: none !important;
    content: none !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__cta--secondary:hover,
html body .homepage_about[data-ows-hero="1"] .homepage_about__cta--secondary:focus-visible {
    background: color-mix(in srgb, var(--ows-primary) 7%, white 93%) !important;
    color: var(--ows-primary) !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__media {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__cover {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 280px !important;
    object-fit: contain !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #ffffff;
    box-shadow: 0 9px 18px rgba(20, 52, 62, 0.20), 0 2px 5px rgba(20, 52, 62, 0.12) !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverPlaceholder {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 250px;
    background:
        linear-gradient(132deg, transparent 0 35%, color-mix(in srgb, var(--ows-primary) 7%, transparent 93%) 35.5% 36%, transparent 36.5% 100%),
        radial-gradient(ellipse at 45% 52%, color-mix(in srgb, var(--ows-primary) 11%, transparent 89%) 0 2px, transparent 3px);
    background-size: auto, 36px 36px;
}

@media (max-width: 1000px) {
    html body .homepage_about[data-ows-hero="1"] {
        grid-template-columns: minmax(0, 1fr) 180px !important;
        gap: 20px !important;
        min-height: 300px !important;
        padding: 24px !important;
    }

    html body .homepage_about[data-ows-hero="1"] .homepage_about__cover {
        max-height: 245px !important;
    }
}

@media (max-width: 760px) {
    html body .homepage_about[data-ows-hero="1"] {
        display: block !important;
        min-height: 0 !important;
        padding: 22px 20px !important;
    }

    html body .homepage_about[data-ows-hero="1"] h2,
    html body .homepage_about[data-ows-hero="1"] .homepage_about__title,
    html body .homepage_about[data-ows-hero="1"] .homepage_about__description {
        max-width: 100% !important;
    }

    html body .homepage_about[data-ows-hero="1"] .homepage_about__description {
        max-height: none !important;
    }

    html body .homepage_about[data-ows-hero="1"] .homepage_about__actions {
        margin-top: 20px !important;
    }

    html body .homepage_about[data-ows-hero="1"] .homepage_about__media {
        margin-top: 24px !important;
        justify-content: flex-start;
    }

    html body .homepage_about[data-ows-hero="1"] .homepage_about__cover {
        max-height: 260px !important;
        max-width: min(190px, 70vw) !important;
    }
}


/* ==========================================================
 * OWS Dashboard 3.10.439.0 — Single cover location
 * The uploaded journal cover is rendered only inside the homepage hero.
 * The right sidebar journal card remains metadata-only.
 * ========================================================== */
html body .ows_journal_card--infoOnly {
    overflow: hidden;
}

html body .ows_journal_card--infoOnly .ows_journal_card__rows {
    border-radius: var(--ows-radius-lg);
}


/* ==========================================================
 * OWS Dashboard 3.10.447.0 — right sidebar journal information card
 * Match the approved reference: a compact dark title bar with a short
 * underline and a separate white metadata body.
 * ========================================================== */
html body .ows_journal_card--infoOnly {
    margin-bottom: 14px;
    border-radius: 14px;
    background: transparent;
    box-shadow: none;
    overflow: visible;
}

html body .ows_journal_card--infoOnly .ows_journal_card__header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding: 17px 20px 15px;
    border-radius: 14px 14px 0 0;
    background: var(--ows-primary);
    color: #ffffff;
}

html body .ows_journal_card--infoOnly .ows_journal_card__headerTitle {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    color: #ffffff;
}

html body .ows_journal_card--infoOnly .ows_journal_card__headerLine {
    display: block;
    width: 38px;
    height: 2px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
}

html body .ows_journal_card--infoOnly .ows_journal_card__body {
    padding: 18px 18px 17px;
    border: 1px solid var(--ows-mint-border);
    border-top: 0;
    border-radius: 0 0 14px 14px;
    background: #ffffff;
    box-shadow: none;
}

html body .ows_journal_card--infoOnly .ows_journal_card__rows {
    gap: 16px;
    padding: 0;
    background: transparent;
}

html body .ows_journal_card--infoOnly .ows_journal_card__row {
    align-items: flex-start;
    gap: 12px;
    font-size: 13px;
}

html body .ows_journal_card--infoOnly .ows_journal_card__icon {
    width: 28px;
    height: 28px;
    color: color-mix(in srgb, var(--ows-primary) 82%, #4d78a6 18%);
}

html body .ows_journal_card--infoOnly .ows_journal_card__icon svg {
    width: 17px;
    height: 17px;
    stroke-width: 1.8;
}

html body .ows_journal_card--infoOnly .ows_journal_card__text {
    gap: 5px;
}

html body .ows_journal_card--infoOnly .ows_journal_card__label {
    color: color-mix(in srgb, var(--ows-primary) 84%, #436e9d 16%);
    text-transform: none;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.2;
}

html body .ows_journal_card--infoOnly .ows_journal_card__value {
    color: color-mix(in srgb, var(--ows-primary) 86%, #557fae 14%);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.35;
}

/* ==========================================================
 * OWS Dashboard 3.10.471.0
 * Exact approved primary CTA color.
 * The hero's --ows-primary token is dynamically sampled from the journal
 * cover, so the earlier rule could turn About the Journal gray. Pin only
 * the primary About the Journal CTA to the requested fixed color.
 * ========================================================== */
html body .homepage_about[data-ows-hero="1"] .homepage_about__cta--primary,
html body.ows_homepage_three_column_mounted .homepage_about[data-ows-hero="1"] .homepage_about__cta--primary,
html body .homepage_about .homepage_about__actions .homepage_about__cta--primary {
    background-color: var(--ows-primary, #1a1a1a) !important;
    background-image: none !important;
    border-color: var(--ows-primary, #1a1a1a) !important;
    color: #ffffff !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__cta--primary:hover,
html body .homepage_about[data-ows-hero="1"] .homepage_about__cta--primary:focus,
html body .homepage_about[data-ows-hero="1"] .homepage_about__cta--primary:focus-visible,
html body.ows_homepage_three_column_mounted .homepage_about[data-ows-hero="1"] .homepage_about__cta--primary:hover,
html body.ows_homepage_three_column_mounted .homepage_about[data-ows-hero="1"] .homepage_about__cta--primary:focus-visible {
    background-color: color-mix(in srgb, var(--ows-primary, #1a1a1a) 88%, black 12%) !important;
    background-image: none !important;
    border-color: var(--ows-primary, #1a1a1a) !important;
    color: #ffffff !important;
}

/* ==========================================================================
 * 3.10.487.0 — FINAL Indexing & Abstracting reference override
 *
 * This block intentionally lives inside frontendArticlesTabs.css because this
 * is the stylesheet that already owns and renders the live indexing block on
 * the journal homepage. The earlier separate reference stylesheet could be
 * bypassed by the live theme/style registration path. These selectors are
 * deliberately global-to-this-component and !important so the old orange bar,
 * mini logo box, duplicate text label and left/right layout cannot win.
 * ======================================================================= */

html body .indexing {
    position: relative !important;
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    margin: 18px 0 12px !important;
    padding: 2px 0 2px 8px !important;
    border: 0 !important;
    border-bottom: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #17345f !important;
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

html body .indexing::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 1px !important;
    bottom: 1px !important;
    width: 3px !important;
    height: auto !important;
    border: 0 !important;
    border-radius: 1px !important;
    background: #0d918f !important;
}

html body .indexing::after {
    content: none !important;
    display: none !important;
    border: 0 !important;
    background: none !important;
}

html body .ows_indexing_link {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 76px !important;
    margin: 7px 0 0 !important;
    padding: 8px 12px !important;
    gap: 0 !important;
    border: 1px solid #edf0f3 !important;
    border-radius: 4px !important;
    background: #ffffff !important;
    color: #334155 !important;
    text-decoration: none !important;
    box-shadow:
        0 1px 3px rgba(15, 35, 55, 0.05),
        0 3px 10px rgba(15, 35, 55, 0.045) !important;
    overflow: hidden !important;
}

html body .ows_indexing_link + .ows_indexing_link {
    margin-top: 6px !important;
}

html body .ows_indexing_link:hover,
html body .ows_indexing_link:focus-visible {
    border-color: #dce3e9 !important;
    background: #ffffff !important;
    color: #334155 !important;
    text-decoration: none !important;
    box-shadow:
        0 2px 5px rgba(15, 35, 55, 0.06),
        0 5px 14px rgba(15, 35, 55, 0.065) !important;
    outline: none !important;
}

/* Remove the small inner framed logo box from the old design. */
html body .ows_indexing_link img {
    display: block !important;
    width: auto !important;
    max-width: 200px !important;
    height: auto !important;
    max-height: 56px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    object-fit: contain !important;
    flex: 0 1 auto !important;
}

/* A logo already contains the service name, so suppress duplicate "google". */
html body .ows_indexing_link--hasLogo .ows_indexing_label {
    display: none !important;
}

/* If no logo is configured, keep the text centered and readable. */
html body .ows_indexing_link:not(.ows_indexing_link--hasLogo) .ows_indexing_label {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #344054 !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    text-align: center !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

/* ==========================================================================
 * 3.10.489.0 — Indexing heading geometry + larger logos
 * Use a real flex child for the bar so the title is guaranteed to sit
 * immediately beside it, regardless of inherited heading padding/centering.
 * ======================================================================= */
html body.ows_homepage_three_column_mounted .indexing,
html body .page_index_journal .indexing,
html body .indexing {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    width: 100% !important;
    margin: 18px 0 12px !important;
    padding: 0 !important;
    text-align: left !important;
    text-indent: 0 !important;
}

html body.ows_homepage_three_column_mounted .indexing::before,
html body .page_index_journal .indexing::before,
html body .indexing::before,
html body.ows_homepage_three_column_mounted .indexing::after,
html body .page_index_journal .indexing::after,
html body .indexing::after {
    content: none !important;
    display: none !important;
}

html body .indexing .ows_indexing_heading_bar {
    display: block !important;
    flex: 0 0 3px !important;
    width: 3px !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #0d918f !important;
}

html body .indexing .ows_indexing_heading_text {
    display: block !important;
    flex: 0 1 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #17345f !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    text-align: left !important;
}

html body.ows_homepage_three_column_mounted .ows_indexing_link img,
html body .page_index_journal .ows_indexing_link img,
html body .ows_indexing_link img {
    display: block !important;
    width: 155px !important;
    max-width: 155px !important;
    height: 58px !important;
    max-height: 58px !important;
    min-width: 155px !important;
    min-height: 58px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    object-fit: contain !important;
    flex: 0 0 155px !important;
}



/* 3.10.501.0 — Indexing and Abstracting heading text to black */
html body .indexing .ows_indexing_heading_text,
html body .page_index_journal .indexing .ows_indexing_heading_text,
html body.ows_homepage_three_column_mounted .indexing .ows_indexing_heading_text,
html body .indexing {
    color: #000000 !important;
}


/* -------------------------------------------------------------------------
 * 3.10.529.0 — Set .rea width to 300px
 * ---------------------------------------------------------------------- */
html body .rea {
    width: 300px !important;
}

/* ==========================================================
 * OWS Dashboard 3.10.777.0
 * Homepage hero — left-to-right Site Color gradient.
 *
 * The user requested the homepage About hero background to transition from
 * white on the left to the selected Site Color on the right. Use the live
 * theme variable so the gradient always follows Journal > Site Color.
 * ========================================================== */
html body .homepage_about[data-ows-hero="1"],
html body.ows_homepage_three_column_mounted .homepage_about[data-ows-hero="1"] {
    background-image: linear-gradient(
        90deg,
        #ffffff 0%,
        color-mix(in srgb, #ffffff 88%, var(--ows-primary) 12%) 42%,
        color-mix(in srgb, #ffffff 72%, var(--ows-primary) 28%) 72%,
        color-mix(in srgb, #ffffff 52%, var(--ows-primary) 48%) 100%
    ) !important;
    background-color: #ffffff !important;
    background-repeat: no-repeat !important;
    background-size: 100% 100% !important;
    border-color: color-mix(in srgb, var(--ows-primary) 14%, white 86%) !important;
}

/* ==========================================================
 * OWS Dashboard 3.10.778.0
 * Homepage hero cover — 3D journal-cover treatment.
 *
 * Keeps the previously approved left-to-right Site Color gradient and only
 * upgrades the cover presentation to a more dimensional, reference-like
 * 3D book render using the live uploaded cover image.
 * ========================================================== */
html body .homepage_about[data-ows-hero="1"] .homepage_about__media {
    position: relative !important;
    align-self: center !important;
    justify-content: center !important;
    padding: 4px 2px 4px 10px !important;
    overflow: visible !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverScene {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: min(100%, 250px) !important;
    min-height: 290px !important;
    perspective: 1500px !important;
    overflow: visible !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverScene::before {
    content: "" !important;
    position: absolute !important;
    inset: 12px 12px 18px 12px !important;
    border-radius: 24px !important;
    background: radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--ows-primary) 16%, #ffffff 84%) 0%, color-mix(in srgb, var(--ows-primary) 7%, rgba(255,255,255,0) 93%) 54%, rgba(255,255,255,0) 74%) !important;
    filter: blur(0.5px) !important;
    z-index: 0 !important;
    pointer-events: none !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook {
    position: relative !important;
    z-index: 2 !important;
    width: min(100%, 190px) !important;
    transform-style: preserve-3d !important;
    transform: perspective(1400px) rotateY(-23deg) rotateX(4deg) rotateZ(-1deg) translateZ(0) !important;
    transform-origin: center center !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook::before {
    content: "" !important;
    position: absolute !important;
    inset: 6px -10px -10px 10px !important;
    border-radius: 8px !important;
    background: linear-gradient(135deg, rgba(14,45,53,0.16), rgba(14,45,53,0.04)) !important;
    filter: blur(10px) !important;
    transform: translateZ(-14px) translateX(10px) translateY(12px) !important;
    z-index: 0 !important;
    pointer-events: none !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__cover {
    position: relative !important;
    z-index: 2 !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: none !important;
    object-fit: contain !important;
    border: 1px solid color-mix(in srgb, var(--ows-primary) 10%, #d7e0e8 90%) !important;
    border-radius: 4px !important;
    background: #ffffff !important;
    box-shadow: 0 18px 28px rgba(15, 37, 44, 0.18), 10px 8px 0 rgba(255,255,255,0.45) !important;
    transform: translateZ(16px) !important;
    backface-visibility: hidden !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverSpine {
    position: absolute !important;
    top: 7px !important;
    right: -15px !important;
    bottom: 7px !important;
    width: 15px !important;
    border-radius: 0 4px 4px 0 !important;
    background: linear-gradient(180deg, #fafcfd 0%, #f0f4f7 38%, #e4ebf0 100%) !important;
    border: 1px solid rgba(190, 201, 210, 0.95) !important;
    border-left: 0 !important;
    transform: rotateY(82deg) translateZ(8px) !important;
    transform-origin: left center !important;
    box-shadow: inset -1px 0 0 rgba(255,255,255,0.86), inset 0 0 0 1px rgba(255,255,255,0.28) !important;
    pointer-events: none !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverSpine::before,
html body .homepage_about[data-ows-hero="1"] .homepage_about__coverSpine::after {
    content: "" !important;
    position: absolute !important;
    left: 3px !important;
    right: 3px !important;
    height: 1px !important;
    background: rgba(189, 198, 207, 0.72) !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverSpine::before {
    top: 16% !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverSpine::after {
    top: 24% !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverShadow {
    position: absolute !important;
    left: 50% !important;
    bottom: 18px !important;
    width: 84% !important;
    height: 28px !important;
    background: radial-gradient(ellipse at center, rgba(27, 52, 60, 0.20) 0%, rgba(27, 52, 60, 0.11) 34%, rgba(27, 52, 60, 0) 72%) !important;
    transform: translateX(-38%) rotate(-8deg) !important;
    filter: blur(4px) !important;
    z-index: 1 !important;
    pointer-events: none !important;
}

@media (max-width: 1000px) {
    html body .homepage_about[data-ows-hero="1"] .homepage_about__coverScene {
        width: min(100%, 220px) !important;
        min-height: 250px !important;
    }

    html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook {
        width: min(100%, 170px) !important;
    }
}

@media (max-width: 760px) {
    html body .homepage_about[data-ows-hero="1"] .homepage_about__media {
        padding-left: 0 !important;
    }

    html body .homepage_about[data-ows-hero="1"] .homepage_about__coverScene {
        width: min(70vw, 220px) !important;
        min-height: 240px !important;
    }

    html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook {
        width: min(70vw, 165px) !important;
    }
}


/* ==========================================================
 * OWS Dashboard 3.10.862.0
 * Frontend header actions — hover/focus follow active theme
 * ========================================================== */
html body .box-new .search-box-new:hover,
html body .box-new .search-box-new:focus,
html body .box-new .search-box-new:focus-within,
html body .box-new .home-box-new:hover,
html body .box-new .home-box-new:focus,
html body .box-new .home-box-new:focus-within {
    border-color: var(--ows-primary) !important;
    background-color: color-mix(in srgb, var(--ows-primary) 10%, #ffffff 90%) !important;
    box-shadow: none !important;
}

html body .box-new .search-box-new:hover,
html body .box-new .search-box-new:focus-within,
html body .box-new .home-box-new:hover,
html body .box-new .home-box-new:focus-within,
html body .pkp_navigation_primary_wrapper a:hover,
html body .pkp_navigation_primary_wrapper a:focus-visible,
html body .pkp_navigation_user_wrapper a:hover,
html body .pkp_navigation_user_wrapper a:focus-visible,
html body .pkp_navigation_user_wrapper button:hover,
html body .pkp_navigation_user_wrapper button:focus-visible,
html body .pkp_site_nav_menu a:hover,
html body .pkp_site_nav_menu a:focus-visible {
    color: var(--ows-primary) !important;
    background-color: color-mix(in srgb, var(--ows-primary) 10%, #ffffff 90%) !important;
    border-radius: 4px !important;
    text-decoration: none !important;
}

html body .box-new .search-box-new:hover :is(i, svg),
html body .box-new .search-box-new:focus-within :is(i, svg),
html body .box-new .home-box-new:hover :is(i, svg),
html body .box-new .home-box-new:focus-within :is(i, svg),
html body .pkp_navigation_primary_wrapper a:hover svg,
html body .pkp_navigation_primary_wrapper a:focus-visible svg,
html body .pkp_navigation_user_wrapper a:hover svg,
html body .pkp_navigation_user_wrapper a:focus-visible svg,
html body .pkp_navigation_user_wrapper button:hover svg,
html body .pkp_navigation_user_wrapper button:focus-visible svg,
html body .pkp_site_nav_menu a:hover svg,
html body .pkp_site_nav_menu a:focus-visible svg {
    fill: var(--ows-primary) !important;
    stroke: var(--ows-primary) !important;
    color: var(--ows-primary) !important;
}


/* ==========================================================
 * OWS Dashboard 3.10.863.0
 * Frontend selected options — active text in black
 * ========================================================== */
html body .container_tabs .section_tabs input#journal_details:checked ~ nav label.journal_details,
html body .container_tabs .section_tabs input#instruction_for_authors:checked ~ nav label.instruction_for_authors,
html body .container_tabs .section_tabs input#journal_policy:checked ~ nav label.journal_policy,
html body .container_tabs .section_tabs input#associated_journals:checked ~ nav label.associated_journals {
    color: #111111 !important;
}

#ows_articles_published:checked ~ .ows_articles_tabs__nav .ows_articles_tabs__label--published,
#ows_articles_inpress:checked ~ .ows_articles_tabs__nav .ows_articles_tabs__label--inpress,
#ows_articles_mostviewed:checked ~ .ows_articles_tabs__nav .ows_articles_tabs__label--mostviewed {
    color: #111111 !important;
}

html body .nav_card h2,
html body .author_card h2,
html body .policy_card h2,
html body .nav_card .one > a,
html body .author_card .one > a,
html body .policy_card .one > a {
    color: #111111 !important;
}


/* ==========================================================
 * OWS Dashboard 3.10.866.0
 * Homepage hero cover — refined premium 3D magazine treatment
 * ========================================================== */
html body .homepage_about[data-ows-hero="1"] .homepage_about__media {
    padding: 8px 8px 8px 18px !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverScene {
    width: min(100%, 270px) !important;
    min-height: 305px !important;
    perspective: 1800px !important;
    perspective-origin: 52% 48% !important;
}

/* Soft halo behind the magazine, tied to the live site colour. */
html body .homepage_about[data-ows-hero="1"] .homepage_about__coverScene::before {
    inset: 18px 8px 20px 2px !important;
    border-radius: 22px !important;
    background:
        radial-gradient(ellipse at 58% 46%,
            color-mix(in srgb, var(--ows-primary) 20%, #ffffff 80%) 0%,
            color-mix(in srgb, var(--ows-primary) 9%, transparent 91%) 46%,
            transparent 74%) !important;
    filter: blur(5px) !important;
    opacity: .86 !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook {
    width: min(100%, 198px) !important;
    transform: perspective(1600px) rotateY(-18deg) rotateX(2.5deg) rotateZ(-0.55deg) translateZ(0) !important;
    transform-origin: 52% 50% !important;
    transition: transform .28s ease, filter .28s ease !important;
    filter: drop-shadow(0 3px 1px rgba(255,255,255,.42)) !important;
}

/* Back-cover / page-stack layer. It sits just behind the real uploaded cover
 * and makes the object read as a thin glossy magazine instead of a flat image. */
html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook::after {
    content: "" !important;
    position: absolute !important;
    z-index: 0 !important;
    top: 5px !important;
    right: -12px !important;
    bottom: -7px !important;
    left: 8px !important;
    border: 1px solid rgba(184, 196, 205, .9) !important;
    border-radius: 3px 5px 5px 3px !important;
    background:
        repeating-linear-gradient(
            0deg,
            rgba(181,190,198,.16) 0,
            rgba(181,190,198,.16) 1px,
            rgba(255,255,255,.92) 1px,
            rgba(255,255,255,.92) 4px
        ),
        linear-gradient(90deg, #fdfefe 0%, #f6f8fa 74%, #e7edf1 100%) !important;
    box-shadow:
        8px 12px 18px rgba(20, 43, 50, .16),
        inset -1px 0 0 rgba(148, 163, 175, .34),
        inset 0 1px 0 rgba(255,255,255,.95) !important;
    transform: translateZ(-12px) translateX(5px) translateY(4px) !important;
    pointer-events: none !important;
}

/* Front cover: slightly richer print contrast, a crisp white edge and a
 * layered shadow so it looks laminated rather than pasted onto the hero. */
html body .homepage_about[data-ows-hero="1"] .homepage_about__cover {
    border: 1px solid color-mix(in srgb, var(--ows-primary) 14%, #d6dee5 86%) !important;
    border-radius: 3px !important;
    box-shadow:
        0 1px 0 rgba(255,255,255,.96) inset,
        0 0 0 1px rgba(255,255,255,.34),
        0 16px 30px rgba(18, 39, 47, .20),
        12px 10px 16px rgba(18, 39, 47, .08) !important;
    transform: translateZ(20px) !important;
    filter: saturate(1.035) contrast(1.025) !important;
}

/* Thin right-hand page block/spine with subtle page lines. */
html body .homepage_about[data-ows-hero="1"] .homepage_about__coverSpine {
    top: 6px !important;
    right: -17px !important;
    bottom: 5px !important;
    width: 18px !important;
    border-radius: 0 3px 3px 0 !important;
    background:
        repeating-linear-gradient(
            0deg,
            rgba(165,176,185,.30) 0,
            rgba(165,176,185,.30) 1px,
            rgba(250,252,253,.96) 1px,
            rgba(250,252,253,.96) 5px
        ),
        linear-gradient(90deg, #fbfcfd 0%, #eef2f5 64%, #dce4e9 100%) !important;
    border: 1px solid rgba(176, 188, 198, .9) !important;
    border-left: 0 !important;
    transform: rotateY(78deg) translateZ(9px) !important;
    box-shadow:
        inset -2px 0 2px rgba(113,129,141,.14),
        inset 1px 0 0 rgba(255,255,255,.96) !important;
}

/* Old two-line spine markers are unnecessary once the full page texture is on. */
html body .homepage_about[data-ows-hero="1"] .homepage_about__coverSpine::before,
html body .homepage_about[data-ows-hero="1"] .homepage_about__coverSpine::after {
    display: none !important;
}

/* More natural floor shadow: wider and softer, concentrated under the lower
 * right edge where the 3D object visually carries its weight. */
html body .homepage_about[data-ows-hero="1"] .homepage_about__coverShadow {
    left: 51% !important;
    bottom: 7px !important;
    width: 91% !important;
    height: 34px !important;
    background: radial-gradient(
        ellipse at center,
        rgba(22, 45, 53, .26) 0%,
        rgba(22, 45, 53, .14) 36%,
        rgba(22, 45, 53, 0) 73%
    ) !important;
    transform: translateX(-36%) rotate(-5deg) !important;
    filter: blur(6px) !important;
    opacity: .92 !important;
}

/* A tiny lift on pointer devices makes the magazine feel physical without
 * turning the homepage into an animated mockup. */
@media (hover: hover) and (pointer: fine) {
    html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook:hover {
        transform: perspective(1600px) rotateY(-14deg) rotateX(1.5deg) rotateZ(-0.25deg) translateY(-3px) translateZ(3px) !important;
        filter: drop-shadow(0 5px 2px rgba(255,255,255,.34)) !important;
    }
}

@media (max-width: 1000px) {
    html body .homepage_about[data-ows-hero="1"] .homepage_about__coverScene {
        width: min(100%, 235px) !important;
        min-height: 265px !important;
    }

    html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook {
        width: min(100%, 178px) !important;
    }
}

@media (max-width: 760px) {
    html body .homepage_about[data-ows-hero="1"] .homepage_about__media {
        padding: 8px 0 !important;
    }

    html body .homepage_about[data-ows-hero="1"] .homepage_about__coverScene {
        width: min(72vw, 225px) !important;
        min-height: 250px !important;
    }

    html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook {
        width: min(70vw, 170px) !important;
    }
}


/* ==========================================================
 * OWS Dashboard 3.10.868.0
 * Homepage hero cover — true glossy MAGAZINE treatment
 *
 * The previous 3D pass read too much like a hard-bound academic journal.
 * This final layer deliberately removes the thick page block/book spine and
 * renders a thin flexible magazine: a glossy front cover, three staggered
 * paper sheets, a subtle stapled/fold edge and a soft curved lower corner.
 * ========================================================== */
html body .homepage_about[data-ows-hero="1"] .homepage_about__media {
    padding: 6px 8px 6px 14px !important;
    overflow: visible !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverScene {
    width: min(100%, 272px) !important;
    min-height: 310px !important;
    perspective: 1900px !important;
    perspective-origin: 50% 48% !important;
    overflow: visible !important;
}

/* Keep only a soft themed glow; no rectangular/book-like backdrop. */
html body .homepage_about[data-ows-hero="1"] .homepage_about__coverScene::before {
    inset: 32px 4px 20px 14px !important;
    border-radius: 50% !important;
    background: radial-gradient(
        ellipse at 54% 52%,
        color-mix(in srgb, var(--ows-primary) 16%, transparent 84%) 0%,
        color-mix(in srgb, var(--ows-primary) 7%, transparent 93%) 48%,
        transparent 72%
    ) !important;
    filter: blur(12px) !important;
    opacity: .72 !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook {
    position: relative !important;
    width: min(100%, 202px) !important;
    transform-style: preserve-3d !important;
    transform: perspective(1700px) rotateY(-10deg) rotateX(1.4deg) rotateZ(-2.1deg) translateZ(0) !important;
    transform-origin: 48% 52% !important;
    transition: transform .26s ease !important;
    filter: none !important;
}

/* Remove the old thick pseudo page-block. */
html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook::after {
    content: none !important;
    display: none !important;
}

/* Curled bottom-right glossy page corner. */
html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    z-index: 9 !important;
    right: -1px !important;
    bottom: -1px !important;
    width: 28px !important;
    height: 25px !important;
    border: 0 !important;
    border-radius: 80% 0 3px 0 !important;
    background:
        linear-gradient(138deg,
            rgba(255,255,255,0) 0 44%,
            rgba(255,255,255,.84) 46% 62%,
            rgba(218,225,231,.74) 64% 100%) !important;
    box-shadow: -3px -3px 6px rgba(29,45,53,.07) !important;
    transform: translateZ(17px) rotate(-1deg) !important;
    filter: none !important;
    pointer-events: none !important;
}

/* Three individually offset thin sheets = flexible magazine paper fan. */
html body .homepage_about[data-ows-hero="1"] .homepage_about__coverPage {
    position: absolute !important;
    display: block !important;
    top: 3px !important;
    right: 1px !important;
    bottom: 1px !important;
    left: 2px !important;
    border: 1px solid rgba(186,196,204,.72) !important;
    border-radius: 2px 5px 9px 2px !important;
    background:
        repeating-linear-gradient(
            0deg,
            rgba(184,193,200,.16) 0,
            rgba(184,193,200,.16) 1px,
            rgba(255,255,255,.98) 1px,
            rgba(255,255,255,.98) 5px
        ) !important;
    transform-origin: left center !important;
    pointer-events: none !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverPage--1 {
    z-index: 3 !important;
    transform: translate3d(7px, 3px, -2px) rotateZ(.45deg) !important;
    box-shadow: 5px 6px 8px rgba(22,43,50,.08) !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverPage--2 {
    z-index: 2 !important;
    transform: translate3d(11px, 6px, -6px) rotateZ(1.0deg) !important;
    opacity: .96 !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverPage--3 {
    z-index: 1 !important;
    transform: translate3d(14px, 9px, -10px) rotateZ(1.55deg) !important;
    opacity: .88 !important;
}

/* Glossy flexible front cover — deliberately thin, no hard-cover slab. */
html body .homepage_about[data-ows-hero="1"] .homepage_about__cover {
    position: relative !important;
    z-index: 6 !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: none !important;
    object-fit: contain !important;
    border: 1px solid rgba(170,183,192,.78) !important;
    border-radius: 2px 4px 9px 2px !important;
    background: #ffffff !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.92),
        inset -7px 0 12px rgba(14,35,43,.025),
        0 16px 26px rgba(18,39,47,.17),
        7px 9px 11px rgba(18,39,47,.08) !important;
    transform: translateZ(12px) !important;
    filter: saturate(1.04) contrast(1.025) !important;
    backface-visibility: hidden !important;
}

/* Magazine fold/staple edge: thin left binding, not a thick right book spine. */
html body .homepage_about[data-ows-hero="1"] .homepage_about__coverSpine {
    display: block !important;
    position: absolute !important;
    z-index: 8 !important;
    top: 3px !important;
    right: auto !important;
    bottom: 3px !important;
    left: 0 !important;
    width: 5px !important;
    border: 0 !important;
    border-radius: 2px 0 0 2px !important;
    background: linear-gradient(
        90deg,
        rgba(12,31,38,.23) 0%,
        rgba(255,255,255,.20) 46%,
        rgba(12,31,38,.07) 100%
    ) !important;
    box-shadow: inset 1px 0 0 rgba(255,255,255,.45) !important;
    transform: translateZ(14px) !important;
    transform-origin: center !important;
    opacity: .74 !important;
    pointer-events: none !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverSpine::before,
html body .homepage_about[data-ows-hero="1"] .homepage_about__coverSpine::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    left: 1px !important;
    width: 2px !important;
    height: 10px !important;
    border-radius: 2px !important;
    background: rgba(86,98,106,.44) !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverSpine::before {
    top: 31% !important;
}

html body .homepage_about[data-ows-hero="1"] .homepage_about__coverSpine::after {
    top: 66% !important;
}

/* Softer, flatter shadow appropriate to thin magazine stock. */
html body .homepage_about[data-ows-hero="1"] .homepage_about__coverShadow {
    left: 52% !important;
    bottom: 5px !important;
    width: 88% !important;
    height: 25px !important;
    background: radial-gradient(
        ellipse at center,
        rgba(20,42,49,.22) 0%,
        rgba(20,42,49,.11) 40%,
        rgba(20,42,49,0) 74%
    ) !important;
    transform: translateX(-39%) rotate(-3deg) !important;
    filter: blur(7px) !important;
    opacity: .86 !important;
}

@media (hover: hover) and (pointer: fine) {
    html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook:hover {
        transform: perspective(1700px) rotateY(-7deg) rotateX(.8deg) rotateZ(-1.35deg) translateY(-2px) !important;
        filter: none !important;
    }
}

@media (max-width: 1000px) {
    html body .homepage_about[data-ows-hero="1"] .homepage_about__coverScene {
        width: min(100%, 238px) !important;
        min-height: 270px !important;
    }

    html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook {
        width: min(100%, 181px) !important;
    }
}

@media (max-width: 760px) {
    html body .homepage_about[data-ows-hero="1"] .homepage_about__media {
        padding: 8px 0 !important;
    }

    html body .homepage_about[data-ows-hero="1"] .homepage_about__coverScene {
        width: min(72vw, 225px) !important;
        min-height: 250px !important;
    }

    html body .homepage_about[data-ows-hero="1"] .homepage_about__coverBook {
        width: min(70vw, 170px) !important;
    }
}