.page-wrapper {
    --body-font-size: 16px;
    --body-line-height: 1.68;
    --body-font-weight: 400;
    --type-eyebrow: 12px;
    --type-body-sm: 14px;
    --type-body-md: 16px;
    --type-body-lg: 17px;
    --type-card-title: 22px;
    --type-section-title: 40px;
    --type-metric: 38px;
    --type-display: 76px;
    --h1-font-size: 76px;
    --h2-font-size: 42px;
    --h3-font-size: 30px;
    --h4-font-size: 22px;
    --line-height-heading-h1: 1.05;
    --line-height-heading-h2: 1.16;
    --line-height-heading-h3: 1.22;
    --line-height-heading-h4: 1.28;
}

.page-wrapper,
.page-wrapper p,
.page-wrapper li,
.page-wrapper a,
.page-wrapper button,
.page-wrapper input {
    letter-spacing: 0;
}

.page-wrapper p,
.page-wrapper .text {
    font-size: var(--type-body-md);
    line-height: 1.72;
}

.page-wrapper h1,
.page-wrapper h2,
.page-wrapper h3,
.page-wrapper h4,
.page-wrapper h5,
.page-wrapper h6 {
    letter-spacing: 0;
    text-wrap: balance;
}

/* Keep content immediately readable for users and crawlers. */
.preloader {
    display: none !important;
}

.sec-title .sub-title {
    min-width: 0;
    padding: 8px 18px;
    font-size: var(--type-eyebrow);
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.06em;
}

.sec-title .title {
    max-width: 920px;
    color: var(--theme-color2);
    font-size: var(--type-section-title);
    line-height: 1.16;
}

.sec-title .text {
    max-width: 680px;
    color: var(--color-text-secondary);
    font-size: var(--type-body-md);
    line-height: 1.72;
}

.header-style-one .main-box > .mobile-nav-toggler {
    display: none;
    color: var(--theme-color2);
}

.banner-section .outer-box {
    padding-top: 125px;
    padding-bottom: 305px;
}

.banner-section .content-column .inner-column {
    max-width: 840px;
}

.banner-section .content-column .inner-column .sub-title {
    margin-bottom: 18px;
    padding-bottom: 8px;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: 0.08em;
}

.banner-section .content-column .inner-column .title {
    max-width: 800px;
    margin-bottom: 34px;
    font-size: 72px;
    font-weight: 800;
    line-height: 1.04;
    text-transform: none;
}

.banner-section .content-column .inner-column .title span {
    font-weight: 500;
}

.banner-section .text {
    max-width: 340px;
    color: rgba(var(--theme-color-white-rgb), 0.86);
    font-size: 18px;
    font-weight: 500;
    line-height: 1.55;
}

.banner-section .banner-slider .slide-bg::before {
    background:
        linear-gradient(90deg, rgba(var(--theme-color2-rgb), 0.9) 0%, rgba(var(--theme-color2-rgb), 0.72) 38%, rgba(var(--theme-color4-rgb), 0.4) 70%, rgba(var(--theme-color2-rgb), 0.18) 100%),
        radial-gradient(95.51% 264.21% at 92.63% 41.85%, rgba(0, 7, 31, 0) 0%, rgba(var(--theme-color2-rgb), 0.84) 99.98%);
}

.banner-section .content-column .inner-column .btn-one {
    padding-left: 70px;
    padding-right: 70px;
}

.header-style-one .header-actions {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-left: 34px;
}

.header-style-one .header-search-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin: 0;
    border: 1px solid rgba(var(--theme-color-black-rgb), 0.12);
    border-radius: 50%;
    background: var(--theme-color-white);
    color: var(--theme-color2);
    font-size: 17px;
    transition: all 300ms ease;
}

.header-style-one .header-search-btn::before {
    display: none;
}

.header-style-one .header-search-btn:hover {
    border-color: var(--theme-color1);
    background: var(--theme-color1);
    color: var(--theme-color2);
}

.header-style-one .header-submit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 22px;
    border-radius: 999px;
    background: var(--theme-color1);
    color: var(--theme-color2);
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    transition: all 300ms ease;
}

.header-style-one .header-submit-btn:hover {
    background: var(--theme-color2);
    color: var(--theme-color-white);
}

@media (max-width: 1399px) {
    .header-style-one .main-box .nav-outer .nav .navigation li {
        margin-right: 34px;
    }

    .header-style-one .header-actions {
        margin-left: 24px;
    }
}

@media (max-width: 1199px) {
    .page-wrapper {
        --type-section-title: 36px;
        --type-display: 64px;
        --type-metric: 34px;
    }

    .banner-section .content-column .inner-column .title {
        font-size: 60px;
        line-height: 1.08;
    }

    .header-style-one .main-box .nav-outer .nav .navigation li {
        margin-right: 24px;
    }

    .header-style-one .header-submit-btn {
        padding-left: 18px;
        padding-right: 18px;
    }
}

@media (max-width: 991px) {
    .page-wrapper {
        --type-body-lg: 16px;
        --type-card-title: 21px;
        --type-section-title: 34px;
        --type-display: 50px;
        --type-metric: 32px;
    }

    .sec-title .title,
    .choose-section .sec-title .title,
    .featured-articles-header .sec-title .title {
        font-size: var(--type-section-title);
        line-height: 1.18;
    }

    .banner-section .outer-box {
        padding-top: 145px;
        padding-bottom: 120px;
    }

    .banner-section .content-column .inner-column .title {
        font-size: 48px;
    }

    .banner-section .text {
        max-width: 520px;
        margin-top: 18px;
        margin-left: 0;
    }

    .header-style-one .main-box > .nav-outer {
        display: none;
    }

    .header-style-one .header-actions {
        display: none;
    }

    .header-style-one .main-box > .mobile-nav-toggler {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        margin-left: auto;
        font-size: 28px;
        line-height: 1;
    }
}

@media (max-width: 575px) {
    .page-wrapper {
        --type-body-md: 15px;
        --type-card-title: 20px;
        --type-section-title: 30px;
        --type-display: 42px;
        --type-metric: 28px;
    }

    .page-wrapper p,
    .page-wrapper .text {
        font-size: var(--type-body-md);
        line-height: 1.68;
    }

    .sec-title .sub-title {
        padding: 7px 14px;
        font-size: 11px;
    }

    .sec-title .title,
    .choose-section .sec-title .title,
    .featured-articles-header .sec-title .title,
    .journal-cta-section .sec-title .title {
        font-size: 30px;
        line-height: 1.2;
    }

    .banner-section .outer-box {
        padding-top: 118px;
        padding-bottom: 82px;
    }

    .banner-section .content-column .inner-column .sub-title {
        font-size: 11px;
        line-height: 1.25;
    }

    .banner-section .content-column .inner-column .title {
        margin-bottom: 24px;
        font-size: 36px;
        line-height: 1.1;
    }

    .banner-section .content-column .inner-column .btn-one {
        width: 100%;
        padding-left: 24px;
        padding-right: 24px;
        text-align: center;
    }

    .banner-section .text {
        font-size: 15px;
    }

    .header-style-one .main-box {
        padding: 18px 24px;
    }

    .header-style-one .main-box .logo img {
        max-width: 180px;
    }
}

.processing-section:not(.funfact-section-two) {
    position: relative;
    z-index: 3;
    margin-top: -248px;
    background: transparent;
    padding-top: 0 !important;
    padding-bottom: 50px !important;
}

.processing-section:not(.funfact-section-two) .shape {
    opacity: 0.35;
}

.processing-section:not(.funfact-section-two) .outer-box {
    margin-top: 0;
    padding: 0;
    border: 0;
    border-radius: 12px;
    background: transparent;
}

.processing-section:not(.funfact-section-two) .row {
    --bs-gutter-x: 16px;
    --bs-gutter-y: 16px;
}

.processing-section:not(.funfact-section-two) .processing-block {
    height: 100%;
}

.processing-section:not(.funfact-section-two) .processing-block .inner-box {
    display: block;
    height: 100%;
    min-height: 190px;
    padding: 22px 22px 24px;
    border: 1px solid rgba(var(--theme-color-black-rgb), 0.08);
    border-radius: 10px;
    background: var(--theme-color-white);
    box-shadow: 0 18px 42px rgba(var(--theme-color-black-rgb), 0.16);
    transition: all 300ms ease;
}

.processing-section:not(.funfact-section-two) .processing-block .inner-box:hover {
    border-color: rgba(var(--theme-color1-rgb), 0.45);
    transform: translateY(-4px);
    box-shadow: 0 18px 42px rgba(var(--theme-color-black-rgb), 0.12);
}

.processing-section:not(.funfact-section-two) .processing-block .inner-box.last-block {
    border: 1px solid rgba(var(--theme-color-black-rgb), 0.08);
}

.processing-section:not(.funfact-section-two) .processing-block .inner-box .number {
    margin-bottom: 12px;
    color: var(--theme-color6);
    font-size: 24px;
    line-height: 1;
    -webkit-text-stroke: 0;
}

.processing-section:not(.funfact-section-two) .processing-block .inner-box .title {
    min-height: 44px;
    margin-bottom: 10px;
    color: var(--headings-color);
    font-size: 18px;
    line-height: 1.22;
}

.processing-section:not(.funfact-section-two) .processing-block .inner-box .text {
    max-width: none;
    margin-bottom: 0;
    color: var(--text-color);
    font-size: 14px;
    line-height: 1.58;
}

@media (max-width: 991px) {
    .processing-section:not(.funfact-section-two) {
        margin-top: 0;
        background: var(--theme-color-gray);
        padding-top: 24px !important;
    }

    .processing-section:not(.funfact-section-two) .outer-box {
        margin-top: 0;
    }
}

@media (max-width: 767px) {
    .processing-section:not(.funfact-section-two) {
        padding-bottom: 28px !important;
    }

    .processing-section:not(.funfact-section-two) .processing-block .inner-box {
        min-height: 0;
        text-align: left;
    }

    .processing-section:not(.funfact-section-two) .processing-block .inner-box .text {
        margin: 0;
    }
}

.choose-section {
    background: linear-gradient(180deg, #ffffff 0%, #f6f8fb 100%);
}

.choose-section .sec-title .sub-title {
    background: rgba(var(--theme-color2-rgb), 0.08);
    color: var(--theme-color2);
}

.choose-section .sec-title .title {
    color: #0f1724;
    font-size: var(--type-section-title);
    line-height: 1.16;
    letter-spacing: 0;
}

.choose-section .content-column .inner-column .choose-tab .nav {
    justify-content: flex-start;
    gap: 0;
    border-bottom: 1px solid rgba(var(--theme-color2-rgb), 0.14);
}

.choose-section .content-column .inner-column .choose-tab .nav .nav-item .nav-link {
    padding: 8px 22px 14px 0;
    color: #647084;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: 0;
}

.choose-section .content-column .inner-column .choose-tab .nav .nav-item:not(:last-child) .nav-link {
    margin-right: 28px;
}

.choose-section .content-column .inner-column .choose-tab .nav .nav-item .nav-link.active {
    color: var(--theme-color2);
    border-bottom-color: var(--theme-color1);
}

.choose-section .content-column .inner-column .content-box .text {
    color: #5f6978;
    font-size: 16px;
    line-height: 1.72;
}

.choose-section .content-column .inner-column .content-box .list {
    align-items: flex-start;
}

.choose-section .content-column .inner-column .content-box .list ul li {
    color: #172033;
    font-size: 15px;
    line-height: 1.5;
}

.choose-section .content-column .inner-column .content-box .list ul li i {
    color: var(--theme-color1);
}

.academic-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.academic-tags span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid rgba(var(--theme-color2-rgb), 0.14);
    border-radius: 999px;
    background: #ffffff;
    color: #20314f;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.25;
}

.journal-meta-list {
    max-width: 620px;
}

.journal-meta-list p {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 18px;
    margin: 0;
    padding: 11px 0;
    border-bottom: 1px solid rgba(var(--theme-color2-rgb), 0.12);
}

.journal-meta-list span {
    color: #7a8495;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
    text-transform: uppercase;
}

.journal-meta-list strong {
    display: block;
    color: #172033;
    font-size: 14px;
    line-height: 1.35;
}

.choose-section .image-column .inner-column .image {
    max-width: 620px;
}

.choose-section .image-column .inner-column .image::before {
    position: absolute;
    inset: 0;
    content: "";
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(rgba(var(--theme-color-white-rgb), 0.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--theme-color-white-rgb), 0.12) 1px, transparent 1px),
        linear-gradient(135deg, rgba(var(--theme-color2-rgb), 0.44), rgba(var(--theme-color2-rgb), 0.04));
    background-size: 52px 52px, 52px 52px, 100% 100%;
}

.choose-section .image-column .inner-column .image img {
    height: 560px;
    min-height: 520px;
    object-fit: cover;
}

.choose-section .image-column .inner-column .image .outer-box {
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    max-width: 430px;
    padding: 18px;
    border: 1px solid rgba(var(--theme-color-white-rgb), 0.18);
    border-radius: 12px;
    background: rgba(11, 42, 91, 0.94);
    box-shadow: 0 22px 48px rgba(var(--theme-color-black-rgb), 0.22);
    bottom: -36px;
}

.choose-block {
    display: block;
    padding: 14px;
    border: 1px solid rgba(var(--theme-color-white-rgb), 0.14);
    border-radius: 8px;
    background: rgba(var(--theme-color-white-rgb), 0.07);
}

.choose-block:first-child {
    margin-bottom: 0;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(var(--theme-color-white-rgb), 0.14);
}

.choose-block .content-box .inner-text {
    margin-bottom: 6px;
    color: var(--theme-color-white);
    font-size: 27px;
    line-height: 1;
}

.choose-block .content-box .title {
    color: rgba(var(--theme-color-white-rgb), 0.76);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
}

@media (max-width: 1199px) {
    .choose-section .image-column .inner-column .image img {
        height: 420px;
        min-height: 420px;
    }
}

@media (max-width: 767px) {
    .choose-section .sec-title .title {
        font-size: 34px;
    }

    .choose-section .image-column .inner-column .image .outer-box {
        grid-template-columns: 1fr;
    }

    .journal-meta-list p {
        grid-template-columns: 1fr;
        gap: 6px;
    }
}

.funfact-section-two.processing-section {
    background: var(--theme-color2);
    padding: 0 !important;
}

.journal-impact-section {
    position: relative;
    overflow: hidden;
}

.journal-impact-section::before {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
    background:
        radial-gradient(circle at 20% 20%, rgba(var(--theme-color1-rgb), 0.16), transparent 26%),
        radial-gradient(circle at 82% 28%, rgba(77, 163, 255, 0.16), transparent 28%),
        linear-gradient(rgba(var(--theme-color-white-rgb), 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--theme-color-white-rgb), 0.045) 1px, transparent 1px);
    background-size: auto, auto, 72px 72px, 72px 72px;
    opacity: 0.72;
}

.journal-impact-section::after {
    position: absolute;
    top: 22%;
    right: 8%;
    width: 360px;
    height: 180px;
    content: "";
    pointer-events: none;
    border-top: 1px solid rgba(var(--theme-color-white-rgb), 0.14);
    border-bottom: 1px solid rgba(var(--theme-color-white-rgb), 0.08);
    transform: rotate(-8deg);
    opacity: 0.55;
}

.journal-impact-section .outer-box {
    position: relative;
    z-index: 1;
}

.journal-impact-copy .text {
    max-width: 430px;
    margin-top: 18px;
    margin-bottom: 0;
    color: rgba(var(--theme-color-white-rgb), 0.72);
    font-size: 16px;
    line-height: 1.68;
}

.journal-impact-copy .list {
    display: grid;
    gap: 10px;
}

.journal-impact-grid {
    position: relative;
    z-index: 1;
}

.journal-impact-card {
    height: 100%;
}

.funfact-section-two.processing-section .journal-impact-card .inner-box {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    height: 100%;
    min-height: 180px;
    padding: 16px 16px;
    border: 1px solid rgba(var(--theme-color-white-rgb), 0.14);
    border-radius: 12px;
    background: rgba(var(--theme-color-white-rgb), 0.065);
    box-shadow: inset 0 1px 0 rgba(var(--theme-color-white-rgb), 0.08);
    backdrop-filter: blur(10px);
}

.funfact-section-two.processing-section .journal-impact-card .inner-box .content-box {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    width: 100%;
}

.funfact-section-two.processing-section .journal-impact-card .inner-box .icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    margin-bottom: 14px;
    margin-left: 0;
    border: 1px solid rgba(var(--theme-color-white-rgb), 0.18);
    border-radius: 9px;
    background: rgba(var(--theme-color-white-rgb), 0.08);
    color: rgba(var(--theme-color-white-rgb), 0.9);
    font-size: 18px;
}

.funfact-section-two.processing-section .journal-impact-card .inner-box .icon::after {
    display: none;
}

.funfact-section-two.processing-section .journal-impact-card .inner-box .content-box .title {
    margin-bottom: 4px;
    color: var(--theme-color-white);
    font-size: 24px;
    line-height: 1;
}

.funfact-section-two.processing-section .journal-impact-card .inner-box .content-box .sub-title {
    display: block;
    margin-bottom: 6px;
    color: rgba(var(--theme-color-white-rgb), 0.9);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.28;
}

.journal-impact-card .inner-box .content-box p {
    margin: 0;
    color: rgba(var(--theme-color-white-rgb), 0.55);
    font-size: 12px;
    line-height: 1.5;
}

.journal-impact-card:hover .inner-box {
    background: rgba(var(--theme-color-white-rgb), 0.11);
}

.journal-impact-card:hover .inner-box .icon i {
    transform: none;
}

.funfact-section-two.processing-section .sec-shape {
    display: none;
}

.funfact-section-two.processing-section .outer-box {
    /* padding: 36px 50px; */
    border: 0;
    border-radius: 0;
    background: transparent;
    margin-left: -120px;;
}

.funfact-section-two.processing-section .row {
    row-gap: 28px;
}

.funfact-section-two.processing-section .sec-title .sub-title {
    min-width: 128px;
    padding: 6px 18px;
    font-size: 12px;
    line-height: 1;
    text-align: center;
}

.funfact-section-two.processing-section .sec-title .title {
    margin-top: 16px;
    margin-bottom: 0;
    font-size: 36px;
    line-height: 1.16;
}

.funfact-section-two.processing-section .sec-title .list {
    margin-top: 24px;
}

.funfact-section-two.processing-section .sec-title .list li {
    font-size: 15px;
    line-height: 1.6;
}

.funfact-section-two.processing-section .funfact-block-two .inner-box {
    padding: 18px 10px;
    border-radius: 8px;
}

.funfact-section-two.processing-section .funfact-block-two .inner-box .icon {
    margin-bottom: 14px;
}

.funfact-section-two.processing-section .funfact-block-two .inner-box .icon svg {
    width: 48px;
    height: 48px;
}

.funfact-section-two.processing-section .funfact-block-two .inner-box .icon::after {
    width: 42px;
    height: 42px;
}

.funfact-section-two.processing-section .funfact-block-two .inner-box .content-box .title {
    font-size: 34px;
    line-height: 1.05;
}

.funfact-section-two.processing-section .funfact-block-two .inner-box .content-box .sub-title {
    margin-top: 8px;
    font-size: 14px;
    line-height: 1.35;
}

@media (max-width: 991px) {
    .funfact-section-two.processing-section .outer-box {
        padding: 42px 24px;
    }
}

@media (max-width: 767px) {
    .funfact-section-two.processing-section .outer-box {
        padding: 36px 18px;
    }

    .funfact-section-two.processing-section .sec-title {
        text-align: center;
    }

    .funfact-section-two.processing-section .sec-title .title {
        font-size: 30px;
    }

    .funfact-section-two.processing-section .sec-title .list {
        display: inline-block;
        text-align: left;
    }
}

.citation-stats-section {
    background: var(--theme-color4);
    padding: 0 0 72px;
}

.citation-stats-box {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(360px, 1.1fr);
    gap: 34px;
    align-items: center;
    padding: 34px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.citation-stats-label {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 14px;
    border-radius: 999px;
    background: var(--theme-color1);
    color: var(--theme-color2);
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.citation-stats-title {
    margin: 14px 0 12px;
    color: var(--theme-color-white);
    font-size: 36px;
    line-height: 1.16;
    font-weight: 800;
}

.citation-stats-text {
    max-width: 540px;
    margin: 0 0 26px;
    color: rgba(var(--theme-color-white-rgb), 0.72);
    font-size: 16px;
    line-height: 1.68;
}

.citation-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.citation-summary-item {
    min-width: 0;
    padding: 14px 16px;
    border-left: 3px solid var(--theme-color1);
    background: rgba(var(--theme-color-white-rgb), 0.08);
}

.citation-summary-item strong {
    display: block;
    color: var(--theme-color-white);
    font-size: 32px;
    line-height: 1;
    font-weight: 800;
}

.citation-summary-item span {
    display: block;
    margin-top: 8px;
    color: rgba(var(--theme-color-white-rgb), 0.66);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    line-height: 1.35;
    text-transform: uppercase;
}

.citation-chart {
    display: grid;
    grid-template-columns: repeat(3, minmax(72px, 1fr));
    gap: 28px;
    align-items: end;
    min-height: 260px;
    padding: 28px 34px 24px;
    border-radius: 10px;
    background: var(--theme-color-white);
    box-shadow: 0 18px 40px rgba(var(--theme-color-black-rgb), 0.16);
}

.citation-bar-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    min-height: 208px;
}

.citation-value {
    margin-bottom: 8px;
    color: var(--theme-color2);
    font-size: 15px;
    font-weight: 800;
    line-height: 1;
}

.citation-bar {
    display: block;
    width: 62px;
    border-radius: 8px 8px 2px 2px;
}

.citation-bar-2024 {
    height: 68px;
    background: rgba(var(--theme-color1-rgb), 0.36);
}

.citation-bar-2025 {
    height: 154px;
    background: var(--theme-color1);
}

.citation-bar-2026 {
    height: 92px;
    background: var(--theme-color6);
}

.citation-year {
    margin-top: 12px;
    color: var(--theme-color2);
    font-size: 15px;
    font-weight: 800;
    line-height: 1;
}

@media (max-width: 1199px) {
    .citation-stats-box {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .citation-stats-section {
        padding-bottom: 54px;
    }

    .citation-stats-box {
        padding: 24px 18px;
    }

    .citation-stats-title {
        font-size: 32px;
    }

    .citation-summary {
        grid-template-columns: 1fr;
    }

    .citation-summary-item strong {
        font-size: 30px;
    }

    .citation-chart {
        gap: 12px;
        min-height: 230px;
        padding: 24px 16px 20px;
    }

    .citation-bar-item {
        min-height: 178px;
    }

    .citation-bar {
        width: 46px;
    }

    .citation-bar-2024 {
        height: 56px;
    }

    .citation-bar-2025 {
        height: 128px;
    }

    .citation-bar-2026 {
        height: 76px;
    }
}

/* Current Issues section */
.service-section-two.home6-style .current-issues-summary {
    max-width: 640px;
    margin: 14px 0 0;
    color: var(--theme-color4);
    font-size: 16px;
    line-height: 1.68;
}

.service-section-two.home6-style .outer-box {
    border-radius: 12px;
}

.service-section-two.home6-style .service-block-two .inner-box {
    padding: 42px 30px 44px;
}

.service-section-two.home6-style .service-block-two .inner-box .content-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 330px;
}

.service-section-two.home6-style .issue-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    margin-bottom: 18px;
    padding: 5px 14px;
    border-radius: 999px;
    background: rgba(var(--theme-color1-rgb), 0.12);
    color: var(--theme-color6);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
    transition: all 300ms ease;
}

.service-section-two.home6-style .issue-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    margin: 0 auto 20px;
    border: 1px solid rgba(var(--theme-color7-rgb), 0.16);
    border-radius: 50%;
    background: rgba(var(--theme-color7-rgb), 0.06);
    color: var(--theme-color7);
    font-size: 27px;
    line-height: 1;
    transition: all 300ms ease;
}

.service-section-two.home6-style .service-block-two .inner-box .content-box .title {
    min-height: 58px;
    margin-bottom: 12px;
    color: var(--theme-color2);
    font-size: 24px;
    line-height: 1.22;
}

.service-section-two.home6-style .service-block-two .inner-box .content-box .text {
    max-width: 330px;
    color: #5f6978;
    font-size: 15px;
    line-height: 1.62;
}

.service-section-two.home6-style .service-block-two .inner-box .content-box .btn-two-rounded {
    margin-top: auto;
}

.service-section-two.home6-style .service-block-two .inner-box:hover .issue-badge {
    background: rgba(var(--theme-color-white-rgb), 0.16);
    color: var(--theme-color-white);
}

.service-section-two.home6-style .service-block-two .inner-box:hover .issue-icon {
    border-color: rgba(var(--theme-color-white-rgb), 0.32);
    background: rgba(var(--theme-color-white-rgb), 0.12);
    color: var(--theme-color-white);
}

/* Featured Articles section */
.featured-articles-section {
    background: #eef3f7;
}

.featured-articles-section .container {
    max-width: 1320px;
}

.featured-articles-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 32px;
}

.featured-articles-header .sec-title .sub-title {
    display: none;
}

.featured-articles-header .sec-title .title {
    margin-bottom: 12px;
    font-size: 40px;
    line-height: 1.16;
}

.featured-articles-header .sec-title .text {
    max-width: 650px;
    margin: 0;
    color: var(--theme-color4);
    font-size: 16px;
    line-height: 1.68;
}

.featured-articles-header .btn-two-rounded {
    flex: 0 0 auto;
    min-width: 210px;
    margin-bottom: 8px;
    border-color: var(--theme-color2);
    background: var(--theme-color2);
    color: var(--theme-color-white);
}

.featured-articles-header .btn-two-rounded i {
    margin-left: 10px;
}

.featured-articles-header .btn-two-rounded:hover {
    border-color: var(--theme-color6);
    background: var(--theme-color6);
    color: var(--theme-color-white);
}

.featured-article-card {
    position: relative;
    height: 100%;
    overflow: hidden;
    border-radius: 14px;
    background: var(--theme-color-white);
    box-shadow: 0 18px 46px rgba(var(--theme-color2-rgb), 0.08);
    transition: transform 300ms ease, box-shadow 300ms ease;
}

.featured-article-card .article-card-link {
    position: absolute;
    inset: 0;
    z-index: 3;
}

.featured-article-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 24px 56px rgba(var(--theme-color2-rgb), 0.13);
}

.featured-article-card .article-thumb {
    position: relative;
    display: block;
    height: 260px;
    overflow: hidden;
    background:
        linear-gradient(rgba(var(--theme-color2-rgb), 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--theme-color2-rgb), 0.05) 1px, transparent 1px),
        #dce7ef;
    background-size: 28px 28px;
}

.featured-article-card .article-thumb::after {
    display: none;
}

.featured-article-card .article-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 1;
    filter: none;
    transition: transform 500ms ease, opacity 300ms ease;
}

.featured-article-card:hover .article-thumb img {
    transform: scale(1.05);
    opacity: 1;
}

.featured-article-card .article-content {
    min-height: 252px;
    padding: 18px 28px 30px;
}

.featured-article-card .article-badge {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    margin-bottom: 15px;
    padding: 5px 12px;
    border-radius: 999px;
    background: rgba(var(--theme-color6-rgb), 0.09);
    color: var(--theme-color6);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.07em;
    line-height: 1;
    text-transform: uppercase;
}

.featured-article-card .article-title {
    display: -webkit-box;
    min-height: 78px;
    margin-bottom: 12px;
    overflow: hidden;
    color: var(--theme-color2);
    font-size: 20px;
    font-weight: 800;
    line-height: 1.3;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.featured-article-card .article-details {
    display: grid;
    gap: 4px;
    margin-bottom: 14px;
    color: rgba(var(--theme-color2-rgb), 0.68);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
}

.featured-article-card .article-author {
    margin-bottom: 18px;
    color: var(--theme-color4);
    font-size: 15px;
    line-height: 1.5;
}

.featured-article-card .article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    color: var(--theme-color4);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.02em;
}

@media (max-width: 991px) {
    .featured-articles-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .featured-articles-header .btn-two-rounded {
        margin-bottom: 0;
    }
}

@media (max-width: 767px) {
    .featured-articles-header .sec-title .title {
        font-size: 32px;
    }

    .featured-article-card .article-content {
        min-height: auto;
    }
}

/* Journal CTA section */
.journal-cta-section .sec-title {
    position: relative;
    z-index: 1;
}

.journal-cta-copy {
    max-width: 760px;
}

.journal-cta-section .sec-title .title {
    max-width: 820px;
    margin-bottom: 18px;
}

.journal-cta-section .sec-title .text {
    max-width: 620px;
    margin: 0;
    color: rgba(var(--theme-color-white-rgb), 0.78);
    font-size: 16px;
    line-height: 1.68;
}

.journal-cta-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 14px;
    min-width: 430px;
}

.journal-cta-actions .btn-one-light {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 205px;
    padding: 20px 28px;
    font-weight: 700;
    text-transform: none;
}

.journal-cta-actions .journal-cta-primary {
    background: var(--theme-color1);
    color: var(--theme-color2);
}

.journal-cta-actions .journal-cta-secondary {
    border: 1px solid rgba(var(--theme-color-white-rgb), 0.34) !important;
    background: rgba(var(--theme-color-white-rgb), 0.08);
    color: var(--theme-color-white);
    backdrop-filter: blur(8px);
}

.journal-cta-actions .journal-cta-primary:hover {
    background: var(--theme-color-white);
    color: var(--theme-color2);
}

.journal-cta-actions .journal-cta-secondary:hover {
    border-color: var(--theme-color-white) !important;
    background: var(--theme-color-white);
    color: var(--theme-color2);
}

@media (max-width: 1199px) {
    .journal-cta-actions {
        justify-content: flex-start;
        min-width: 0;
        width: 100%;
    }
}

@media (max-width: 767px) {
    .journal-cta-section .sec-title .title {
        font-size: 34px;
    }

    .journal-cta-actions .btn-one-light {
        width: 100%;
    }
}

/* News & Blogs stability */
.blog-section .blog-block .inner-box .content-box {
    display: flex;
    flex-direction: column;
    min-height: 206px;
}

.blog-section .blog-block .inner-box .content-box .info {
    flex-wrap: wrap;
    gap: 8px 18px;
}

.blog-section .blog-block .inner-box .content-box .title {
    display: -webkit-box;
    min-height: 86px;
    overflow: hidden;
    color: var(--theme-color2);
    font-size: 25px;
    line-height: 1.36;
    overflow-wrap: anywhere;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.blog-section .blog-block .inner-box .content-box .title a {
    color: inherit;
}

.blog-section .blog-block .inner-box .content-box .arry-btn {
    margin-top: auto;
}

@media (max-width: 767px) {
    .blog-section .blog-block .inner-box .content-box .title {
        min-height: 76px;
        font-size: 22px;
        -webkit-line-clamp: 3;
    }
}

@media (max-width: 575px) {
    .featured-articles-header .sec-title .title,
    .journal-cta-section .sec-title .title,
    .citation-stats-title,
    .funfact-section-two.processing-section .sec-title .title {
        font-size: 30px;
        line-height: 1.2;
    }

    .processing-section:not(.funfact-section-two) .processing-block .inner-box .title,
    .featured-article-card .article-title,
    .service-section-two.home6-style .service-block-two .inner-box .content-box .title {
        min-height: 0;
    }

    .service-section-two.home6-style .service-block-two .inner-box .content-box {
        min-height: 0;
    }

    .blog-section .blog-block .inner-box .content-box .title {
        font-size: 21px;
        line-height: 1.34;
    }
}

/* ==========================================================================
   Editorial Team page
   ========================================================================== */

/* Detailed content-box override for editorial team-block cards */
.team-block .editorial-content {
    padding: 22px 20px 24px;
    text-align: center;
}

.team-block .editorial-content .title {
    margin: 0 0 8px;
    color: #102a43;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.3;
}

.team-block .editorial-affiliation {
    margin: 0 0 6px;
    color: #526173;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.45;
}

.team-block .editorial-country {
    margin: 0 0 14px;
    color: #526173;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
}

.team-block .editorial-flag {
    margin-right: 4px;
    font-size: 14px;
}

.team-block .editorial-divider {
    height: 1px;
    margin: 0 auto 14px;
    background: #e2e8f0;
}

.team-block .editorial-role-title {
    margin: 0 0 4px;
    color: #102a43;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.3;
}

.team-block .editorial-journal {
    margin: 0;
    color: #526173;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.45;
}


.editorial-team-section {
    --editorial-navy: var(--color-primary-dark, #102a43);
    --editorial-blue: var(--color-primary, #1d4ed8);
    --editorial-emerald: var(--color-accent, #047857);
    --editorial-slate: var(--color-text-secondary, #526173);
    --editorial-border: var(--color-border, #dce5ef);
    --editorial-bg: var(--color-surface, #f6f8fb);
    --editorial-soft-blue: var(--color-surface-soft, #eaf2ff);
    --editorial-soft-green: var(--color-surface-soft, #e7f7ef);
    background: var(--editorial-bg);
    padding: 32px 0 100px;
}

.editorial-team-section * {
    letter-spacing: 0;
}

.editorial-team-shell {
    max-width: 1450px;
    margin: 0 auto;
    padding: 0 15px;
}

.editorial-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
    gap: 34px;
    align-items: end;
    margin-bottom: 34px;
}

.editorial-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    padding: 8px 14px;
    border: 1px solid rgba(29, 78, 216, 0.16);
    border-radius: 999px;
    background: #ffffff;
    color: var(--editorial-blue);
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.editorial-hero h1 {
    margin: 0 0 18px;
    color: var(--editorial-navy);
    font-size: clamp(38px, 5vw, 68px);
    font-weight: 800;
    line-height: 1.05;
}

.editorial-hero p {
    max-width: 680px;
    margin: 0;
    color: var(--editorial-slate);
    font-size: 18px;
    line-height: 1.68;
}

.editorial-stats-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 35px;
}

.editorial-stats-grid .editorial-stat-card {
    flex: 0 0 auto;
}

.editorial-stat-card {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.editorial-stat-card > span {
    display: block;
}

.journal-impact-section .editorial-hero-stats {
    max-width: 100%;
    margin-left: 0;
    margin-top: 6px;
}

.journal-impact-section .journal-impact-copy .title {
    margin-bottom: 0;
}

.editorial-hero-section {
    --editorial-hero-indent: 0px;
}

/* Full-bleed navy hero (mirrors issue-spotlight-section / vol pub-arc-hero) */
.funfact-section-two.editorial-hero-section,
.funfact-section-two.processing-section.editorial-hero-section {
    padding: 0 !important;
    background:
        radial-gradient(circle at 82% 70px, rgba(29, 78, 216, 0.38) 0%, transparent 360px),
        radial-gradient(circle at 12% 330px, rgba(7, 22, 48, 0.5) 0%, transparent 340px),
        linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(135deg, #0b2545 0%, #102a55 55%, #0b2545 100%);
    background-size: auto, auto, 72px 72px, 72px 72px, auto;
}

.editorial-hero-section::before,
.editorial-hero-section::after {
    display: none;
}

.editorial-hero-section .container {
    max-width: none;
    padding: 0;
}

.funfact-section-two.processing-section.editorial-hero-section .outer-box {
    max-width: 1450px;
    /* margin: 0 auto;
    padding: 64px 16px 52px; */
    border: 0;
    border-radius: 0;
    background: transparent;
}

.editorial-hero-section .journal-impact-copy,
.editorial-hero-section .editorial-hero-stats {
    margin-left: var(--editorial-hero-indent);
}

.editorial-hero-section .journal-impact-copy {
    max-width: calc(100% - var(--editorial-hero-indent));
}

.editorial-hero-section .editorial-hero-stats {
    max-width: calc(100% - var(--editorial-hero-indent));
}

.editorial-stat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    margin-right: 10px;
    color: #f39c12;
    font-size: 32px;
    line-height: 1;
}

.editorial-stat-value {
    display: block;
    color: #ffffff;
    font-size: 22px;
    font-weight: 800;
    line-height: 1;
}

.editorial-stat-label {
    display: block;
    margin-top: 4px;
    color: #ffffff;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
}

.editorial-controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 14px;
    align-items: center;
    margin-bottom: 18px;
    padding: 18px;
    border: 1px solid var(--editorial-border);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 16px 45px rgba(16, 42, 67, 0.05);
}

.editorial-search,
.editorial-filter {
    position: relative;
}

.editorial-search i,
.editorial-filter i {
    position: absolute;
    top: 50%;
    left: 18px;
    transform: translateY(-50%);
    color: #7b8794;
    font-size: 15px;
    pointer-events: none;
}

.editorial-search input,
.editorial-filter select {
    width: 100%;
    min-height: 54px;
    padding: 0 18px 0 46px;
    border: 1px solid #d6e0eb;
    border-radius: 14px;
    background: #f9fbfd;
    color: var(--editorial-navy);
    font-size: 15px;
    font-weight: 600;
    outline: none;
    transition: border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.editorial-filter select {
    appearance: auto;
    cursor: pointer;
}

.editorial-search input:focus,
.editorial-filter select:focus {
    border-color: rgba(29, 78, 216, 0.48);
    background: #ffffff;
    box-shadow: 0 0 0 4px rgba(29, 78, 216, 0.1);
}

.editorial-result-status {
    margin: 0 0 28px;
    color: var(--editorial-slate);
    font-size: 15px;
    font-weight: 700;
}

.editorial-role-group {
    margin-top: 28px;
}

.editorial-role-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--editorial-border);
}

.editorial-role-header h2 {
    margin: 0 0 8px;
    color: var(--editorial-navy);
    font-size: 28px;
    font-weight: 800;
    line-height: 1.2;
}

.editorial-role-header p {
    max-width: 760px;
    margin: 0;
    color: var(--editorial-slate);
    font-size: 15px;
    line-height: 1.65;
}

.editorial-role-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 112px;
    min-height: 38px;
    padding: 8px 14px;
    border-radius: 999px;
    background: #ffffff;
    color: var(--editorial-blue);
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
    box-shadow: inset 0 0 0 1px rgba(29, 78, 216, 0.14);
}

.editorial-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.editorial-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: 24px;
    border: 1px solid var(--editorial-border);
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 15px 36px rgba(16, 42, 67, 0.06);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.editorial-card:hover {
    transform: translateY(-4px);
    border-color: rgba(29, 78, 216, 0.22);
    box-shadow: 0 20px 48px rgba(16, 42, 67, 0.1);
}

.editorial-card-top {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 18px;
}

.editorial-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 58px;
    width: 58px;
    height: 58px;
    overflow: hidden;
    border-radius: 18px;
    background: linear-gradient(135deg, #1d4ed8 0%, #047857 100%);
    color: #ffffff;
    font-size: 18px;
    font-weight: 800;
}

.editorial-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.editorial-person-name {
    margin: 0 0 8px;
    color: var(--editorial-navy);
    font-size: 21px;
    font-weight: 800;
    line-height: 1.25;
}

.editorial-role-badge {
    display: inline-flex;
    max-width: 100%;
    padding: 7px 10px;
    border-radius: 999px;
    background: var(--editorial-soft-blue);
    color: var(--editorial-blue);
    font-size: 11px;
    font-weight: 800;
    line-height: 1.1;
    text-transform: uppercase;
}

.editorial-meta-list {
    display: grid;
    gap: 11px;
    margin: 0 0 18px;
    padding: 0;
    list-style: none;
}

.editorial-meta-list li {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 10px;
    color: var(--editorial-slate);
    font-size: 14px;
    line-height: 1.48;
}

.editorial-meta-list i {
    margin-top: 3px;
    color: var(--editorial-emerald);
    font-size: 14px;
}

.editorial-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: auto;
    padding-top: 4px;
}

.editorial-tag {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 6px 10px;
    border-radius: 999px;
    background: #f1f5f9;
    color: #475569;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}

.editorial-card-actions {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid #edf2f7;
}

.editorial-scopus-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 10px 14px;
    border-radius: 999px;
    background: var(--editorial-navy);
    color: #ffffff;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
}

.editorial-scopus-link:hover {
    background: var(--editorial-blue);
    color: #ffffff;
}

.editorial-empty-state {
    display: none;
    margin-top: 34px;
    padding: 54px 24px;
    border: 1px dashed #b9c7d8;
    border-radius: 22px;
    background: #ffffff;
    text-align: center;
}

.editorial-empty-state.is-visible {
    display: block;
}

.editorial-empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    margin-bottom: 18px;
    border-radius: 20px;
    background: var(--editorial-soft-blue);
    color: var(--editorial-blue);
    font-size: 24px;
}

.editorial-empty-state h2 {
    margin: 0 0 8px;
    color: var(--editorial-navy);
    font-size: 26px;
    font-weight: 800;
}

.editorial-empty-state p {
    margin: 0;
    color: var(--editorial-slate);
    font-size: 15px;
}

@media (max-width: 991px) {
    .editorial-team-section {
        padding: 28px 0 82px;
    }

    .editorial-hero,
    .editorial-controls {
        grid-template-columns: 1fr;
    }

    .journal-impact-section .editorial-hero-stats {
        max-width: none;
        margin-left: 0;
    }

    .editorial-hero-section .journal-impact-copy,
    .editorial-hero-section .editorial-hero-stats {
        max-width: none;
        margin-left: 0;
    }

    .editorial-stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .editorial-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575px) {
    .editorial-team-section {
        padding: 24px 0 68px;
    }

    .editorial-hero h1 {
        font-size: 40px;
    }

    .editorial-hero p {
        font-size: 16px;
    }

    .editorial-grid {
        grid-template-columns: 1fr;
    }

    .editorial-stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }

    .editorial-role-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .editorial-controls,
    .editorial-card,
    .editorial-stat-card {
        border-radius: 16px;
    }
}

/* ==========================================================================
   Articles Discovery Page — premium academic listing
   Namespace: .ar-*
   ========================================================================== */

.ar-discovery {
    --ar-bg: var(--color-surface, #f5f7fb);
    --ar-surface: var(--color-bg, #ffffff);
    --ar-ink: var(--color-text-primary, #0f1c34);
    --ar-ink-2: var(--color-text-primary, #38486b);
    --ar-muted: var(--color-text-secondary, #6b7891);
    --ar-line: var(--color-border, #e3e8f1);
    --ar-line-2: var(--color-surface-soft, #eef1f7);
    --ar-brand: var(--color-primary, #1f6feb);
    --ar-brand-ink: var(--color-primary-dark, #0b2a5b);
    --ar-accent: var(--color-secondary, #1f6feb);
    --ar-success: var(--color-accent, #11885a);
    --ar-warn: var(--color-secondary, #b46a00);
    --ar-danger: #c0392b;
    --ar-radius: 16px;
    --ar-radius-sm: 10px;
    --ar-shadow-sm: 0 1px 2px rgba(15, 28, 52, 0.05), 0 1px 3px rgba(15, 28, 52, 0.04);
    --ar-shadow-md: 0 6px 24px rgba(15, 28, 52, 0.06), 0 2px 6px rgba(15, 28, 52, 0.04);
    --ar-shadow-lg: 0 12px 40px rgba(15, 28, 52, 0.10);
    background: var(--ar-bg);
    color: var(--ar-ink);
    font-family: inherit;
    padding-bottom: 80px;
}

.ar-discovery * { box-sizing: border-box; }

/* ===== Hero ===== */
/* ===== Articles hero (full-bleed dark navy, mirrors vol.html) ===== */
.ar-hero-section {
    position: relative;
    width: 100%;
    overflow: hidden;
    color: #ffffff;
    background:
        radial-gradient(circle at 85% 20%, rgba(29, 78, 216, 0.45) 0%, transparent 55%),
        radial-gradient(circle at 15% 80%, rgba(7, 22, 48, 0.55) 0%, transparent 50%),
        linear-gradient(135deg, #0b2545 0%, #102a55 50%, #0b2545 100%);
}

.ar-hero-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
    background-size: 56px 56px, 56px 56px;
    opacity: 0.7;
    pointer-events: none;
}

.ar-hero-shell {
    position: relative;
    z-index: 1;
    max-width: 1450px;
    margin: 0 auto;
    padding: 0 20px;
}

.ar-hero {
    position: relative;
    padding: 64px 16px 72px;
    background: transparent;
    border: 0;
    overflow: visible;
    color: #ffffff;
}

.ar-hero__inner {
    max-width: 860px;
    margin: 0 auto;
    text-align: center;
}

.ar-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 11px;
    border-radius: 999px;
    background: rgba(31, 111, 235, 0.10);
    color: var(--ar-brand-ink);
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.02em;
    margin-bottom: 10px;
}

.ar-hero__title {
    font-size: clamp(26px, 3.2vw, 40px);
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: #ffffff;
    margin: 0 0 8px;
    font-weight: 700;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
}

.ar-hero__subtitle {
    font-size: 14.5px;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.78);
    max-width: 640px;
    margin: 0 auto 18px;
    font-weight: 400;
}

.ar-hero__search {
    position: relative;
    display: flex;
    align-items: center;
    background: var(--ar-surface);
    border: 1px solid var(--ar-line);
    border-radius: 999px;
    padding: 4px 4px 4px 18px;
    box-shadow: var(--ar-shadow-md);
    transition: border-color .2s, box-shadow .2s;
    max-width: 620px;
    margin: 0 auto 12px;
}

.ar-hero__search:focus-within {
    border-color: var(--ar-brand);
    box-shadow: 0 0 0 4px rgba(31, 111, 235, 0.12), var(--ar-shadow-md);
}

.ar-hero__search > i {
    color: var(--ar-muted);
    font-size: 15px;
    margin-right: 10px;
}

.ar-hero__search input {
    flex: 1;
    border: 0;
    outline: 0;
    font-size: 14.5px;
    color: var(--ar-ink);
    background: transparent;
    padding: 10px 6px;
    min-width: 0;
}

.ar-hero__search input::placeholder { color: var(--ar-muted); }

.ar-hero__search-clear {
    border: 0;
    background: transparent;
    color: var(--ar-muted);
    width: 30px;
    height: 30px;
    border-radius: 999px;
    cursor: pointer;
    transition: background .15s;
}
.ar-hero__search-clear:hover { background: var(--ar-line-2); color: var(--ar-ink); }

.ar-hero__search-submit {
    border: 0;
    background: var(--ar-brand-ink);
    color: #fff;
    padding: 9px 18px;
    border-radius: 999px;
    font-weight: 600;
    font-size: 13.5px;
    cursor: pointer;
    transition: background .15s, transform .15s;
}
.ar-hero__search-submit:hover { background: #0a2350; transform: translateY(-1px); }

.ar-trending {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 8px;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
}
.ar-trending__label {
    color: var(--ar-muted);
    font-size: 12px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
.ar-trending__label i { color: var(--ar-warn); }
.ar-trending__list { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; }
.ar-trending__chip {
    border: 1px solid var(--ar-line);
    background: var(--ar-surface);
    color: var(--ar-ink-2);
    padding: 4px 11px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all .15s;
}
.ar-trending__chip:hover {
    color: var(--ar-brand-ink);
    border-color: rgba(31, 111, 235, 0.35);
    background: rgba(31, 111, 235, 0.06);
    transform: translateY(-1px);
}

.ar-hero__stats {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 28px;
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: 0;
    box-shadow: none;
    margin: 0 auto;
}
.ar-stat {
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: 0;
    text-align: left;
    box-shadow: none;
    transition: none;
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, 0.92);
}
.ar-stat__icon {
    font-size: 20px;
    color: #f5a623;
    line-height: 1;
}
.ar-stat:hover { transform: none; box-shadow: none; }
.ar-stat__value {
    display: inline-block;
    font-size: 18px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.1;
    letter-spacing: -0.01em;
}
.ar-stat__label {
    display: inline-block;
    font-size: 13px;
    color: #ffffff;
    margin-top: 0;
    font-weight: 500;
    white-space: nowrap;
}

/* Wrap stats in a centered flex container */
.ar-hero__inner > .ar-hero__stats { display: inline-flex; }

/* ===== Featured rail ===== */
.ar-featured { padding: 36px 0 18px; }
.ar-featured__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 22px;
}
.ar-section-title {
    font-size: 26px;
    font-weight: 700;
    color: var(--ar-ink);
    margin: 0 0 6px;
    letter-spacing: -0.01em;
}
.ar-section-sub {
    color: var(--ar-muted);
    font-size: 14.5px;
    margin: 0;
}
.ar-tabs {
    display: inline-flex;
    background: var(--ar-surface);
    border: 1px solid var(--ar-line);
    border-radius: 999px;
    padding: 4px;
    gap: 2px;
    flex-wrap: wrap;
}
.ar-tab {
    border: 0;
    background: transparent;
    color: var(--ar-ink-2);
    font-size: 13.5px;
    font-weight: 600;
    padding: 9px 16px;
    border-radius: 999px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    transition: all .15s;
    white-space: nowrap;
}
.ar-tab:hover { color: var(--ar-brand-ink); }
.ar-tab.is-active {
    background: var(--ar-brand-ink);
    color: #fff;
    box-shadow: 0 4px 14px rgba(11, 42, 91, 0.18);
}

.ar-featured__rail {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(320px, 1fr);
    gap: 18px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 14px;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
}
.ar-featured__rail::-webkit-scrollbar { height: 6px; }
.ar-featured__rail::-webkit-scrollbar-thumb { background: var(--ar-line); border-radius: 999px; }

.ar-featured-card {
    background: var(--ar-surface);
    border: 1px solid var(--ar-line);
    border-radius: var(--ar-radius);
    padding: 22px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    scroll-snap-align: start;
    box-shadow: var(--ar-shadow-sm);
    transition: transform .2s, box-shadow .2s, border-color .2s;
    text-decoration: none;
    color: inherit;
}
.ar-featured-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--ar-shadow-lg);
    border-color: rgba(31, 111, 235, 0.30);
    text-decoration: none;
    color: inherit;
}
.ar-featured-card__top { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.ar-featured-card__title {
    font-size: 17px;
    font-weight: 700;
    line-height: 1.35;
    color: var(--ar-ink);
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.ar-featured-card__authors { font-size: 13px; color: var(--ar-muted); }
.ar-featured-card__metrics {
    margin-top: auto;
    display: flex;
    gap: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--ar-line-2);
    color: var(--ar-ink-2);
    font-size: 13px;
}
.ar-featured-card__metrics span { display: inline-flex; align-items: center; gap: 5px; }
.ar-featured-card__metrics i { color: var(--ar-muted); }

/* ===== Main listing layout ===== */
.ar-main { padding-top: 24px; }
.ar-layout {
    display: grid;
    grid-template-columns: 296px minmax(0, 1fr);
    gap: 32px;
    align-items: flex-start;
}

/* ===== Sidebar ===== */
.ar-sidebar {
    background: var(--ar-surface);
    border: 1px solid var(--ar-line);
    border-radius: var(--ar-radius);
    padding: 16px 16px 8px;
    position: sticky;
    top: 96px;
    max-height: calc(100vh - 110px);
    overflow-y: auto;
    box-shadow: var(--ar-shadow-sm);
}
.ar-sidebar__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--ar-line-2);
    margin-bottom: 4px;
}
.ar-sidebar__title {
    font-size: 15px;
    font-weight: 700;
    color: var(--ar-ink);
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.ar-sidebar__title i { color: var(--ar-brand); }
.ar-clear-all {
    background: transparent;
    border: 0;
    color: var(--ar-brand);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    padding: 4px 6px;
    border-radius: 6px;
    transition: background .15s;
}
.ar-clear-all:hover { background: rgba(31, 111, 235, 0.08); }

.ar-filter-group {
    border-bottom: 1px solid var(--ar-line-2);
    padding: 10px 0;
}
.ar-filter-group:last-child { border-bottom: 0; }
.ar-filter-toggle {
    width: 100%;
    background: transparent;
    border: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 13px;
    font-weight: 700;
    color: var(--ar-ink);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 2px 0 8px;
    cursor: pointer;
}
.ar-filter-toggle i { transition: transform .2s; color: var(--ar-muted); font-size: 11px; }
.ar-filter-group[data-open="false"] .ar-filter-toggle i { transform: rotate(-90deg); }
.ar-filter-group[data-open="false"] .ar-filter-body { display: none; }
.ar-filter-body { display: flex; flex-direction: column; gap: 1px; }

.ar-checkbox {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 6px 8px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 13.5px;
    color: var(--ar-ink-2);
    transition: background .15s;
    user-select: none;
    line-height: 1.35;
}
.ar-checkbox:hover { background: var(--ar-line-2); }
.ar-checkbox input { accent-color: var(--ar-brand); width: 14px; height: 14px; flex: none; }
.ar-checkbox__count {
    margin-left: auto;
    background: var(--ar-line-2);
    color: var(--ar-muted);
    font-size: 11px;
    padding: 1px 7px;
    border-radius: 999px;
    font-weight: 600;
    line-height: 1.5;
}
.ar-checkbox input:checked ~ .ar-checkbox__count { background: rgba(31, 111, 235, 0.12); color: var(--ar-brand-ink); }

.ar-switch {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 6px 8px;
    cursor: pointer;
    font-size: 13.5px;
    color: var(--ar-ink-2);
    user-select: none;
    line-height: 1.35;
}
.ar-switch input { display: none; }
.ar-switch__slider {
    position: relative;
    width: 36px;
    height: 20px;
    background: #d6dbe5;
    border-radius: 999px;
    flex: none;
    transition: background .2s;
}
.ar-switch__slider::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    background: #fff;
    border-radius: 50%;
    transition: transform .2s;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
.ar-switch input:checked ~ .ar-switch__slider { background: var(--ar-brand); }
.ar-switch input:checked ~ .ar-switch__slider::after { transform: translateX(16px); }

/* ===== Toolbar ===== */
.ar-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    background: var(--ar-surface);
    border: 1px solid var(--ar-line);
    border-radius: var(--ar-radius);
    padding: 14px 18px;
    margin-bottom: 18px;
    box-shadow: var(--ar-shadow-sm);
}
.ar-toolbar__left { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; flex: 1; min-width: 0; }
.ar-toolbar__right { display: inline-flex; align-items: center; gap: 10px; flex-wrap: nowrap; flex-shrink: 0; }
@media (max-width: 700px) { .ar-toolbar__right { flex-wrap: wrap; } }
.ar-result-count { font-size: 14px; color: var(--ar-ink-2); font-weight: 600; }
.ar-result-count strong { color: var(--ar-ink); }

.ar-active-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.ar-active-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(31, 111, 235, 0.10);
    color: var(--ar-brand-ink);
    padding: 4px 10px 4px 12px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 600;
}
.ar-active-chip button {
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    padding: 2px;
    line-height: 0;
    border-radius: 999px;
}
.ar-active-chip button:hover { background: rgba(31, 111, 235, 0.18); }

.ar-sort { display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0; }
.ar-sort__label {
    font-size: 13px;
    color: var(--ar-muted);
    font-weight: 500;
    white-space: nowrap;
    line-height: 1;
}
.ar-sort__select {
    height: 38px;
    border: 1px solid var(--ar-line);
    background: var(--ar-surface);
    color: var(--ar-ink);
    border-radius: 10px;
    padding: 0 34px 0 14px;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 36px;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7891' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'></polyline></svg>");
    background-repeat: no-repeat;
    background-position: right 12px center;
    transition: border-color .15s, box-shadow .15s;
}
.ar-sort__select:hover { border-color: rgba(31, 111, 235, 0.36); }
.ar-sort__select:focus { outline: 0; border-color: var(--ar-brand); box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.14); }

.ar-view {
    display: inline-flex;
    border: 1px solid var(--ar-line);
    border-radius: 10px;
    overflow: hidden;
    height: 38px;
    flex-shrink: 0;
}
.ar-view__btn {
    border: 0;
    background: var(--ar-surface);
    color: var(--ar-muted);
    width: 38px;
    height: 100%;
    cursor: pointer;
    transition: all .15s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}
.ar-view__btn + .ar-view__btn { border-left: 1px solid var(--ar-line); }
.ar-view__btn:hover { color: var(--ar-ink); background: var(--ar-line-2); }
.ar-view__btn.is-active { background: var(--ar-brand-ink); color: #fff; }
.ar-view__btn.is-active + .ar-view__btn,
.ar-view__btn.is-active { border-left-color: var(--ar-brand-ink); }

.ar-mobile-filter {
    display: none;
    border: 1px solid var(--ar-line);
    background: var(--ar-surface);
    color: var(--ar-ink);
    padding: 8px 14px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    align-items: center;
    gap: 6px;
}

/* ===== Article cards ===== */
.ar-list { display: flex; flex-direction: column; gap: 16px; }
.ar-list[data-view="grid"] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
    gap: 18px;
}

.ar-card {
    background: var(--ar-surface);
    border: 1px solid var(--ar-line);
    border-radius: var(--ar-radius);
    padding: 18px 20px;
    box-shadow: var(--ar-shadow-sm);
    transition: transform .2s, box-shadow .2s, border-color .2s;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.ar-card:hover {
    border-color: rgba(31, 111, 235, 0.32);
    box-shadow: var(--ar-shadow-md);
    transform: translateY(-2px);
}
.ar-card__badges { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }

.ar-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 5px;
    line-height: 1.4;
}
.ar-badge--oa::before { width: 6px; height: 6px; }
.ar-badge--type { background: rgba(11, 42, 91, 0.08); color: var(--ar-brand-ink); }
.ar-badge--oa { background: rgba(17, 136, 90, 0.10); color: var(--ar-success); }
.ar-badge--oa::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--ar-success); display: inline-block; }
.ar-badge--pr { background: rgba(31, 111, 235, 0.10); color: var(--ar-brand); }
.ar-badge--press { background: rgba(180, 106, 0, 0.10); color: var(--ar-warn); }
.ar-badge--cited { background: linear-gradient(135deg, #fff5e0, #ffe6b3); color: #8a5a00; border: 1px solid #ffd98a; }
.ar-badge--trending { background: rgba(192, 57, 43, 0.08); color: var(--ar-danger); }

.ar-meta-line {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 12px;
    color: var(--ar-muted);
    align-items: center;
}
.ar-meta-line strong { color: var(--ar-ink-2); font-weight: 600; }
.ar-meta-line .dot { width: 3px; height: 3px; border-radius: 50%; background: var(--ar-line); }

.ar-card__title {
    font-size: 17px;
    font-weight: 700;
    line-height: 1.32;
    letter-spacing: -0.005em;
    color: var(--ar-ink);
    margin: 0;
}
.ar-card__title a { color: inherit; text-decoration: none; transition: color .15s; }
.ar-card__title a:hover { color: var(--ar-brand); }

.ar-card__authors {
    font-size: 13px;
    color: var(--ar-ink-2);
    line-height: 1.5;
}
.ar-card__authors b { color: var(--ar-ink); font-weight: 600; }

.ar-card__abstract {
    font-size: 13.5px;
    color: var(--ar-ink-2);
    line-height: 1.6;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ar-card__doi {
    font-size: 12px;
    color: var(--ar-muted);
    font-family: 'SF Mono', Menlo, Consolas, monospace;
}
.ar-card__doi a { color: var(--ar-brand); text-decoration: none; }
.ar-card__doi a:hover { text-decoration: underline; }

.ar-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.ar-tag {
    font-size: 10.5px;
    padding: 3px 9px;
    border-radius: 999px;
    background: rgba(11, 42, 91, 0.08);
    color: var(--ar-brand-ink);
    border: 1px solid transparent;
    cursor: pointer;
    transition: all .15s;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    line-height: 1.4;
}
.ar-tag:hover { background: rgba(31, 111, 235, 0.14); border-color: rgba(31, 111, 235, 0.28); }
.ar-tag--keyword {
    background: transparent;
    border: 0;
    color: var(--ar-muted);
    font-weight: 500;
    padding: 0;
    font-size: 12px;
    cursor: default;
    text-transform: none;
    letter-spacing: 0;
    border-radius: 0;
}
.ar-tag--keyword:hover { background: transparent; border-color: transparent; color: var(--ar-ink-2); }
.ar-tag--keyword::before { content: '#'; color: var(--ar-brand); margin-right: 1px; font-weight: 700; }
.ar-tag--keyword + .ar-tag--keyword { margin-left: 4px; }

.ar-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--ar-line-2);
}

.ar-metrics {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
.ar-metric {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    color: var(--ar-ink-2);
    font-weight: 500;
}
.ar-metric i { color: var(--ar-muted); font-size: 12px; }
.ar-metric strong { color: var(--ar-ink); font-weight: 700; }
.ar-metric--cite strong { color: var(--ar-brand-ink); }

/* mini citation impact bar */
.ar-impact {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 11.5px;
    color: var(--ar-muted);
}
.ar-impact__bar {
    width: 90px;
    height: 4px;
    background: var(--ar-line-2);
    border-radius: 999px;
    overflow: hidden;
    position: relative;
}
.ar-impact__bar::after {
    content: '';
    position: absolute;
    inset: 0;
    width: var(--impact, 0%);
    background: linear-gradient(90deg, var(--ar-brand), #5aa3ff);
    border-radius: 999px;
}

.ar-actions { display: flex; gap: 4px; flex-wrap: wrap; }
.ar-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid var(--ar-line);
    background: var(--ar-surface);
    color: var(--ar-ink-2);
    padding: 5px 10px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all .15s;
    text-decoration: none;
    white-space: nowrap;
    line-height: 1.4;
}
.ar-btn i { font-size: 11.5px; }
.ar-btn:hover {
    border-color: rgba(31, 111, 235, 0.36);
    color: var(--ar-brand-ink);
    background: rgba(31, 111, 235, 0.04);
    text-decoration: none;
}
.ar-btn--primary {
    background: var(--ar-brand-ink);
    color: #fff;
    border-color: var(--ar-brand-ink);
}
.ar-btn--primary:hover { background: #0a2350; color: #fff; border-color: #0a2350; }
.ar-btn--icon { padding: 5px 8px; }
.ar-btn--icon i { font-size: 12px; }
.ar-btn[aria-pressed="true"] {
    background: rgba(31, 111, 235, 0.10);
    border-color: rgba(31, 111, 235, 0.32);
    color: var(--ar-brand-ink);
}

/* ===== Empty state ===== */
.ar-empty {
    text-align: center;
    padding: 70px 24px;
    background: var(--ar-surface);
    border: 1px dashed var(--ar-line);
    border-radius: var(--ar-radius);
}
.ar-empty__art {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    background: rgba(31, 111, 235, 0.08);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ar-brand);
    font-size: 36px;
    margin-bottom: 18px;
}
.ar-empty__title { font-size: 20px; font-weight: 700; color: var(--ar-ink); margin: 0 0 6px; }
.ar-empty__text { color: var(--ar-muted); margin: 0 0 20px; font-size: 14.5px; }

/* ===== Pagination ===== */
.ar-pagination {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: 36px;
    flex-wrap: wrap;
}
.ar-page {
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border-radius: 10px;
    border: 1px solid var(--ar-line);
    background: var(--ar-surface);
    color: var(--ar-ink-2);
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    transition: all .15s;
}
.ar-page:hover:not(:disabled) { border-color: var(--ar-brand); color: var(--ar-brand-ink); }
.ar-page.is-active { background: var(--ar-brand-ink); border-color: var(--ar-brand-ink); color: #fff; }
.ar-page:disabled { opacity: .4; cursor: not-allowed; }

/* ===== Skeleton ===== */
.ar-skel {
    background: linear-gradient(90deg, #eef1f7 0%, #f6f8fb 50%, #eef1f7 100%);
    background-size: 200% 100%;
    animation: arShimmer 1.4s infinite linear;
    border-radius: 8px;
}
@keyframes arShimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.ar-skel-card { padding: 22px; border: 1px solid var(--ar-line); border-radius: var(--ar-radius); background: var(--ar-surface); }
.ar-skel-line { height: 14px; margin-bottom: 10px; }
.ar-skel-line:last-child { margin-bottom: 0; }

/* ===== Offcanvas backdrop ===== */
.ar-offcanvas-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(15, 28, 52, 0.45);
    z-index: 1040;
    opacity: 0;
    transition: opacity .2s;
}
.ar-offcanvas-backdrop.is-open { opacity: 1; }

/* ===== Responsive ===== */
@media (max-width: 1100px) {
    .ar-layout { grid-template-columns: 260px minmax(0, 1fr); gap: 22px; }
    .ar-card__title { font-size: 20px; }
}

@media (max-width: 900px) {
    .ar-hero { padding: 26px 0 20px; }
    .ar-hero__stats { padding: 4px 4px; }
    .ar-stat { padding: 6px 12px; }
    .ar-stat__value { font-size: 16px; }
    .ar-stat__label { font-size: 11.5px; }
    .ar-layout { grid-template-columns: 1fr; }
    .ar-sidebar {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: min(86vw, 360px);
        max-height: 100vh;
        border-radius: 0;
        z-index: 1050;
        transform: translateX(-100%);
        transition: transform .25s ease;
        padding-top: 22px;
    }
    .ar-sidebar.is-open { transform: translateX(0); }
    .ar-mobile-filter { display: inline-flex; }
    .ar-featured__head { flex-direction: column; align-items: flex-start; }
    .ar-card { padding: 20px; }
    .ar-card__title { font-size: 18px; }
    .ar-hero__search-submit { padding: 10px 16px; font-size: 14px; }
}

@media (max-width: 560px) {
    .ar-hero__title { font-size: 32px; }
    .ar-hero__search { padding: 6px 6px 6px 16px; }
    .ar-hero__search > i { display: none; }
    .ar-toolbar { padding: 12px 14px; }
    .ar-card { padding: 18px; }
    .ar-card__footer { flex-direction: column; align-items: stretch; }
    .ar-actions { width: 100%; }
    .ar-actions .ar-btn { flex: 1; justify-content: center; }
    .ar-tabs { width: 100%; overflow-x: auto; }
}

@media (prefers-reduced-motion: reduce) {
    .ar-discovery * { transition: none !important; animation: none !important; }
}

/* ===== Sidebar Featured preset list ===== */
.ar-preset-list { gap: 1px; }
.ar-preset {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    border: 1px solid transparent;
    background: transparent;
    color: var(--ar-ink-2);
    padding: 7px 10px;
    border-radius: 8px;
    font-size: 13.5px;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
    transition: all .15s;
    line-height: 1.35;
}
.ar-preset i { color: var(--ar-muted); width: 14px; text-align: center; font-size: 13px; }
.ar-preset:hover { background: var(--ar-line-2); color: var(--ar-ink); }
.ar-preset.is-active {
    background: rgba(31, 111, 235, 0.10);
    color: var(--ar-brand-ink);
    border-color: rgba(31, 111, 235, 0.24);
}
.ar-preset.is-active i { color: var(--ar-brand); }

/* ==========================================================================
   Publications Archive (vol.html)
   Modern scholarly archive — premium academic look-and-feel.
   Namespace: .pub-arc-*
   ========================================================================== */
.pub-arc-section {
    --pa-navy: var(--color-primary-dark, #0b2545);
    --pa-blue: var(--color-primary, #1d4ed8);
    --pa-blue-soft: var(--color-surface-soft, #eaf2ff);
    --pa-amber: var(--color-secondary, #b45309);
    --pa-amber-soft: var(--color-surface-soft, #fff7ed);
    --pa-emerald: var(--color-accent, #047857);
    --pa-emerald-soft: var(--color-surface-soft, #ecfdf5);
    --pa-slate: var(--color-text-secondary, #526173);
    --pa-line: var(--color-border, #e3eaf2);
    --pa-line-soft: var(--color-surface-soft, #eef2f7);
    --pa-bg: var(--color-surface, #f6f8fb);
    --pa-bg-2: var(--color-bg, #fbfcfe);
    --pa-card: var(--color-bg, #ffffff);
    --pa-shadow-sm: 0 1px 2px rgba(11, 37, 69, 0.04), 0 4px 14px rgba(11, 37, 69, 0.05);
    --pa-shadow-md: 0 6px 20px rgba(11, 37, 69, 0.06), 0 22px 60px rgba(11, 37, 69, 0.07);
    --pa-radius: 18px;
    --pa-radius-sm: 12px;
    background: linear-gradient(180deg, #ffffff 0%, var(--pa-bg) 38%, var(--pa-bg) 100%);
    padding: 64px 0 110px;
}

.pub-arc-section *,
.pub-arc-section *::before,
.pub-arc-section *::after {
    box-sizing: border-box;
    letter-spacing: 0;
}

.pub-arc-shell {
    max-width: 1450px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ---------- 1. Hero ---------- */
.pub-arc-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr);
    gap: 48px;
    align-items: end;
    padding-bottom: 36px;
    border-bottom: 1px solid var(--pa-line);
    margin-bottom: 28px;
}

.pub-arc-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
    padding: 8px 16px;
    border: 1px solid rgba(29, 78, 216, 0.18);
    border-radius: 999px;
    background: #fff;
    color: var(--pa-blue);
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.pub-arc-eyebrow i { font-size: 13px; }

.pub-arc-title {
    margin: 0 0 16px;
    color: var(--pa-navy);
    font-size: clamp(34px, 4.4vw, 56px);
    font-weight: 800;
    line-height: 1.06;
    text-wrap: balance;
}

.pub-arc-lead {
    max-width: 620px;
    margin: 0 0 28px;
    color: var(--pa-slate);
    font-size: 17px;
    line-height: 1.68;
}

/* Search bar */
.pub-arc-search {
    position: relative;
    display: flex;
    align-items: center;
    max-width: 640px;
    margin-bottom: 24px;
    padding: 6px;
    border: 1px solid var(--pa-line);
    border-radius: 999px;
    background: #fff;
    box-shadow: var(--pa-shadow-sm);
    transition: box-shadow 200ms ease, border-color 200ms ease;
}

.pub-arc-search:focus-within {
    border-color: rgba(29, 78, 216, 0.35);
    box-shadow: 0 0 0 4px rgba(29, 78, 216, 0.1), var(--pa-shadow-sm);
}

.pub-arc-search > i {
    flex: 0 0 auto;
    width: 44px;
    text-align: center;
    color: var(--pa-slate);
    font-size: 16px;
}

.pub-arc-search input {
    flex: 1 1 auto;
    width: 100%;
    min-height: 46px;
    padding: 0 12px 0 0;
    border: 0;
    background: transparent;
    color: var(--pa-navy);
    font-size: 15px;
    font-weight: 600;
    outline: none;
}

.pub-arc-search input::placeholder { color: #98a3b3; font-weight: 500; }

.pub-arc-search-clear {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    margin-right: 4px;
    border: 0;
    border-radius: 50%;
    background: var(--pa-bg);
    color: var(--pa-slate);
    cursor: pointer;
    transition: background 160ms ease, color 160ms ease;
}
.pub-arc-search-clear:hover { background: var(--pa-blue-soft); color: var(--pa-blue); }

/* Browse by year quick chips */
.pub-arc-quick {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.pub-arc-quick-label {
    color: var(--pa-slate);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.pub-arc-quick-years {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.pub-arc-quick-year {
    padding: 8px 14px;
    border: 1px solid var(--pa-line);
    border-radius: 999px;
    background: #fff;
    color: var(--pa-navy);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all 160ms ease;
}
.pub-arc-quick-year:hover {
    border-color: rgba(29, 78, 216, 0.32);
    color: var(--pa-blue);
    transform: translateY(-1px);
}
.pub-arc-quick-year.is-active {
    background: var(--pa-navy);
    border-color: var(--pa-navy);
    color: #fff;
}

/* Hero stats */
.pub-arc-hero-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    padding: 22px;
    border: 1px solid var(--pa-line);
    border-radius: 22px;
    background: linear-gradient(180deg, #fff 0%, var(--pa-bg-2) 100%);
    box-shadow: var(--pa-shadow-md);
}

.pub-arc-stat {
    position: relative;
    padding: 16px 16px 14px;
    border: 1px solid var(--pa-line-soft);
    border-radius: var(--pa-radius-sm);
    background: #fff;
    transition: transform 180ms ease, box-shadow 180ms ease;
}
.pub-arc-stat:hover {
    transform: translateY(-2px);
    box-shadow: var(--pa-shadow-sm);
}

.pub-arc-stat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin-bottom: 10px;
    border-radius: 10px;
    background: var(--pa-blue-soft);
    color: var(--pa-blue);
    font-size: 15px;
}

.pub-arc-stat-value {
    display: block;
    color: var(--pa-navy);
    font-size: 24px;
    font-weight: 800;
    line-height: 1.05;
}

.pub-arc-stat-label {
    display: block;
    margin-top: 4px;
    color: var(--pa-slate);
    font-size: 12px;
    font-weight: 600;
}

/* ---------- 2. Year timeline ---------- */
.pub-arc-timeline {
    position: sticky;
    top: 84px;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 36px;
    padding: 10px;
    border: 1px solid var(--pa-line);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: saturate(140%) blur(10px);
    -webkit-backdrop-filter: saturate(140%) blur(10px);
    box-shadow: var(--pa-shadow-sm);
}

.pub-arc-timeline-nav {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border: 1px solid var(--pa-line);
    border-radius: 50%;
    background: #fff;
    color: var(--pa-navy);
    cursor: pointer;
    transition: all 160ms ease;
}
.pub-arc-timeline-nav:hover { background: var(--pa-navy); color: #fff; border-color: var(--pa-navy); }

.pub-arc-timeline-track {
    flex: 1 1 auto;
    display: flex;
    gap: 6px;
    margin: 0;
    padding: 4px 6px;
    list-style: none;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
}
.pub-arc-timeline-track::-webkit-scrollbar { display: none; }

.pub-arc-timeline-item {
    flex: 0 0 auto;
}

.pub-arc-timeline-btn {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    min-width: 78px;
    padding: 8px 14px;
    border: 1px solid transparent;
    border-radius: 999px;
    background: transparent;
    color: var(--pa-slate);
    cursor: pointer;
    transition: all 160ms ease;
}
.pub-arc-timeline-btn:hover {
    color: var(--pa-navy);
    background: var(--pa-bg);
}
.pub-arc-timeline-btn .yr {
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
}
.pub-arc-timeline-btn .ct {
    font-size: 10.5px;
    font-weight: 600;
    color: #8493a5;
}
.pub-arc-timeline-btn.is-active {
    background: var(--pa-navy);
    border-color: var(--pa-navy);
    color: #fff;
}
.pub-arc-timeline-btn.is-active .ct { color: rgba(255, 255, 255, 0.78); }

/* ---------- 3. Featured latest issue ---------- */
.pub-arc-featured {
    display: grid;
    grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1.4fr);
    gap: 0;
    margin-bottom: 56px;
    border: 1px solid var(--pa-line);
    border-radius: 26px;
    overflow: hidden;
    background: linear-gradient(135deg, #ffffff 0%, var(--pa-bg-2) 100%);
    box-shadow: var(--pa-shadow-md);
}

.pub-arc-featured-cover {
    position: relative;
    min-height: 100%;
    background: linear-gradient(135deg, #1e3a8a, #0b2545);
    overflow: hidden;
}
.pub-arc-featured-cover img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    opacity: 0.6;
    mix-blend-mode: luminosity;
}
.pub-arc-featured-cover::after {
    content: "";
    position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(11, 37, 69, 0.0) 30%, rgba(11, 37, 69, 0.6) 100%);
}
.pub-arc-featured-cover-meta {
    position: absolute;
    bottom: 22px; left: 22px; right: 22px;
    display: flex; gap: 10px;
    flex-wrap: wrap;
    z-index: 2;
}
.pub-arc-cover-pill {
    display: inline-flex;
    align-items: center; gap: 6px;
    padding: 7px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.95);
    color: var(--pa-navy);
    font-size: 11.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.pub-arc-cover-pill.oa { background: var(--pa-emerald); color: #fff; }

.pub-arc-featured-body {
    padding: 36px 38px;
}
.pub-arc-featured-eyebrow {
    display: inline-flex;
    align-items: center; gap: 8px;
    margin-bottom: 14px;
    color: var(--pa-amber);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.pub-arc-featured-eyebrow::before {
    content: ""; width: 22px; height: 2px;
    background: var(--pa-amber);
    border-radius: 2px;
}

.pub-arc-featured h2 {
    margin: 0 0 12px;
    color: var(--pa-navy);
    font-size: clamp(24px, 2.4vw, 32px);
    font-weight: 800;
    line-height: 1.18;
}

.pub-arc-featured-desc {
    margin: 0 0 22px;
    color: var(--pa-slate);
    font-size: 15.5px;
    line-height: 1.68;
}

.pub-arc-featured-meta {
    display: flex; flex-wrap: wrap;
    gap: 18px 26px;
    margin-bottom: 24px;
    padding: 16px 18px;
    border: 1px solid var(--pa-line-soft);
    border-radius: var(--pa-radius-sm);
    background: var(--pa-bg-2);
}
.pub-arc-featured-meta-item { display: flex; flex-direction: column; gap: 2px; }
.pub-arc-featured-meta-item .k {
    font-size: 11px; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.06em;
    color: #8493a5;
}
.pub-arc-featured-meta-item .v {
    font-size: 14.5px; font-weight: 800;
    color: var(--pa-navy);
}

.pub-arc-featured-article {
    padding: 14px 16px;
    margin-bottom: 22px;
    border-left: 3px solid var(--pa-blue);
    background: var(--pa-blue-soft);
    border-radius: 0 var(--pa-radius-sm) var(--pa-radius-sm) 0;
}
.pub-arc-featured-article .label {
    display: block; margin-bottom: 4px;
    color: var(--pa-blue);
    font-size: 11px; font-weight: 800;
    text-transform: uppercase; letter-spacing: 0.06em;
}
.pub-arc-featured-article .ftitle {
    color: var(--pa-navy);
    font-size: 15px; font-weight: 700; line-height: 1.4;
}
.pub-arc-featured-article .fauth {
    color: var(--pa-slate); font-size: 13px; font-weight: 600;
}

.pub-arc-cta-row { display: flex; flex-wrap: wrap; gap: 10px; }
.pub-arc-btn {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 12px 20px;
    border: 1px solid var(--pa-line);
    border-radius: 999px;
    background: #fff;
    color: var(--pa-navy);
    font-size: 14px; font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    transition: all 180ms ease;
}
.pub-arc-btn:hover {
    border-color: var(--pa-navy);
    transform: translateY(-1px);
    box-shadow: var(--pa-shadow-sm);
}
.pub-arc-btn.primary {
    background: var(--pa-navy);
    border-color: var(--pa-navy);
    color: #fff;
}
.pub-arc-btn.primary:hover { background: var(--pa-blue); border-color: var(--pa-blue); }

/* ---------- 4. Toolbar ---------- */
.pub-arc-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
    padding: 16px 18px;
    border: 1px solid var(--pa-line);
    border-radius: var(--pa-radius);
    background: #fff;
    box-shadow: var(--pa-shadow-sm);
    position: sticky;
    top: 152px;
    z-index: 4;
    backdrop-filter: saturate(140%) blur(8px);
}
.pub-arc-toolbar-left,
.pub-arc-toolbar-right {
    display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
}
.pub-arc-field {
    position: relative; display: inline-flex; align-items: center;
    flex: 0 0 auto;
}
.pub-arc-field i {
    position: absolute; left: 14px;
    color: var(--pa-slate); font-size: 13px;
    pointer-events: none;
}
.pub-arc-field select {
    appearance: none;
    min-height: 42px;
    padding: 0 36px 0 38px;
    border: 1px solid var(--pa-line);
    border-radius: 10px;
    background: #fff
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path fill='%23526173' d='M5 6 0 0h10z'/></svg>")
        no-repeat right 14px center;
    color: var(--pa-navy);
    font-size: 13.5px; font-weight: 700;
    cursor: pointer;
    outline: none;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}
.pub-arc-field select:focus {
    border-color: rgba(29, 78, 216, 0.4);
    box-shadow: 0 0 0 4px rgba(29, 78, 216, 0.1);
}

.pub-arc-toggle {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 10px 14px;
    border: 1px solid var(--pa-line);
    border-radius: 10px;
    background: #fff;
    color: var(--pa-navy);
    font-size: 13px; font-weight: 700;
    cursor: pointer;
    user-select: none;
}
.pub-arc-toggle input { accent-color: var(--pa-emerald); cursor: pointer; }

.pub-arc-result-status {
    margin: 0; color: var(--pa-slate);
    font-size: 13px; font-weight: 700;
}
.pub-arc-view-toggle {
    display: inline-flex;
    border: 1px solid var(--pa-line);
    border-radius: 10px;
    overflow: hidden;
}
.pub-arc-view-toggle button {
    width: 40px; height: 40px;
    border: 0; background: #fff;
    color: var(--pa-slate); font-size: 14px;
    cursor: pointer;
    transition: all 160ms ease;
}
.pub-arc-view-toggle button + button { border-left: 1px solid var(--pa-line); }
.pub-arc-view-toggle button:hover { color: var(--pa-navy); background: var(--pa-bg); }
.pub-arc-view-toggle button.is-active { background: var(--pa-navy); color: #fff; }

/* ---------- 5. Active filter chips ---------- */
.pub-arc-chips {
    display: flex; flex-wrap: wrap; gap: 8px;
    margin-bottom: 24px;
}
.pub-arc-chip {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 6px 10px 6px 12px;
    border: 1px solid rgba(29, 78, 216, 0.22);
    border-radius: 999px;
    background: var(--pa-blue-soft);
    color: var(--pa-blue);
    font-size: 12px; font-weight: 700;
}
.pub-arc-chip button {
    width: 18px; height: 18px;
    border: 0; border-radius: 50%;
    background: rgba(29, 78, 216, 0.12);
    color: var(--pa-blue);
    font-size: 10px;
    cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
}
.pub-arc-chip button:hover { background: var(--pa-blue); color: #fff; }
.pub-arc-chip-clear {
    border: 0; background: transparent;
    color: var(--pa-slate);
    font-size: 12px; font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}
.pub-arc-chip-clear:hover { color: var(--pa-navy); }

/* ---------- 6. Volume groups ---------- */
.pub-arc-volume {
    margin-bottom: 56px;
    scroll-margin-top: 200px;
}

.pub-arc-volume-header {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    align-items: end;
    padding: 4px 0 18px 18px;
    margin-bottom: 22px;
    border-bottom: 1px solid var(--pa-line);
}
/* Accent vertikal di sisi kiri (tab marker) — lebih jelas sebagai penanda
   bagian volume, tidak ambigu seperti progress bar. */
.pub-arc-volume-header::before {
    content: "";
    position: absolute;
    left: 0; top: 4px; bottom: 18px;
    width: 4px;
    background: linear-gradient(180deg, var(--pa-blue), var(--pa-amber));
    border-radius: 4px;
}
.pub-arc-volume-eyebrow {
    color: var(--pa-amber);
    font-size: 12px; font-weight: 800;
    text-transform: uppercase; letter-spacing: 0.08em;
    margin-bottom: 6px;
    display: block;
}
.pub-arc-volume-title {
    margin: 0 0 6px;
    color: var(--pa-navy);
    font-size: clamp(24px, 2.2vw, 30px);
    font-weight: 800;
    line-height: 1.16;
}
.pub-arc-volume-sub {
    margin: 0;
    color: var(--pa-slate);
    font-size: 14px;
    font-weight: 600;
}
.pub-arc-volume-mini {
    display: flex; flex-wrap: wrap; gap: 18px;
    justify-content: flex-end;
}
.pub-arc-volume-mini-item {
    text-align: right;
}
.pub-arc-volume-mini-item .k {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #8493a5;
    font-size: 10.5px; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.06em;
}
.pub-arc-volume-mini-item .k i {
    color: var(--pa-blue);
    font-size: 11px;
}
.pub-arc-volume-mini-item .v {
    display: block;
    color: var(--pa-navy);
    font-size: 18px; font-weight: 800;
    font-variant-numeric: tabular-nums;
    margin-top: 2px;
}

/* ---------- Issue cards ---------- */
.pub-arc-issues {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 22px;
}

.pub-arc-section.is-list-view .pub-arc-issues {
    grid-template-columns: 1fr;
}
.pub-arc-section.is-list-view .pub-arc-issue {
    grid-template-columns: 180px minmax(0, 1fr);
    grid-template-rows: auto;
}
.pub-arc-section.is-list-view .pub-arc-issue-cover { aspect-ratio: auto; min-height: 100%; }

.pub-arc-issue {
    display: grid;
    grid-template-rows: 160px auto;
    border: 1px solid var(--pa-line);
    border-radius: var(--pa-radius);
    background: var(--pa-card);
    overflow: hidden;
    transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
}
.pub-arc-issue:hover {
    transform: translateY(-3px);
    border-color: rgba(29, 78, 216, 0.22);
    box-shadow: var(--pa-shadow-md);
}

.pub-arc-issue-cover {
    position: relative;
    background: linear-gradient(135deg, #1e3a8a, #0b2545);
    overflow: hidden;
}
.pub-arc-issue-cover img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover; opacity: 0.55;
    mix-blend-mode: luminosity;
    transition: transform 600ms ease, opacity 300ms ease;
}
.pub-arc-issue:hover .pub-arc-issue-cover img { transform: scale(1.06); opacity: 0.7; }

.pub-arc-issue-cover-tag {
    position: absolute; top: 12px; left: 12px;
    display: inline-flex; align-items: center; gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.95);
    color: var(--pa-navy);
    font-size: 11px; font-weight: 800;
    text-transform: uppercase; letter-spacing: 0.04em;
}
.pub-arc-issue-cover-oa {
    position: absolute; top: 12px; right: 12px;
    padding: 5px 9px;
    border-radius: 999px;
    background: var(--pa-emerald);
    color: #fff;
    font-size: 10.5px; font-weight: 800;
    text-transform: uppercase; letter-spacing: 0.05em;
}
.pub-arc-issue-cover-topic {
    position: absolute; bottom: 12px; left: 12px;
    padding: 5px 10px;
    border-radius: 8px;
    background: rgba(11, 37, 69, 0.78);
    color: #fff;
    font-size: 11px; font-weight: 700;
    backdrop-filter: blur(4px);
}

.pub-arc-issue-body {
    display: flex; flex-direction: column;
    padding: 18px 18px 16px;
    gap: 10px;
}

.pub-arc-issue-date {
    color: var(--pa-slate);
    font-size: 12px; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.05em;
}

.pub-arc-issue-title {
    margin: 0;
    color: var(--pa-navy);
    font-size: 16.5px; font-weight: 800;
    line-height: 1.32;
    text-wrap: balance;
}

.pub-arc-issue-desc {
    margin: 0;
    color: var(--pa-slate);
    font-size: 13.5px;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.pub-arc-issue-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    padding: 12px 0 4px;
    border-top: 1px dashed var(--pa-line);
    margin-top: auto;
}
.pub-arc-issue-metric {
    text-align: left;
}
.pub-arc-issue-metric i {
    display: block;
    margin-bottom: 4px;
    color: var(--pa-blue);
    font-size: 13px;
}
.pub-arc-issue-metric .v {
    display: block;
    color: var(--pa-navy);
    font-size: 13px; font-weight: 800;
    line-height: 1;
}
.pub-arc-issue-metric .k {
    display: block;
    color: #8493a5;
    font-size: 10px; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.04em;
    margin-top: 2px;
}

.pub-arc-issue-actions {
    display: flex; flex-wrap: wrap; gap: 6px;
    padding-top: 10px;
    border-top: 1px solid var(--pa-line-soft);
}
.pub-arc-issue-actions .pub-arc-action {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 7px 11px;
    border: 1px solid var(--pa-line);
    border-radius: 8px;
    background: #fff;
    color: var(--pa-navy);
    font-size: 12px; font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    transition: all 160ms ease;
}
.pub-arc-issue-actions .pub-arc-action:hover {
    border-color: var(--pa-navy);
    background: var(--pa-navy);
    color: #fff;
}
.pub-arc-issue-actions .pub-arc-action.primary {
    border-color: var(--pa-navy);
    background: var(--pa-navy);
    color: #fff;
}
.pub-arc-issue-actions .pub-arc-action.primary:hover {
    background: var(--pa-blue);
    border-color: var(--pa-blue);
}

/* ---------- 7. Empty state ---------- */
.pub-arc-empty {
    text-align: center;
    padding: 70px 24px;
    border: 1px dashed var(--pa-line);
    border-radius: var(--pa-radius);
    background: #fff;
}
.pub-arc-empty-illu {
    display: inline-flex; align-items: center; justify-content: center;
    width: 96px; height: 96px;
    margin-bottom: 18px;
    border-radius: 50%;
    background: var(--pa-blue-soft);
    color: var(--pa-blue);
    font-size: 36px;
}
.pub-arc-empty h3 {
    margin: 0 0 6px;
    color: var(--pa-navy);
    font-size: 22px; font-weight: 800;
}
.pub-arc-empty p {
    margin: 0 0 18px;
    color: var(--pa-slate);
    font-size: 14.5px;
}
.pub-arc-empty-reset {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 10px 18px;
    border: 1px solid var(--pa-navy);
    border-radius: 999px;
    background: var(--pa-navy);
    color: #fff;
    font-size: 13px; font-weight: 700;
    cursor: pointer;
    transition: all 160ms ease;
}
.pub-arc-empty-reset:hover { background: var(--pa-blue); border-color: var(--pa-blue); }

/* ---------- 8. Load more ---------- */
.pub-arc-loadmore { display: flex; justify-content: center; margin-top: 18px; }
.pub-arc-loadmore-btn {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 14px 28px;
    border: 1px solid var(--pa-line);
    border-radius: 999px;
    background: #fff;
    color: var(--pa-navy);
    font-size: 14px; font-weight: 800;
    cursor: pointer;
    box-shadow: var(--pa-shadow-sm);
    transition: all 200ms ease;
}
.pub-arc-loadmore-btn:hover {
    border-color: var(--pa-navy);
    background: var(--pa-navy);
    color: #fff;
    transform: translateY(-1px);
}

/* ---------- Loading skeleton ---------- */
.pub-arc-skel {
    border: 1px solid var(--pa-line);
    border-radius: var(--pa-radius);
    overflow: hidden;
    background: #fff;
}
.pub-arc-skel-cover, .pub-arc-skel-line {
    background: linear-gradient(90deg, #eef2f7 0%, #f7f9fc 50%, #eef2f7 100%);
    background-size: 200% 100%;
    animation: pubArcShimmer 1.4s linear infinite;
}
.pub-arc-skel-cover { height: 160px; }
.pub-arc-skel-body { padding: 18px; display: flex; flex-direction: column; gap: 10px; }
.pub-arc-skel-line { height: 12px; border-radius: 6px; }
.pub-arc-skel-line.short { width: 40%; }
.pub-arc-skel-line.tall { height: 18px; }
@keyframes pubArcShimmer {
    0% { background-position: 100% 0; }
    100% { background-position: -100% 0; }
}

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
    .pub-arc-hero { grid-template-columns: 1fr; gap: 32px; }
    .pub-arc-hero-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .pub-arc-featured { grid-template-columns: 1fr; }
    .pub-arc-featured-cover { min-height: 240px; }
    .pub-arc-toolbar { top: 64px; }
    .pub-arc-timeline { top: 64px; }
}

@media (max-width: 760px) {
    .pub-arc-section { padding: 40px 0 70px; }
    .pub-arc-hero-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 16px; }
    .pub-arc-featured-body { padding: 24px; }
    .pub-arc-featured-meta { gap: 12px 18px; padding: 12px 14px; }
    .pub-arc-toolbar { position: relative; top: auto; padding: 12px; }
    .pub-arc-toolbar-left, .pub-arc-toolbar-right { width: 100%; }
    .pub-arc-toolbar-right { justify-content: space-between; }
    .pub-arc-field, .pub-arc-toggle { flex: 1 1 calc(50% - 5px); }
    .pub-arc-field select { width: 100%; }
    .pub-arc-volume-header { grid-template-columns: 1fr; }
    .pub-arc-volume-mini { justify-content: flex-start; }
    .pub-arc-volume-mini-item { text-align: left; }
    .pub-arc-issues { grid-template-columns: 1fr; }
    .pub-arc-section.is-list-view .pub-arc-issue {
        grid-template-columns: 1fr;
        grid-template-rows: 160px auto;
    }
    .pub-arc-timeline { position: relative; top: auto; }
}

@media (max-width: 480px) {
    .pub-arc-hero-stats { grid-template-columns: 1fr 1fr; }
    .pub-arc-issue-metrics { grid-template-columns: repeat(2, 1fr); gap: 10px; }
}

@media (prefers-reduced-motion: reduce) {
    .pub-arc-issue, .pub-arc-issue-cover img,
    .pub-arc-quick-year, .pub-arc-stat,
    .pub-arc-loadmore-btn, .pub-arc-btn { transition: none !important; }
    .pub-arc-skel-cover, .pub-arc-skel-line { animation: none; }
}

/* ==========================================================================
   Publications Archive — COMPACT overrides
   Densifies spacing, font sizes, and card dimensions.
   ========================================================================== */
.pub-arc-section {
    --pa-radius: 14px;
    --pa-radius-sm: 10px;
    padding: 40px 0 70px;
    background: linear-gradient(180deg, #ffffff 0%, var(--pa-bg) 30%, var(--pa-bg) 100%);
}

.pub-arc-shell { max-width: 1450px; padding: 0 16px; }

/* Hero */
.pub-arc-hero {
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
    gap: 32px;
    padding-bottom: 22px;
    margin-bottom: 18px;
}
.pub-arc-eyebrow {
    margin-bottom: 12px;
    padding: 6px 12px;
    font-size: 11px;
}
.pub-arc-eyebrow i { font-size: 11px; }
.pub-arc-title {
    margin-bottom: 10px;
    font-size: clamp(26px, 3.2vw, 38px);
    line-height: 1.1;
}
.pub-arc-lead {
    margin-bottom: 18px;
    font-size: 14.5px;
    line-height: 1.6;
    max-width: 580px;
}

/* Search */
.pub-arc-search {
    max-width: 540px;
    margin-bottom: 16px;
    padding: 4px;
}
.pub-arc-search > i { width: 38px; font-size: 14px; }
.pub-arc-search input { min-height: 38px; font-size: 13.5px; }
.pub-arc-search-clear { width: 32px; height: 32px; }

/* Quick year chips */
.pub-arc-quick { gap: 10px; }
.pub-arc-quick-label { font-size: 11px; }
.pub-arc-quick-year { padding: 6px 11px; font-size: 12px; }

/* Hero stats */
.pub-arc-hero-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding: 14px;
    border-radius: 16px;
}
.pub-arc-stat { padding: 11px 11px 10px; }
.pub-arc-stat-icon {
    width: 28px; height: 28px;
    margin-bottom: 6px;
    border-radius: 8px;
    font-size: 12px;
}
.pub-arc-stat-value { font-size: 18px; }
.pub-arc-stat-label { font-size: 10.5px; margin-top: 2px; }

/* Timeline */
.pub-arc-timeline {
    margin-bottom: 22px;
    padding: 6px;
    top: 70px;
}
.pub-arc-timeline-nav { width: 30px; height: 30px; font-size: 12px; }
.pub-arc-timeline-track { gap: 4px; padding: 2px 4px; }
.pub-arc-timeline-btn {
    min-width: 60px;
    padding: 5px 10px;
    gap: 1px;
}
.pub-arc-timeline-btn .yr { font-size: 12.5px; }
.pub-arc-timeline-btn .ct { font-size: 9.5px; }

/* Featured */
.pub-arc-featured {
    grid-template-columns: minmax(240px, 0.8fr) minmax(0, 1.6fr);
    margin-bottom: 36px;
    border-radius: 18px;
}
.pub-arc-featured-cover-meta { bottom: 14px; left: 14px; right: 14px; gap: 8px; }
.pub-arc-cover-pill { padding: 5px 9px; font-size: 10.5px; }
.pub-arc-featured-body { padding: 22px 24px; }
.pub-arc-featured-eyebrow { margin-bottom: 8px; font-size: 11px; }
.pub-arc-featured-eyebrow::before { width: 16px; }
.pub-arc-featured h2 {
    margin-bottom: 8px;
    font-size: clamp(19px, 1.9vw, 24px);
    line-height: 1.2;
}
.pub-arc-featured-desc {
    margin-bottom: 14px;
    font-size: 13.5px;
    line-height: 1.6;
}
.pub-arc-featured-meta {
    gap: 10px 18px;
    margin-bottom: 14px;
    padding: 10px 12px;
}
.pub-arc-featured-meta-item .k { font-size: 9.5px; }
.pub-arc-featured-meta-item .v { font-size: 13px; }
.pub-arc-featured-article {
    padding: 10px 12px;
    margin-bottom: 14px;
}
.pub-arc-featured-article .label { font-size: 10px; margin-bottom: 2px; }
.pub-arc-featured-article .ftitle { font-size: 13.5px; }
.pub-arc-featured-article .fauth { font-size: 12px; }
.pub-arc-btn {
    padding: 9px 16px;
    font-size: 12.5px;
    gap: 6px;
}

/* Toolbar */
.pub-arc-toolbar {
    gap: 10px;
    margin-bottom: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    top: 124px;
}
.pub-arc-toolbar-left, .pub-arc-toolbar-right { gap: 8px; }
.pub-arc-field i { left: 12px; font-size: 12px; }
.pub-arc-field select {
    min-height: 36px;
    padding: 0 30px 0 32px;
    border-radius: 8px;
    font-size: 12.5px;
}
.pub-arc-toggle {
    padding: 8px 11px;
    border-radius: 8px;
    font-size: 12px;
    gap: 6px;
}
.pub-arc-result-status { font-size: 12px; }
.pub-arc-view-toggle { border-radius: 8px; }
.pub-arc-view-toggle button { width: 34px; height: 34px; font-size: 12.5px; }

/* Chips */
.pub-arc-chips { gap: 6px; margin-bottom: 16px; }
.pub-arc-chip { padding: 4px 8px 4px 10px; font-size: 11px; }
.pub-arc-chip button { width: 16px; height: 16px; font-size: 9px; }
.pub-arc-chip-clear { font-size: 11px; }

/* Volume header */
.pub-arc-volume { margin-bottom: 36px; scroll-margin-top: 160px; }
.pub-arc-volume-header {
    gap: 16px;
    padding-bottom: 12px;
    margin-bottom: 16px;
}
.pub-arc-volume-header::before { width: 48px; height: 2px; }
.pub-arc-volume-eyebrow { font-size: 11px; margin-bottom: 4px; }
.pub-arc-volume-title {
    margin-bottom: 4px;
    font-size: clamp(19px, 1.7vw, 22px);
    line-height: 1.18;
}
.pub-arc-volume-sub { font-size: 12.5px; }
.pub-arc-volume-mini { gap: 14px; }
.pub-arc-volume-mini-item .k { font-size: 9.5px; }
.pub-arc-volume-mini-item .v { font-size: 15px; }

/* Issue cards */
.pub-arc-issues {
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 14px;
}
.pub-arc-issue { grid-template-rows: 130px auto; border-radius: 14px; }
.pub-arc-issue-cover-tag {
    top: 9px; left: 9px;
    padding: 4px 8px;
    font-size: 10px;
}
.pub-arc-issue-cover-oa {
    top: 9px; right: 9px;
    padding: 4px 7px;
    font-size: 9.5px;
}
.pub-arc-issue-cover-topic {
    bottom: 9px; left: 9px;
    padding: 3px 8px;
    font-size: 10px;
    border-radius: 6px;
}
.pub-arc-issue-body {
    padding: 12px 13px 12px;
    gap: 7px;
}
.pub-arc-issue-date { font-size: 10.5px; }
.pub-arc-issue-title { font-size: 14.5px; line-height: 1.3; }
.pub-arc-issue-desc {
    font-size: 12.5px;
    line-height: 1.5;
    -webkit-line-clamp: 2;
}
.pub-arc-issue-metrics {
    gap: 4px;
    padding: 9px 0 2px;
}
.pub-arc-issue-metric i { font-size: 11px; margin-bottom: 2px; }
.pub-arc-issue-metric .v { font-size: 12px; }
.pub-arc-issue-metric .k { font-size: 9px; margin-top: 1px; }
.pub-arc-issue-actions { gap: 5px; padding-top: 8px; }
.pub-arc-issue-actions .pub-arc-action {
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 11px;
    gap: 5px;
}

/* List view tightening */
.pub-arc-section.is-list-view .pub-arc-issue {
    grid-template-columns: 150px minmax(0, 1fr);
}

/* Empty state */
.pub-arc-empty { padding: 48px 18px; }
.pub-arc-empty-illu {
    width: 72px; height: 72px;
    margin-bottom: 12px;
    font-size: 28px;
}
.pub-arc-empty h3 { font-size: 18px; }
.pub-arc-empty p { font-size: 13px; margin-bottom: 14px; }
.pub-arc-empty-reset { padding: 8px 14px; font-size: 12px; }

/* Load more */
.pub-arc-loadmore { margin-top: 12px; }
.pub-arc-loadmore-btn { padding: 11px 22px; font-size: 13px; }

/* Responsive overrides */
@media (max-width: 1100px) {
    .pub-arc-hero { gap: 22px; }
    .pub-arc-hero-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .pub-arc-toolbar { top: 60px; }
    .pub-arc-timeline { top: 60px; }
}
@media (max-width: 760px) {
    .pub-arc-section { padding: 28px 0 50px; }
    .pub-arc-hero-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px; }
    .pub-arc-featured-body { padding: 18px; }
    .pub-arc-featured-cover { min-height: 180px; }
    .pub-arc-issues { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
    .pub-arc-hero-stats { grid-template-columns: 1fr 1fr; }
    .pub-arc-issue-metrics { grid-template-columns: repeat(4, 1fr); }
}

/* Single-CTA footer on issue cards */
.pub-arc-issue-actions { flex-wrap: nowrap; }
.pub-arc-issue-actions .pub-arc-action {
    flex: 1 1 auto;
    justify-content: center;
    padding: 8px 12px;
    font-size: 12px;
}

/* Compact icon-only metrics on issue cards */
.pub-arc-issue-metrics {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}
.pub-arc-issue-metric {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.pub-arc-issue-metric i {
    color: #f39c12;
    font-size: 13px;
    margin: 0;
}
.pub-arc-issue-metric .v {
    color: var(--pa-navy);
    font-size: 11.5px;
    font-weight: 800;
    line-height: 1;
}

/* Issue card v2 — clean cover (portrait) + meta moved to body */
.pub-arc-issue { grid-template-rows: 220px auto; }
.pub-arc-issue-cover { background: linear-gradient(135deg, #1e3a8a, #0b2545); }
.pub-arc-issue-cover img { opacity: 0.7; }
.pub-arc-issue:hover .pub-arc-issue-cover img { opacity: 0.85; }

.pub-arc-issue-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.pub-arc-issue-meta { gap: 12px; }
.pub-arc-issue-volissue {
    display: inline-flex;
    align-items: center;
    padding: 0;
    background: transparent;
    color: var(--pa-blue);
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.pub-arc-issue-oa {
    display: inline-flex;
    align-items: center;
    padding: 0;
    background: transparent;
    color: var(--pa-emerald);
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.pub-arc-issue-oa::before {
    content: "";
    display: inline-block;
    width: 3px;
    height: 3px;
    margin-right: 8px;
    border-radius: 50%;
    background: currentColor;
    opacity: 0.55;
}

/* List view: cover follows portrait */
.pub-arc-section.is-list-view .pub-arc-issue-cover { min-height: 220px; }

/* Vol/Issue + date tighter cluster */
.pub-arc-issue-volissue,
.pub-arc-issue-oa { font-size: 12px; }
.pub-arc-issue-meta { margin-bottom: 0; }
.pub-arc-issue-meta + .pub-arc-issue-date { margin-top: 2px; }
.pub-arc-issue-date + .pub-arc-issue-title { margin-top: 6px; }
.pub-arc-issue-body { gap: 0; }
.pub-arc-issue-title { margin-top: 0; margin-bottom: 0; }
.pub-arc-issue-desc { margin-top: 6px; }

/* ==========================================================================
   Issue card — final consolidated layout (uniform heights, anchored CTA)
   ========================================================================== */
.pub-arc-issue {
    display: grid;
    grid-template-rows: 220px 1fr;
    height: 100%;
}
.pub-arc-issue-body {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 14px 14px 12px;
    min-height: 0;
}

/* Meta line: Vol·Issue + Open Access on one row, plain text */
.pub-arc-issue-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
}
.pub-arc-issue-volissue,
.pub-arc-issue-oa {
    padding: 0;
    background: transparent;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.pub-arc-issue-volissue { color: var(--pa-blue); }
.pub-arc-issue-oa { color: var(--pa-emerald); }

/* Date right under meta — tight */
.pub-arc-issue-date {
    margin-top: 4px;
    font-size: 11px;
    color: var(--pa-slate);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Title — fixed 2-line clamp so all cards align */
.pub-arc-issue-title {
    margin: 8px 0 0;
    color: var(--pa-navy);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(15px * 1.3 * 2);
}

/* Description — fixed 2-line clamp */
.pub-arc-issue-desc {
    margin: 6px 0 0;
    color: var(--pa-slate);
    font-size: 12.5px;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(12.5px * 1.5 * 2);
}

/* Metrics row — anchored before CTA, consistent alignment */
.pub-arc-issue-metrics {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-top: auto;
    padding: 10px 0;
    border-top: 1px dashed var(--pa-line);
}
.pub-arc-issue-metric {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
.pub-arc-issue-metric i {
    color: #f39c12;
    font-size: 12.5px;
}
.pub-arc-issue-metric .v {
    color: var(--pa-navy);
    font-size: 11.5px;
    font-weight: 800;
    line-height: 1;
}

/* CTA — anchored at bottom, full width */
.pub-arc-issue-actions {
    display: flex;
    padding-top: 8px;
    border-top: 1px solid var(--pa-line-soft);
}
.pub-arc-issue-actions .pub-arc-action {
    flex: 1 1 auto;
    justify-content: center;
    padding: 10px 12px;
    font-size: 12.5px;
    font-weight: 700;
}

/* ==========================================================================
   Issue card — compact + typographic hierarchy
   ========================================================================== */
.pub-arc-issue { grid-template-rows: 200px 1fr; }
.pub-arc-issue-body { padding: 12px 13px 11px; }

/* Meta — small caps eyebrow, less heavy */
.pub-arc-issue-volissue,
.pub-arc-issue-oa {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
}
.pub-arc-issue-meta { gap: 10px; }
.pub-arc-issue-oa::before { width: 3px; height: 3px; margin-right: 7px; }

/* Date — regular weight, low emphasis */
.pub-arc-issue-date {
    margin-top: 3px;
    font-size: 10.5px;
    font-weight: 500;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #8493a5;
}
.pub-arc-issue-date i { font-size: 10px; opacity: 0.7; }

/* Title — primary emphasis, but balanced */
.pub-arc-issue-title {
    margin-top: 6px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.32;
    letter-spacing: -0.005em;
    min-height: calc(14px * 1.32 * 2);
}

/* Metrics — numbers semi-bold, icon orange */
.pub-arc-issue-metrics {
    padding: 8px 0;
    margin-top: auto;
}
.pub-arc-issue-metric { gap: 4px; }
.pub-arc-issue-metric i { font-size: 11.5px; }
.pub-arc-issue-metric .v {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--pa-navy);
}

/* CTA — slightly smaller */
.pub-arc-issue-actions { padding-top: 7px; }
.pub-arc-issue-actions .pub-arc-action {
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 600;
}
.pub-arc-issue-actions .pub-arc-action i { font-size: 12px; }

/* Tighter top cluster — meta / date / title flush together */
.pub-arc-issue-body { padding: 10px 13px 11px; }
.pub-arc-issue-date { margin-top: 1px; }
.pub-arc-issue-title { margin-top: 2px; }

/* ==========================================================================
   Hero — blue background variant
   ========================================================================== */
.pub-arc-hero {
    position: relative;
    margin: 0 -20px 28px;
    padding: 56px 36px 44px;
    border: 0;
    border-radius: 24px;
    background:
        radial-gradient(circle at 85% 20%, rgba(29, 78, 216, 0.45) 0%, transparent 55%),
        radial-gradient(circle at 15% 80%, rgba(7, 22, 48, 0.55) 0%, transparent 50%),
        linear-gradient(135deg, #0b2545 0%, #102a55 50%, #0b2545 100%);
    overflow: hidden;
    color: #ffffff;
}
.pub-arc-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1px);
    background-size: 24px 24px;
    opacity: 0.5;
    pointer-events: none;
}
.pub-arc-hero > * { position: relative; z-index: 1; }

/* Eyebrow on dark */
.pub-arc-hero .pub-arc-eyebrow {
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.08);
    color: #c8d8ff;
    backdrop-filter: blur(6px);
}

/* Title & lead inverted */
.pub-arc-hero .pub-arc-title { color: #ffffff; }
.pub-arc-hero .pub-arc-lead { color: rgba(255, 255, 255, 0.78); }

/* Search bar on dark */
.pub-arc-hero .pub-arc-search {
    background: rgba(255, 255, 255, 0.96);
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.18);
}

/* Quick year chips on dark */
.pub-arc-hero .pub-arc-quick {
    margin-top: 22px;
    margin-bottom: 56px;
}
.pub-arc-hero .pub-arc-quick-label {
    color: rgba(255, 255, 255, 0.7);
    font-size: 10.5px !important;
}
.pub-arc-hero .pub-arc-quick-year {
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.06);
    color: #ffffff;
    padding: 6px 12px;
    font-size: 11.5px;
}
.pub-arc-hero .pub-arc-quick-year:hover {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.32);
    color: #ffffff;
}
.pub-arc-hero .pub-arc-quick-year.is-active {
    background: #ffffff;
    border-color: #ffffff;
    color: var(--pa-navy);
}

/* Hero stats card cluster on dark */
.pub-arc-hero .pub-arc-hero-stats {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(8px);
}
.pub-arc-hero .pub-arc-stat {
    background: rgba(255, 255, 255, 0.96);
    border-color: rgba(255, 255, 255, 0.6);
}
.pub-arc-hero .pub-arc-stat-icon {
    background: var(--pa-blue-soft);
    color: var(--pa-blue);
}
.pub-arc-hero .pub-arc-stat-value { color: var(--pa-navy); }
.pub-arc-hero .pub-arc-stat-label { color: var(--pa-slate); }

/* Archive hero stats: inline metrics, no cards */
.pub-arc-hero .pub-arc-hero-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    /* Baris seragam dan jarak antar-kolom konsisten supaya nilai pendek (5)
       tidak terlihat timpang dibanding nilai panjang (139,530). */
    grid-auto-rows: 1fr;
    gap: 22px 48px;
    align-self: start;
    margin-top: 10px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
}

.pub-arc-hero .pub-arc-stat {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 12px;
    row-gap: 4px;
    /* Top-align supaya semua icon + value sejajar di baris yang sama. */
    align-items: start;
    align-content: start;
    min-width: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    /* Angka pakai tabular-nums supaya digit lurus antar-kolom. */
    font-variant-numeric: tabular-nums;
}

.pub-arc-hero .pub-arc-stat:hover {
    transform: none;
    box-shadow: none;
}

.pub-arc-hero .pub-arc-stat-icon {
    grid-row: 1 / span 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin: 0;
    border-radius: 0;
    background: transparent;
    color: #ff9c00;
    font-size: 32px;
    line-height: 1;
    opacity: 0.94;
}

.pub-arc-hero {
    --hero-stat-value-fs: 18px;
}

.pub-arc-hero .pub-arc-stat-value {
    color: #ffffff;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: 0;
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
}

.pub-arc-hero .pub-arc-stat-label {
    margin: 0;
    color: rgba(255, 255, 255, 0.86);
    font-size: 10px;
    font-weight: 800;
    line-height: 1.22;
}

.pub-arc-hero .pub-arc-stat-value[data-stat="yearSpan"] {
    font-size: 18px;
}

.pub-arc-hero .pub-arc-stat-value[data-stat="totalCitations"],
.pub-arc-hero .pub-arc-stat-value[data-stat="totalViews"] {
    font-size: 18px;
}

.pub-arc-hero .pub-arc-stat-label {
    max-width: 82px;
}

@media (max-width: 760px) {
    .pub-arc-hero {
        margin: 0 -16px 22px;
        padding: 36px 22px 30px;
        border-radius: 18px;
    }

    .pub-arc-hero .pub-arc-hero-stats {
        margin-top: 28px;
    }
}

/* Hero — full-bleed (edge-to-edge) blue background */
.pub-arc-hero {
    position: relative;
    left: auto;
    right: auto;
    width: auto;
    margin-left: 0;
    margin-right: 0;
    border-radius: 0;
    padding: 64px 0 52px;
    margin-bottom: 32px;
}
@media (max-width: 760px) {
    .pub-arc-hero {
        padding: 40px 16px 32px;
        margin-bottom: 24px;
    }
}

/* Toolbar — blue variant, close to hero */
.pub-arc-hero { margin-bottom: 0; }
.pub-arc-toolbar {
    margin-top: 20px;
    margin-bottom: 28px;
    padding: 14px 18px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: linear-gradient(135deg, #0b2545 0%, #102a55 100%);
    box-shadow: 0 10px 30px rgba(11, 37, 69, 0.18);
    color: #ffffff;
}

/* Selects */
.pub-arc-toolbar .pub-arc-field i { color: rgba(255, 255, 255, 0.55); }
.pub-arc-toolbar .pub-arc-field select {
    border-color: rgba(255, 255, 255, 0.16);
    background-color: rgba(255, 255, 255, 0.06);
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path fill='%23ffffff' d='M5 6 0 0h10z'/></svg>");
    color: #ffffff;
}
.pub-arc-toolbar .pub-arc-field select:focus {
    border-color: rgba(255, 255, 255, 0.4);
    background-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.08);
}
.pub-arc-toolbar .pub-arc-field select option { color: var(--pa-navy); background: #fff; }

/* Toggle (Open access only) */
.pub-arc-toolbar .pub-arc-toggle {
    border-color: rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.06);
    color: #ffffff;
}
.pub-arc-toolbar .pub-arc-toggle input { accent-color: #34d399; }

/* Result status */
.pub-arc-toolbar .pub-arc-result-status { color: rgba(255, 255, 255, 0.78); }

/* View toggle */
.pub-arc-toolbar .pub-arc-view-toggle {
    border-color: rgba(255, 255, 255, 0.16);
    overflow: hidden;
}
.pub-arc-toolbar .pub-arc-view-toggle button {
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.7);
}
.pub-arc-toolbar .pub-arc-view-toggle button + button { border-left-color: rgba(255, 255, 255, 0.16); }
.pub-arc-toolbar .pub-arc-view-toggle button:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
}
.pub-arc-toolbar .pub-arc-view-toggle button.is-active {
    background: #ffffff;
    color: var(--pa-navy);
}

/* Toolbar — compact selects */
.pub-arc-toolbar .pub-arc-field select {
    min-height: 32px;
    padding: 0 26px 0 28px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
}
.pub-arc-toolbar .pub-arc-field i { left: 10px; font-size: 11px; }
.pub-arc-toolbar { padding: 10px 14px; }
.pub-arc-toolbar-left { gap: 6px; }

/* Toolbar — give selects a comfortable click area */
.pub-arc-toolbar .pub-arc-field { display: inline-flex; }
.pub-arc-toolbar .pub-arc-field select {
    min-width: 140px;
    min-height: 36px;
    cursor: pointer;
}
.pub-arc-toolbar .pub-arc-field select:hover {
    background-color: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.28);
}

/* Native <option> readability — Firefox inherits color from <select> on dark bg */
.pub-arc-toolbar .pub-arc-field select option,
.pub-arc-toolbar .pub-arc-field select optgroup {
    color: #0b2545 !important;
    background-color: #ffffff !important;
    font-weight: 600;
}

/* ==========================================================================
   nice-select dropdown — themed for the dark blue toolbar
   ========================================================================== */
.pub-arc-toolbar .pub-arc-field { position: relative; }

/* Trigger pill */
.pub-arc-toolbar .nice-select {
    height: 38px;
    line-height: 36px;
    min-width: 150px;
    padding: 0 36px 0 36px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.06);
    color: #ffffff;
    font-size: 12.5px;
    font-weight: 600;
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}
.pub-arc-toolbar .nice-select:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.32);
}
.pub-arc-toolbar .nice-select.open,
.pub-arc-toolbar .nice-select:focus {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.4);
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.08);
}

/* Caret arrow */
.pub-arc-toolbar .nice-select::after {
    right: 16px;
    width: 7px;
    height: 7px;
    border-color: rgba(255, 255, 255, 0.85);
    border-right-width: 2px;
    border-bottom-width: 2px;
    margin-top: -5px;
}

/* Current label color */
.pub-arc-toolbar .nice-select .current { color: #ffffff; }

/* Dropdown panel */
.pub-arc-toolbar .nice-select .list {
    min-width: 100%;
    margin-top: 6px;
    padding: 6px;
    border: 1px solid rgba(11, 37, 69, 0.08);
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 18px 40px rgba(11, 37, 69, 0.18), 0 4px 12px rgba(11, 37, 69, 0.08);
}

/* Options */
.pub-arc-toolbar .nice-select .option {
    min-height: 34px;
    line-height: 34px;
    padding: 0 14px;
    border-radius: 8px;
    color: var(--pa-navy);
    font-size: 13px;
    font-weight: 600;
    transition: background 140ms ease, color 140ms ease;
}
.pub-arc-toolbar .nice-select .option:hover,
.pub-arc-toolbar .nice-select .option.focus,
.pub-arc-toolbar .nice-select .option.selected.focus {
    background: var(--pa-navy);
    color: #ffffff;
}
.pub-arc-toolbar .nice-select .option.selected {
    background: var(--pa-blue-soft);
    color: var(--pa-navy);
    font-weight: 800;
}
.pub-arc-toolbar .nice-select .option.selected:hover,
.pub-arc-toolbar .nice-select .option.selected.focus {
    background: var(--pa-navy);
    color: #ffffff;
}

/* Hide the icon — nice-select replaces the field; the absolute icon clutters */
.pub-arc-toolbar .pub-arc-field > i { display: none; }

/* Native <select> hidden by nice-select still — make sure flex doesn't reserve space */
.pub-arc-toolbar .pub-arc-field { display: inline-block; }

/* Toolbar — sticky with 30px clearance under main header */
.pub-arc-toolbar {
    position: sticky;
    top: 110px;
    z-index: 50;
    box-shadow: 0 12px 32px rgba(11, 37, 69, 0.22), 0 2px 6px rgba(11, 37, 69, 0.08);
}
@media (max-width: 1100px) {
    .pub-arc-toolbar { top: 90px; }
}
@media (max-width: 760px) {
    .pub-arc-toolbar { position: relative; top: auto; }
}

/* Toolbar sticky offset — fixed to 90px */
.pub-arc-toolbar { top: 90px; }

/* Issue card cover — brighter on-theme gradient */
.pub-arc-issue-cover {
    background:
        radial-gradient(circle at 25% 20%, rgba(255, 255, 255, 0.18) 0%, transparent 45%),
        linear-gradient(135deg, #3b82f6 0%, #1d4ed8 55%, #1e40af 100%);
}

/* Issue card cover — soft neutral gray */
.pub-arc-issue-cover {
    background:
        radial-gradient(circle at 25% 20%, rgba(255, 255, 255, 0.5) 0%, transparent 50%),
        linear-gradient(135deg, #f4f6fa 0%, #e8ecf2 100%);
    border-bottom: 1px solid var(--pa-line-soft);
}

/* ==========================================================================
   Journal Issue page (issue.html)
   Modern academic publishing — premium scholarly issue collection.
   Namespace: .jis-*
   ========================================================================== */
.jis-section {
    --jis-navy: var(--color-primary-dark, #0b2545);
    --jis-navy-2: var(--color-primary-dark, #122f5c);
    --jis-blue: var(--color-primary, #1d4ed8);
    --jis-blue-2: var(--color-primary, #2563eb);
    --jis-blue-soft: var(--color-surface-soft, #eaf2ff);
    --jis-amber: var(--color-secondary, #b45309);
    --jis-amber-soft: var(--color-surface-soft, #fff7ed);
    --jis-emerald: var(--color-accent, #047857);
    --jis-emerald-soft: var(--color-surface-soft, #ecfdf5);
    --jis-rose: #be123c;
    --jis-rose-soft: #fff1f2;
    --jis-violet: #6d28d9;
    --jis-violet-soft: #f3e8ff;
    --jis-slate: var(--color-text-secondary, #526173);
    --jis-slate-2: var(--color-text-secondary, #6b7785);
    --jis-line: var(--color-border, #e3eaf2);
    --jis-line-soft: var(--color-surface-soft, #eef2f7);
    --jis-bg: var(--color-surface, #f6f8fb);
    --jis-bg-2: var(--color-bg, #fbfcfe);
    --jis-card: var(--color-bg, #ffffff);
    --jis-shadow-sm: 0 1px 2px rgba(11, 37, 69, 0.04), 0 4px 14px rgba(11, 37, 69, 0.05);
    --jis-shadow-md: 0 6px 20px rgba(11, 37, 69, 0.06), 0 22px 60px rgba(11, 37, 69, 0.07);
    --jis-shadow-lg: 0 18px 50px rgba(11, 37, 69, 0.12), 0 4px 14px rgba(11, 37, 69, 0.06);
    --jis-radius: 18px;
    --jis-radius-sm: 12px;
    --jis-radius-lg: 22px;
    background: linear-gradient(180deg, #ffffff 0%, var(--jis-bg) 38%, var(--jis-bg) 100%);
    padding: 56px 0 110px;
    margin-top: -40px;
}

.jis-section *,
.jis-section *::before,
.jis-section *::after {
    box-sizing: border-box;
    letter-spacing: 0;
}

.jis-shell {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ---------- 1. Hero ---------- */
.jis-hero {
    display: grid;
    grid-template-columns: minmax(260px, 0.62fr) minmax(0, 1fr);
    gap: 56px;
    align-items: center;
    padding: 12px 0 44px;
    border-bottom: 1px solid var(--jis-line);
    margin-bottom: 32px;
}

.jis-hero-cover {
    position: relative;
    align-self: center;
}

.jis-cover-frame {
    position: relative;
    aspect-ratio: 3 / 4;
    border-radius: 16px;
    overflow: hidden;
    background: linear-gradient(135deg, #1e3a8a 0%, #1d4ed8 100%);
    box-shadow:
        0 28px 70px rgba(11, 37, 69, 0.22),
        0 8px 18px rgba(11, 37, 69, 0.10),
        inset 0 0 0 1px rgba(255, 255, 255, 0.12);
    transform: perspective(1200px) rotateY(-4deg);
    transition: transform 320ms ease, box-shadow 320ms ease;
}

.jis-hero-cover:hover .jis-cover-frame {
    transform: perspective(1200px) rotateY(-2deg) translateY(-3px);
    box-shadow:
        0 36px 90px rgba(11, 37, 69, 0.28),
        0 10px 22px rgba(11, 37, 69, 0.14),
        inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}

.jis-cover-frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.jis-cover-shine {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(120deg,
            rgba(255, 255, 255, 0) 35%,
            rgba(255, 255, 255, 0.18) 50%,
            rgba(255, 255, 255, 0) 65%);
    pointer-events: none;
    mix-blend-mode: overlay;
}

.jis-cover-spine {
    position: absolute;
    bottom: -14px;
    left: 18px;
    right: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 10px 18px;
    border-radius: 12px;
    background: linear-gradient(180deg, var(--jis-navy) 0%, var(--jis-navy-2) 100%);
    color: #fff;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    box-shadow: 0 12px 28px rgba(11, 37, 69, 0.30);
}

.jis-spine-dot {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.55);
}

/* Hero copy */
.jis-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    padding: 7px 14px;
    border: 1px solid rgba(29, 78, 216, 0.20);
    border-radius: 999px;
    background: #fff;
    color: var(--jis-blue);
    font-size: 11.5px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.jis-hero-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin: 0 0 14px;
    color: var(--jis-slate);
    font-size: 13.5px;
    font-weight: 700;
}

.jis-meta-sep {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--jis-line);
}

.jis-hero-title {
    margin: 0 0 18px;
    color: var(--jis-navy);
    font-size: clamp(30px, 3.6vw, 46px);
    font-weight: 800;
    line-height: 1.08;
    text-wrap: balance;
    letter-spacing: -0.01em;
}

.jis-hero-theme {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 18px;
    padding: 8px 14px 8px 12px;
    border: 1px dashed rgba(29, 78, 216, 0.32);
    border-radius: 12px;
    background: rgba(234, 242, 255, 0.6);
    font-size: 13px;
}

.jis-hero-theme i { color: var(--jis-blue); }
.jis-theme-label {
    color: var(--jis-slate);
    font-weight: 700;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.06em;
}
.jis-theme-value {
    color: var(--jis-navy);
    font-weight: 800;
}

.jis-hero-lead {
    max-width: 640px;
    margin: 0 0 22px;
    color: var(--jis-slate);
    font-size: 16px;
    line-height: 1.68;
}

.jis-hero-inline {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 26px;
    padding: 12px 18px;
    border: 1px solid var(--jis-line);
    border-radius: 14px;
    background: #fff;
    box-shadow: var(--jis-shadow-sm);
    width: fit-content;
}

.jis-inline-stat {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--jis-slate);
    font-size: 13.5px;
    font-weight: 600;
}
.jis-inline-stat i { color: var(--jis-blue); }
.jis-inline-stat strong {
    color: var(--jis-navy);
    font-size: 16px;
    font-weight: 800;
}

.jis-inline-sep {
    width: 1px;
    height: 18px;
    background: var(--jis-line);
}

/* CTA buttons */
.jis-hero-cta { display: flex; gap: 12px; flex-wrap: wrap; }

.jis-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    border: 1px solid transparent;
    border-radius: 12px;
    font-size: 13.5px;
    font-weight: 700;
    cursor: pointer;
    transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease, color 160ms ease, border-color 160ms ease;
    line-height: 1;
}
.jis-btn i { font-size: 14px; }

.jis-btn-primary {
    background: linear-gradient(180deg, var(--jis-blue-2) 0%, var(--jis-blue) 100%);
    color: #fff;
    box-shadow: 0 8px 24px rgba(29, 78, 216, 0.32), inset 0 -1px 0 rgba(255, 255, 255, 0.12);
}
.jis-btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 32px rgba(29, 78, 216, 0.40), inset 0 -1px 0 rgba(255, 255, 255, 0.14);
}

.jis-btn-ghost {
    background: #fff;
    border-color: var(--jis-line);
    color: var(--jis-navy);
    box-shadow: var(--jis-shadow-sm);
}
.jis-btn-ghost:hover {
    border-color: rgba(29, 78, 216, 0.32);
    color: var(--jis-blue);
    transform: translateY(-1px);
}

/* ---------- 3. Metadata strip ---------- */
.jis-meta-strip {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 36px;
}

.jis-meta-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 16px;
    border: 1px solid var(--jis-line);
    border-radius: var(--jis-radius-sm);
    background: #fff;
    box-shadow: var(--jis-shadow-sm);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
    position: relative;
    overflow: hidden;
}
.jis-meta-card:hover {
    transform: translateY(-2px);
    border-color: rgba(29, 78, 216, 0.18);
    box-shadow: var(--jis-shadow-md);
}

.jis-meta-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 11px;
    background: var(--bg, var(--jis-blue-soft));
    color: var(--c, var(--jis-blue));
    font-size: 16px;
}

.jis-meta-body { min-width: 0; flex: 1 1 auto; }
.jis-meta-value {
    display: block;
    color: var(--jis-navy);
    font-size: 20px;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.01em;
}
.jis-meta-label {
    display: block;
    margin-top: 4px;
    color: var(--jis-slate);
    font-size: 11.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.jis-meta-trend {
    position: absolute;
    top: 10px;
    right: 10px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    border-radius: 999px;
    background: var(--jis-emerald-soft);
    color: var(--jis-emerald);
    font-size: 10.5px;
    font-weight: 800;
}
.jis-meta-trend.down {
    background: var(--jis-rose-soft);
    color: var(--jis-rose);
}

.jis-meta-spark {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 22px;
    opacity: 0.55;
    pointer-events: none;
}

/* ---------- 8. Editorial introduction ---------- */
.jis-editorial {
    position: relative;
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 22px;
    align-items: start;
    padding: 28px 32px;
    margin-bottom: 40px;
    border: 1px solid var(--jis-line);
    border-radius: var(--jis-radius-lg);
    background:
        radial-gradient(800px 220px at 0% 0%, rgba(29, 78, 216, 0.06), transparent 60%),
        linear-gradient(180deg, #fff 0%, var(--jis-bg-2) 100%);
    box-shadow: var(--jis-shadow-sm);
}

.jis-editorial-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: var(--jis-navy);
    color: #fff;
    font-size: 22px;
    box-shadow: 0 12px 28px rgba(11, 37, 69, 0.20);
}

.jis-editorial-tag {
    display: inline-block;
    margin-bottom: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--jis-blue-soft);
    color: var(--jis-blue);
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.jis-editorial-title {
    margin: 6px 0 10px;
    color: var(--jis-navy);
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.01em;
}

.jis-editorial-text {
    margin: 0;
    color: var(--jis-slate);
    font-size: 15.5px;
    line-height: 1.74;
    max-width: 78ch;
}

/* ---------- 2. Featured rail ---------- */
.jis-featured { margin-bottom: 44px; }

.jis-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
    margin-bottom: 22px;
}

.jis-section-eyebrow {
    display: block;
    margin-bottom: 6px;
    color: var(--jis-blue);
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.jis-section-title {
    margin: 0;
    color: var(--jis-navy);
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -0.01em;
}

.jis-featured-tabs {
    display: inline-flex;
    padding: 4px;
    border: 1px solid var(--jis-line);
    border-radius: 12px;
    background: #fff;
    box-shadow: var(--jis-shadow-sm);
    flex-wrap: wrap;
}
.jis-featured-tabs button {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 14px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--jis-slate);
    font-size: 12.5px;
    font-weight: 700;
    cursor: pointer;
    transition: background 160ms ease, color 160ms ease;
}
.jis-featured-tabs button:hover { color: var(--jis-navy); }
.jis-featured-tabs button.is-active {
    background: var(--jis-navy);
    color: #fff;
}
.jis-featured-tabs button i { font-size: 12px; }

.jis-featured-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.jis-featured-card {
    display: flex;
    flex-direction: column;
    padding: 22px 22px 18px;
    border: 1px solid var(--jis-line);
    border-radius: var(--jis-radius);
    background: #fff;
    box-shadow: var(--jis-shadow-sm);
    transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
    position: relative;
    overflow: hidden;
}
.jis-featured-card:hover {
    transform: translateY(-3px);
    border-color: rgba(29, 78, 216, 0.22);
    box-shadow: var(--jis-shadow-md);
}
.jis-featured-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    background: linear-gradient(90deg, var(--jis-blue) 0%, #60a5fa 100%);
}

.jis-featured-rank {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 12px;
    padding: 5px 10px;
    border-radius: 999px;
    background: var(--jis-blue-soft);
    color: var(--jis-blue);
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    width: fit-content;
}

.jis-featured-title {
    margin: 0 0 10px;
    color: var(--jis-navy);
    font-size: 17px;
    font-weight: 800;
    line-height: 1.32;
    letter-spacing: -0.005em;
    /* Clamp to 3 lines */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.jis-featured-authors {
    margin: 0 0 14px;
    color: var(--jis-slate);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
}

.jis-featured-metrics {
    display: flex;
    gap: 14px;
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid var(--jis-line-soft);
}
.jis-featured-metrics span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--jis-slate-2);
    font-size: 12px;
    font-weight: 600;
}
.jis-featured-metrics span i { color: var(--jis-blue); font-size: 11px; }
.jis-featured-metrics b {
    color: var(--jis-navy);
    font-weight: 800;
}

/* ---------- 4. Toolbar ---------- */
.jis-toolbar {
    position: sticky;
    top: 90px;
    z-index: 40;
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    padding: 14px 18px;
    margin-bottom: 14px;
    border: 1px solid var(--jis-line);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: saturate(160%) blur(10px);
    -webkit-backdrop-filter: saturate(160%) blur(10px);
    box-shadow: 0 12px 32px rgba(11, 37, 69, 0.10), 0 2px 6px rgba(11, 37, 69, 0.05);
}

.jis-search {
    position: relative;
    flex: 1 1 320px;
    min-width: 260px;
    display: flex;
    align-items: center;
    padding: 4px;
    border: 1px solid var(--jis-line);
    border-radius: 999px;
    background: #fff;
    transition: box-shadow 200ms ease, border-color 200ms ease;
}
.jis-search:focus-within {
    border-color: rgba(29, 78, 216, 0.35);
    box-shadow: 0 0 0 4px rgba(29, 78, 216, 0.10);
}
.jis-search > i {
    flex: 0 0 auto;
    width: 38px;
    text-align: center;
    color: var(--jis-slate);
    font-size: 14px;
}
.jis-search input {
    flex: 1 1 auto;
    width: 100%;
    min-height: 38px;
    padding: 0 10px 0 0;
    border: 0;
    background: transparent;
    color: var(--jis-navy);
    font-size: 14px;
    font-weight: 600;
    outline: none;
}
.jis-search input::placeholder { color: #98a3b3; font-weight: 500; }

.jis-search-clear {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    margin-right: 4px;
    border: 0;
    border-radius: 50%;
    background: var(--jis-bg);
    color: var(--jis-slate);
    cursor: pointer;
    transition: background 160ms ease, color 160ms ease;
}
.jis-search-clear:hover { background: var(--jis-blue-soft); color: var(--jis-blue); }

.jis-toolbar-fields {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.jis-field {
    position: relative;
    display: inline-flex;
    align-items: center;
}
.jis-field > i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--jis-slate);
    font-size: 12px;
    pointer-events: none;
    z-index: 1;
}
.jis-field select {
    appearance: none;
    -webkit-appearance: none;
    padding: 9px 32px 9px 32px;
    border: 1px solid var(--jis-line);
    border-radius: 10px;
    background:
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path fill='%23526173' d='M6 8.2 1.4 3.6l1.2-1.2L6 5.8l3.4-3.4 1.2 1.2z'/></svg>") right 10px center / 10px no-repeat,
        #fff;
    color: var(--jis-navy);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    min-width: 150px;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}
.jis-field select:hover { border-color: rgba(29, 78, 216, 0.32); }
.jis-field select:focus {
    outline: none;
    border-color: var(--jis-blue);
    box-shadow: 0 0 0 4px rgba(29, 78, 216, 0.10);
}

.jis-view-toggle {
    display: inline-flex;
    padding: 3px;
    border: 1px solid var(--jis-line);
    border-radius: 10px;
    background: #fff;
}
.jis-view-toggle button {
    width: 34px;
    height: 32px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--jis-slate);
    cursor: pointer;
    transition: background 160ms ease, color 160ms ease;
}
.jis-view-toggle button:hover { color: var(--jis-navy); }
.jis-view-toggle button.is-active {
    background: var(--jis-navy);
    color: #fff;
}

/* ---------- Status row ---------- */
.jis-status-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}
.jis-result-status {
    margin: 0;
    color: var(--jis-slate);
    font-size: 13px;
    font-weight: 600;
}
.jis-result-status b { color: var(--jis-navy); font-weight: 800; }

.jis-chips {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.jis-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 6px 5px 12px;
    border-radius: 999px;
    background: var(--jis-blue-soft);
    color: var(--jis-blue);
    font-size: 12px;
    font-weight: 700;
}
.jis-chip button {
    width: 18px;
    height: 18px;
    border: 0;
    border-radius: 50%;
    background: rgba(29, 78, 216, 0.18);
    color: var(--jis-blue);
    cursor: pointer;
    font-size: 9px;
    line-height: 1;
    transition: background 160ms ease;
}
.jis-chip button:hover { background: var(--jis-blue); color: #fff; }

/* ---------- 6. Keyword discovery ---------- */
.jis-keywords {
    margin-bottom: 26px;
    padding: 22px 24px;
    border: 1px solid var(--jis-line);
    border-radius: var(--jis-radius);
    background: #fff;
    box-shadow: var(--jis-shadow-sm);
}
.jis-keywords-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.jis-keywords-title {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    color: var(--jis-navy);
    font-size: 15px;
    font-weight: 800;
}
.jis-keywords-title i { color: var(--jis-blue); }
.jis-keywords-hint {
    color: var(--jis-slate);
    font-size: 12px;
    font-weight: 600;
}
.jis-keyword-cloud {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.jis-keyword-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    border: 1px solid var(--jis-line);
    border-radius: 999px;
    background: #fff;
    color: var(--jis-navy);
    font-size: 12.5px;
    font-weight: 700;
    cursor: pointer;
    transition: all 160ms ease;
}
.jis-keyword-chip:hover {
    border-color: rgba(29, 78, 216, 0.32);
    background: var(--jis-blue-soft);
    color: var(--jis-blue);
    transform: translateY(-1px);
}
.jis-keyword-chip.is-active {
    background: var(--jis-navy);
    border-color: var(--jis-navy);
    color: #fff;
}
.jis-keyword-count {
    padding: 1px 7px;
    border-radius: 999px;
    background: rgba(11, 37, 69, 0.06);
    color: inherit;
    font-size: 10.5px;
    font-weight: 800;
}
.jis-keyword-chip.is-active .jis-keyword-count {
    background: rgba(255, 255, 255, 0.18);
}

/* ---------- 5. Article cards ---------- */
.jis-articles {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}
.jis-articles[data-view="list"] {
    grid-template-columns: 1fr;
}

.jis-art-card {
    display: flex;
    flex-direction: column;
    position: relative;
    padding: 22px 22px 18px;
    border: 1px solid var(--jis-line);
    border-radius: var(--jis-radius);
    background: #fff;
    box-shadow: var(--jis-shadow-sm);
    transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
    overflow: hidden;
}
.jis-art-card:hover {
    transform: translateY(-2px);
    border-color: rgba(29, 78, 216, 0.22);
    box-shadow: var(--jis-shadow-md);
}

.jis-art-card.is-highly-cited::after {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: linear-gradient(180deg, var(--jis-amber) 0%, #f59e0b 100%);
    border-radius: 4px 0 0 4px;
}

/* Header badges */
.jis-art-head {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.jis-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    line-height: 1;
}
.jis-badge i { font-size: 10px; }
.jis-badge-type {
    background: var(--jis-blue-soft);
    color: var(--jis-blue);
    border: 1px solid rgba(29, 78, 216, 0.18);
}
.jis-badge-oa {
    background: var(--jis-emerald-soft);
    color: var(--jis-emerald);
    border: 1px solid rgba(4, 120, 87, 0.18);
}
.jis-badge-pr {
    background: #fff;
    color: var(--jis-navy);
    border: 1px solid var(--jis-line);
}
.jis-badge-trending {
    background: linear-gradient(180deg, #fff7ed 0%, #ffedd5 100%);
    color: var(--jis-amber);
    border: 1px solid rgba(180, 83, 9, 0.20);
}
.jis-badge-cited {
    background: var(--jis-amber-soft);
    color: var(--jis-amber);
    border: 1px solid rgba(180, 83, 9, 0.18);
}

/* Main content */
.jis-art-title {
    margin: 0 0 10px;
    color: var(--jis-navy);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.32;
    letter-spacing: -0.005em;
}
.jis-art-title a {
    color: inherit;
    text-decoration: none;
    background-image: linear-gradient(currentColor, currentColor);
    background-size: 0 1px;
    background-repeat: no-repeat;
    background-position: 0 100%;
    transition: background-size 220ms ease, color 160ms ease;
}
.jis-art-title a:hover { color: var(--jis-blue); background-size: 100% 1px; }

.jis-art-authors {
    margin: 0 0 12px;
    color: var(--jis-slate);
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.55;
}
.jis-art-authors b { color: var(--jis-navy); font-weight: 700; }

.jis-art-abstract {
    margin: 0 0 14px;
    color: var(--jis-slate);
    font-size: 13.5px;
    line-height: 1.65;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.jis-art-tags {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.jis-art-tag {
    padding: 4px 10px;
    border-radius: 8px;
    background: var(--jis-bg);
    color: var(--jis-slate);
    font-size: 11.5px;
    font-weight: 700;
}
.jis-art-tag.is-subject {
    background: var(--jis-blue-soft);
    color: var(--jis-blue);
}

/* Footer */
.jis-art-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid var(--jis-line-soft);
}
.jis-art-doi {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--jis-slate-2);
    font-size: 11.5px;
    font-weight: 600;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}
.jis-art-doi i { color: var(--jis-blue); }

.jis-art-metrics {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}
.jis-art-metric {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--jis-slate-2);
    font-size: 12px;
    font-weight: 600;
}
.jis-art-metric i { font-size: 11px; }
.jis-art-metric b {
    color: var(--jis-navy);
    font-weight: 800;
}
.jis-art-metric.is-hot i { color: var(--jis-amber); }
.jis-art-metric.is-hot b { color: var(--jis-amber); }

/* Citation heat indicator */
.jis-citation-heat {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    margin-left: 4px;
}
.jis-citation-heat span {
    width: 4px;
    height: 10px;
    border-radius: 1.5px;
    background: var(--jis-line);
}
.jis-citation-heat span.is-on { background: var(--jis-amber); }

/* Action row */
.jis-art-actions {
    display: flex;
    gap: 8px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px dashed var(--jis-line-soft);
    flex-wrap: wrap;
}
.jis-act-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border: 1px solid var(--jis-line);
    border-radius: 9px;
    background: #fff;
    color: var(--jis-navy);
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: all 160ms ease;
}
.jis-act-btn:hover {
    border-color: rgba(29, 78, 216, 0.32);
    color: var(--jis-blue);
    background: var(--jis-blue-soft);
}
.jis-act-btn.is-primary {
    background: var(--jis-navy);
    border-color: var(--jis-navy);
    color: #fff;
}
.jis-act-btn.is-primary:hover {
    background: var(--jis-blue);
    border-color: var(--jis-blue);
    color: #fff;
}
.jis-act-btn.is-icon {
    width: 34px;
    padding: 0;
    justify-content: center;
}
.jis-act-btn.is-bookmarked {
    background: var(--jis-amber-soft);
    border-color: rgba(180, 83, 9, 0.28);
    color: var(--jis-amber);
}

/* List view tweaks */
.jis-articles[data-view="list"] .jis-art-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 280px);
    gap: 24px;
    padding: 22px 26px;
}
.jis-articles[data-view="list"] .jis-art-abstract { -webkit-line-clamp: 2; }
.jis-articles[data-view="list"] .jis-art-side {
    border-left: 1px dashed var(--jis-line-soft);
    padding-left: 22px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.jis-articles[data-view="grid"] .jis-art-side {
    display: contents;
}

/* ---------- Skeleton ---------- */
.jis-skeleton {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-top: 16px;
}
.jis-sk-card {
    height: 240px;
    border-radius: var(--jis-radius);
    background: linear-gradient(110deg, #eef2f7 8%, #f6f8fb 18%, #eef2f7 33%);
    background-size: 200% 100%;
    animation: jisSkLoad 1.4s ease-in-out infinite;
    border: 1px solid var(--jis-line-soft);
}
@keyframes jisSkLoad {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ---------- 9. Empty state ---------- */
.jis-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 70px 24px;
    border: 1px dashed var(--jis-line);
    border-radius: var(--jis-radius-lg);
    background: #fff;
}
.jis-empty-illu {
    width: 120px;
    height: 120px;
    margin-bottom: 18px;
    color: var(--jis-blue);
    opacity: 0.85;
}
.jis-empty h3 {
    margin: 0 0 6px;
    color: var(--jis-navy);
    font-size: 22px;
    font-weight: 800;
}
.jis-empty p {
    margin: 0 0 22px;
    color: var(--jis-slate);
    font-size: 14.5px;
}
.jis-empty-reset {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border: 1px solid var(--jis-line);
    border-radius: 999px;
    background: #fff;
    color: var(--jis-navy);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all 160ms ease;
}
.jis-empty-reset:hover {
    border-color: rgba(29, 78, 216, 0.32);
    color: var(--jis-blue);
    background: var(--jis-blue-soft);
}

/* ---------- Modal ---------- */
.jis-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.jis-modal[hidden] { display: none; }
.jis-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(11, 37, 69, 0.45);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    animation: jisFadeIn 200ms ease;
}
.jis-modal-card {
    position: relative;
    width: min(560px, 100%);
    max-height: calc(100vh - 40px);
    overflow: auto;
    border-radius: var(--jis-radius-lg);
    background: #fff;
    box-shadow: 0 30px 80px rgba(11, 37, 69, 0.40);
    animation: jisRise 280ms cubic-bezier(.2, .8, .2, 1);
}
.jis-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 22px;
    border-bottom: 1px solid var(--jis-line);
}
.jis-modal-head h4 {
    margin: 0;
    color: var(--jis-navy);
    font-size: 17px;
    font-weight: 800;
}
.jis-modal-close {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 50%;
    background: var(--jis-bg);
    color: var(--jis-slate);
    cursor: pointer;
    transition: background 160ms ease, color 160ms ease;
}
.jis-modal-close:hover { background: var(--jis-blue-soft); color: var(--jis-blue); }
.jis-modal-body { padding: 20px 22px 22px; }
.jis-cite-tabs {
    display: inline-flex;
    padding: 3px;
    margin-bottom: 14px;
    border: 1px solid var(--jis-line);
    border-radius: 10px;
    background: var(--jis-bg);
    flex-wrap: wrap;
}
.jis-cite-tabs button {
    padding: 7px 14px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--jis-slate);
    font-size: 12.5px;
    font-weight: 700;
    cursor: pointer;
    transition: all 160ms ease;
}
.jis-cite-tabs button.is-active {
    background: var(--jis-navy);
    color: #fff;
}
.jis-cite-text {
    margin: 0 0 14px;
    padding: 16px 18px;
    border-radius: 12px;
    background: var(--jis-bg);
    color: var(--jis-navy);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 12.5px;
    line-height: 1.65;
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 220px;
    overflow: auto;
}
.jis-cite-copy { width: 100%; justify-content: center; }

/* ---------- Toast ---------- */
.jis-toast {
    position: fixed;
    bottom: 28px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1100;
    padding: 12px 20px;
    border-radius: 999px;
    background: var(--jis-navy);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    box-shadow: 0 20px 50px rgba(11, 37, 69, 0.30);
    animation: jisToastIn 240ms cubic-bezier(.2, .8, .2, 1);
}
.jis-toast[hidden] { display: none; }

@keyframes jisFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes jisRise {
    from { opacity: 0; transform: translateY(12px) scale(.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes jisToastIn {
    from { opacity: 0; transform: translate(-50%, 12px); }
    to { opacity: 1; transform: translate(-50%, 0); }
}

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
    .jis-toolbar { top: 70px; }
    .jis-meta-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .jis-featured-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
    .jis-hero {
        grid-template-columns: 1fr;
        gap: 36px;
        padding-top: 4px;
    }
    .jis-hero-cover { max-width: 320px; margin: 0 auto; }
    .jis-cover-frame { transform: none; }
    .jis-articles { grid-template-columns: 1fr; }
    .jis-articles[data-view="list"] .jis-art-card {
        grid-template-columns: 1fr;
        gap: 14px;
    }
    .jis-articles[data-view="list"] .jis-art-side {
        border-left: 0;
        border-top: 1px dashed var(--jis-line-soft);
        padding: 14px 0 0;
    }
    .jis-editorial {
        grid-template-columns: 1fr;
        padding: 22px;
    }
    .jis-toolbar { position: relative; top: auto; }
}

@media (max-width: 640px) {
    .jis-section { padding: 40px 0 80px; }
    .jis-meta-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .jis-featured-grid { grid-template-columns: 1fr; }
    .jis-section-title { font-size: 22px; }
    .jis-hero-title { font-size: 28px; }
    .jis-hero-cta .jis-btn { flex: 1 1 auto; justify-content: center; }
    .jis-toolbar { padding: 12px; gap: 10px; }
    .jis-toolbar-fields { width: 100%; }
    .jis-field select { min-width: 0; flex: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .jis-cover-frame,
    .jis-featured-card,
    .jis-art-card,
    .jis-meta-card,
    .jis-keyword-chip,
    .jis-btn { transition: none; }
    .jis-sk-card { animation: none; }
}

/* Issue Spotlight title — lighter, editorial hierarchy */
.issue-spotlight-title {
    font-weight: 300 !important;
    font-size: clamp(28px, 3.4vw, 44px) !important;
    line-height: 1.18 !important;
    letter-spacing: -0.005em;
    text-wrap: balance;
}
.issue-spotlight-title .iss-meta-prefix {
    font-weight: 300;
    color: rgba(255, 255, 255, 0.62);
    letter-spacing: 0.01em;
}
.issue-spotlight-title .iss-meta-dash {
    display: inline-block;
    margin: 0 .35em;
    color: rgba(255, 255, 255, 0.32);
    font-weight: 200;
}
.issue-spotlight-title .iss-name {
    font-weight: 500;
    color: #fff;
}
@media (max-width: 720px) {
    .issue-spotlight-title .iss-meta-dash { display: none; }
    .issue-spotlight-title .iss-meta-prefix {
        display: block;
        font-size: 0.62em;
        margin-bottom: 6px;
        text-transform: uppercase;
        letter-spacing: 0.08em;
    }
}

/* Featured research — darker grey panel for visual separation */
.jis-featured {
    position: relative;
    padding: 36px 32px 38px;
    border-radius: 22px;
    background:
        radial-gradient(900px 240px at 0% 0%, rgba(11, 37, 69, 0.05), transparent 60%),
        linear-gradient(180deg, #dfe5ee 0%, #d5dde8 100%);
    border: 1px solid #c9d2df;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4);
}
.jis-featured .jis-section-eyebrow { color: #2b4a86; }
.jis-featured .jis-featured-tabs {
    background: rgba(255, 255, 255, 0.85);
    border-color: rgba(11, 37, 69, 0.10);
}
.jis-featured .jis-featured-card {
    border-color: rgba(11, 37, 69, 0.08);
    box-shadow: 0 2px 6px rgba(11, 37, 69, 0.05), 0 12px 30px rgba(11, 37, 69, 0.06);
}
.jis-featured .jis-featured-card:hover {
    box-shadow: 0 6px 16px rgba(11, 37, 69, 0.08), 0 22px 50px rgba(11, 37, 69, 0.10);
}
@media (max-width: 640px) {
    .jis-featured { padding: 24px 18px 26px; border-radius: 18px; }
}

/* ---------- Compact pass: toolbar + keyword cloud ---------- */
/* Toolbar: tighter padding, slimmer fields */
.jis-toolbar {
    padding: 10px 12px;
    gap: 10px;
    border-radius: 14px;
}
.jis-toolbar .jis-search {
    flex: 1 1 280px;
    min-width: 220px;
    padding: 3px;
}
.jis-toolbar .jis-search > i { width: 34px; font-size: 13px; }
.jis-toolbar .jis-search input { min-height: 34px; font-size: 13.5px; }
.jis-toolbar .jis-search-clear { width: 28px; height: 28px; }

.jis-toolbar .jis-toolbar-fields { gap: 8px; }
.jis-toolbar .jis-field select {
    min-width: 0;
    width: auto;
    padding: 7px 30px 7px 32px;
    border-radius: 9px;
    font-size: 12.5px;
    background-position: right 9px center;
    background-size: 9px;
}
.jis-toolbar .jis-field > i {
    left: 11px;
    font-size: 11.5px;
}
.jis-toolbar .jis-view-toggle button {
    width: 30px;
    height: 28px;
}

/* Status row sits closer to toolbar, lighter weight */
.jis-status-row {
    margin: 12px 2px 14px;
}
.jis-result-status { font-size: 12.5px; }

/* Keyword cloud: smaller chips, denser */
.jis-keywords {
    padding: 16px 18px 14px;
    border-radius: 14px;
    margin-bottom: 22px;
}
.jis-keywords-head { margin-bottom: 10px; }
.jis-keywords-title { font-size: 13.5px; }
.jis-keywords-title i { font-size: 13px; }
.jis-keywords-hint { font-size: 11px; }

.jis-keyword-cloud { gap: 6px; }
.jis-keyword-chip {
    padding: 5px 9px 5px 11px;
    font-size: 11.5px;
    gap: 5px;
    border-radius: 999px;
}
.jis-keyword-chip:hover { transform: none; }
.jis-keyword-count {
    padding: 0 6px;
    font-size: 10px;
    line-height: 16px;
    min-width: 16px;
    text-align: center;
}

@media (max-width: 720px) {
    .jis-toolbar .jis-toolbar-fields { width: 100%; gap: 6px; }
    .jis-toolbar .jis-field { flex: 1 1 0; min-width: 0; }
    .jis-toolbar .jis-field select { width: 100%; }
}

/* ---------- Select field: reliable icon spacing ---------- */
.jis-toolbar .jis-field {
    position: relative;
    display: inline-flex;
    align-items: center;
}
.jis-toolbar .jis-field > i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    width: 14px;
    text-align: center;
    color: var(--jis-slate);
    font-size: 12px;
    pointer-events: none;
    z-index: 2;
}
.jis-toolbar .jis-field select {
    padding-left: 36px !important;
    padding-right: 32px !important;
    text-indent: 4px;          /* extra reliable nudge in Firefox */
    background-position: right 10px center;
}

/* ==========================================================================
   Issue page refinement — clean, compact hierarchy
   ========================================================================== */
.jis-section {
    --jis-shadow-sm: 0 1px 2px rgba(11, 37, 69, 0.04), 0 8px 22px rgba(11, 37, 69, 0.05);
    --jis-shadow-md: 0 8px 26px rgba(11, 37, 69, 0.08), 0 18px 44px rgba(11, 37, 69, 0.06);
    --jis-radius: 14px;
    --jis-radius-sm: 10px;
    --jis-radius-lg: 18px;
    padding: 42px 0 64px;
    margin-top: 0;
    background: linear-gradient(180deg, #ffffff 0%, #f7f9fc 42%, #f3f6fa 100%);
    color: var(--jis-navy);
}

.jis-shell {
    max-width: 1180px;
    padding: 0 18px;
}

.funfact-section-two.journal-impact-section {
    padding-top: 38px !important;
    padding-bottom: 38px !important;
}

.journal-impact-copy .sub-title {
    margin-bottom: 18px;
    padding: 7px 18px;
    font-size: 11px;
    letter-spacing: .07em;
}

.issue-spotlight-title {
    max-width: 880px;
    font-size: clamp(30px, 3vw, 42px) !important;
    line-height: 1.16 !important;
}

.editorial-hero-stats {
    margin-top: 28px;
    gap: 24px;
}

.editorial-hero-stats .editorial-stat-card {
    padding: 0;
    background: transparent;
    box-shadow: none;
}

.editorial-hero-stats .editorial-stat-value {
    font-size: 22px;
    line-height: 1.05;
}

.editorial-hero-stats .editorial-stat-label {
    font-size: 12px;
    line-height: 1.25;
}

.jis-hero {
    grid-template-columns: minmax(240px, 360px) minmax(0, 1fr);
    gap: 44px;
    align-items: center;
    padding: 0 0 34px;
    margin-bottom: 26px;
}

.jis-hero-cover {
    max-width: 360px;
    width: 100%;
    justify-self: center;
}

.jis-cover-frame {
    border-radius: 13px;
    transform: none;
    box-shadow: 0 20px 42px rgba(11, 37, 69, 0.18), inset 0 0 0 1px rgba(255, 255, 255, 0.14);
}

.jis-hero-cover:hover .jis-cover-frame {
    transform: translateY(-2px);
    box-shadow: 0 24px 52px rgba(11, 37, 69, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.16);
}

.jis-cover-spine {
    left: 16px;
    right: 16px;
    bottom: -10px;
    min-height: 44px;
    padding: 9px 16px;
    border-radius: 9px;
    font-size: 10.5px;
}

.jis-eyebrow {
    margin-bottom: 13px;
    padding: 6px 12px;
    font-size: 10.5px;
}

.jis-hero-meta {
    margin-bottom: 10px;
    color: #647184;
    font-size: 13px;
    line-height: 1.35;
}

.jis-hero-title {
    max-width: 760px;
    margin-bottom: 14px;
    font-size: clamp(32px, 3.2vw, 44px);
    line-height: 1.08;
    letter-spacing: 0;
}

.jis-hero-theme {
    gap: 9px;
    margin-bottom: 14px;
    padding: 7px 12px;
    border-style: solid;
    border-radius: 10px;
    font-size: 12.5px;
    line-height: 1.35;
}

.jis-theme-label {
    font-size: 10px;
    letter-spacing: .055em;
}

.jis-hero-lead {
    max-width: 680px;
    margin-bottom: 18px;
    color: #5d6b7d;
    font-size: 15px;
    line-height: 1.65;
}

.jis-hero-inline {
    gap: 12px;
    margin-bottom: 20px;
    padding: 10px 14px;
    border-radius: 11px;
}

.jis-inline-stat {
    gap: 7px;
    font-size: 12.5px;
    line-height: 1.3;
}

.jis-inline-stat strong {
    font-size: 14.5px;
}

.jis-btn {
    min-height: 40px;
    padding: 10px 15px;
    border-radius: 9px;
    font-size: 12.5px;
}

.jis-toolbar {
    top: 84px;
    align-items: stretch;
    padding: 10px;
    margin-bottom: 12px;
    border-radius: 14px;
    box-shadow: 0 10px 28px rgba(11, 37, 69, 0.08);
}

.jis-toolbar .jis-search {
    min-width: 280px;
    border-radius: 12px;
}

.jis-toolbar .jis-search input {
    min-height: 36px;
    font-size: 13px;
}

.jis-toolbar .jis-toolbar-fields {
    margin-left: auto;
    gap: 8px;
}

.jis-toolbar .jis-field select {
    min-height: 44px;
    min-width: 142px;
    padding: 8px 32px 8px 42px !important;
    text-indent: 0;
    border-radius: 9px;
    font-size: 12.5px;
    line-height: 1.2;
}

.jis-toolbar .jis-field > i {
    left: 15px;
    width: 14px;
    font-size: 11px;
    opacity: .82;
}

.jis-view-toggle {
    align-items: center;
    padding: 3px;
    border-radius: 9px;
}

.jis-toolbar .jis-view-toggle button {
    width: 34px;
    height: 34px;
}

.jis-status-row {
    margin: 10px 2px 16px;
}

.jis-result-status {
    color: #536174;
    font-size: 13px;
    line-height: 1.35;
}

.jis-keywords {
    margin-bottom: 20px;
    padding: 16px 18px;
    border-radius: 14px;
    box-shadow: var(--jis-shadow-sm);
}

.jis-keywords-head {
    margin-bottom: 12px;
}

.jis-keywords-title {
    gap: 8px;
    font-size: 14px;
    line-height: 1.25;
}

.jis-keywords-hint {
    font-size: 11.5px;
}

.jis-keyword-chip {
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 11.5px;
    line-height: 1.2;
}

.jis-articles {
    gap: 16px;
}

.jis-art-card {
    padding: 18px;
    border-radius: 14px;
    box-shadow: var(--jis-shadow-sm);
}

.jis-art-card.is-highly-cited::after {
    width: 3px;
}

.jis-art-head {
    gap: 6px;
    margin-bottom: 10px;
}

.jis-badge {
    padding: 4px 8px;
    font-size: 9.5px;
    letter-spacing: .035em;
}

.jis-art-title {
    margin-bottom: 8px;
    font-size: 17px;
    line-height: 1.32;
}

.jis-art-authors {
    margin-bottom: 10px;
    font-size: 13px;
    line-height: 1.45;
}

.jis-art-abstract {
    margin-bottom: 12px;
    font-size: 13.5px;
    line-height: 1.58;
}

.jis-art-tags {
    gap: 6px;
    margin-bottom: 12px;
}

.jis-art-tag {
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 11px;
    line-height: 1.2;
}

.jis-art-footer {
    gap: 12px;
    padding-top: 12px;
}

.jis-art-doi {
    max-width: min(100%, 360px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
}

.jis-art-metrics {
    gap: 10px;
}

.jis-art-metric {
    gap: 5px;
    font-size: 11.5px;
}

.jis-citation-heat span {
    width: 3px;
    height: 9px;
}

.jis-art-actions {
    gap: 7px;
    margin-top: 12px;
    padding-top: 11px;
}

.jis-act-btn {
    min-height: 38px;
    padding: 8px 11px;
    border-radius: 8px;
    font-size: 11.5px;
}

.jis-act-btn.is-icon {
    width: 38px;
}

.jis-featured {
    margin: 22px 0 0;
    padding: 26px;
    border-radius: 18px;
    background: linear-gradient(180deg, #eef3f8 0%, #e3eaf3 100%);
    border-color: #d6e0eb;
}

.jis-section-head {
    align-items: center;
    margin-bottom: 18px;
}

.jis-section-eyebrow {
    margin-bottom: 5px;
    font-size: 10.5px;
    letter-spacing: .07em;
}

.jis-section-title {
    font-size: 24px;
    line-height: 1.2;
}

.jis-featured-tabs {
    border-radius: 10px;
}

.jis-featured-tabs button {
    padding: 8px 11px;
    border-radius: 7px;
    font-size: 11.5px;
}

.jis-featured-grid {
    gap: 14px;
}

.jis-featured-card {
    padding: 18px;
    border-radius: 13px;
}

.jis-featured-rank {
    margin-bottom: 11px;
    padding: 5px 9px;
    font-size: 9.5px;
}

.jis-featured-title {
    margin-bottom: 8px;
    font-size: 15.5px;
    line-height: 1.32;
}

.jis-featured-authors {
    margin-bottom: 12px;
    font-size: 12.5px;
}

.jis-featured-metrics {
    gap: 12px;
    padding-top: 12px;
}

.jis-featured-metrics span {
    gap: 5px;
    font-size: 11px;
}

.main-footer.footer-style-three.at-home6 {
    margin-top: 0;
}

@media (max-width: 1100px) {
    .jis-hero {
        grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
        gap: 34px;
    }

    .jis-toolbar {
        top: 70px;
    }

    .jis-toolbar .jis-toolbar-fields {
        width: 100%;
        margin-left: 0;
    }

    .jis-toolbar .jis-field {
        flex: 1 1 150px;
    }

    .jis-toolbar .jis-field select {
        width: 100%;
    }
}

@media (max-width: 900px) {
    .jis-section {
        padding-top: 34px;
    }

    .jis-hero {
        grid-template-columns: 1fr;
        gap: 28px;
        padding-bottom: 28px;
    }

    .jis-hero-cover {
        max-width: 300px;
    }

    .jis-hero-copy {
        max-width: 720px;
    }

    .jis-articles[data-view="list"] .jis-art-card {
        padding: 18px;
    }
}

@media (max-width: 640px) {
    .jis-section {
        padding: 28px 0 48px;
    }

    .jis-shell {
        padding: 0 14px;
    }

    .issue-spotlight-title {
        font-size: 28px !important;
    }

    .editorial-hero-stats {
        gap: 16px;
    }

    .jis-hero-title {
        font-size: 28px;
    }

    .jis-hero-theme,
    .jis-hero-inline {
        width: 100%;
    }

    .jis-hero-inline {
        align-items: flex-start;
        flex-direction: column;
    }

    .jis-inline-sep {
        display: none;
    }

    .jis-toolbar .jis-search {
        min-width: 0;
        width: 100%;
    }

    .jis-toolbar .jis-toolbar-fields {
        display: grid;
        grid-template-columns: 1fr;
    }

    .jis-view-toggle {
        width: 100%;
        justify-content: center;
    }

    .jis-toolbar .jis-view-toggle button {
        flex: 1 1 0;
    }

    .jis-art-card {
        padding: 16px;
    }

    .jis-art-footer,
    .jis-art-metrics {
        align-items: flex-start;
        flex-direction: column;
    }

    .jis-act-btn:not(.is-icon) {
        flex: 1 1 auto;
        justify-content: center;
    }

    .jis-featured {
        padding: 20px 14px;
        border-radius: 14px;
    }

    .jis-featured-tabs {
        width: 100%;
    }

    .jis-featured-tabs button {
        flex: 1 1 46%;
        justify-content: center;
    }
}

/* Issue toolbar polish: cleaner search + select controls */
.jis-section .jis-toolbar {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 9px;
    border-radius: 13px;
}

.jis-section .jis-toolbar .jis-search {
    min-width: 0;
    height: 48px;
    padding: 0 12px;
    border-radius: 12px;
}

.jis-section .jis-toolbar .jis-search > i {
    width: 22px;
    margin-right: 10px;
    color: #64748b;
    font-size: 14px;
    text-align: center;
}

.jis-section .jis-toolbar .jis-search input {
    min-height: 46px;
    padding: 0;
    color: var(--jis-navy);
    font-size: 13.5px;
    font-weight: 600;
}

.jis-section .jis-toolbar .jis-search input::placeholder {
    color: #94a3b8;
    font-weight: 600;
}

.jis-section .jis-toolbar .jis-toolbar-fields {
    display: grid;
    grid-template-columns: 146px 132px 152px 82px;
    align-items: center;
    gap: 8px;
    width: auto;
    margin-left: 0;
}

.jis-section .jis-toolbar .jis-field {
    display: block;
    width: 100%;
    min-width: 0;
}

.jis-section .jis-toolbar .jis-field > i {
    display: none;
}

.jis-section .jis-toolbar .jis-field select {
    display: block;
    width: 100%;
    min-width: 0;
    height: 48px;
    min-height: 48px;
    padding: 0 34px 0 14px !important;
    border: 1px solid var(--jis-line);
    border-radius: 10px;
    background:
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%230b2545' d='M6 8 0 1.6 1.5 0 6 4.8 10.5 0 12 1.6z'/></svg>") right 14px center / 10px 7px no-repeat,
        #fff;
    color: var(--jis-navy);
    font-size: 13px;
    font-weight: 700;
    line-height: 48px;
    text-indent: 0;
    box-shadow: none;
}

.jis-section .jis-toolbar .jis-field select:hover,
.jis-section .jis-toolbar .jis-search:hover {
    border-color: #cbd7e6;
}

.jis-section .jis-toolbar .jis-field select:focus,
.jis-section .jis-toolbar .jis-search:focus-within {
    border-color: rgba(29, 78, 216, 0.42);
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.09);
}

.jis-section .jis-toolbar .jis-view-toggle {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    width: 82px;
    height: 48px;
    padding: 3px;
    border-radius: 10px;
}

.jis-section .jis-toolbar .jis-view-toggle button {
    width: auto;
    height: 40px;
    border-radius: 8px;
    font-size: 15px;
}

@media (max-width: 1180px) {
    .jis-section .jis-toolbar {
        grid-template-columns: 1fr;
    }

    .jis-section .jis-toolbar .jis-toolbar-fields {
        grid-template-columns: repeat(3, minmax(0, 1fr)) 82px;
        width: 100%;
    }
}

@media (max-width: 720px) {
    .jis-section .jis-toolbar .jis-toolbar-fields {
        grid-template-columns: 1fr;
    }

    .jis-section .jis-toolbar .jis-view-toggle {
        width: 100%;
    }
}

/* Issue toolbar density: smaller search/select controls */
.jis-section .jis-toolbar {
    gap: 8px;
    padding: 7px;
    border-radius: 12px;
}

.jis-section .jis-toolbar .jis-search {
    height: 40px;
    padding: 0 10px;
    border-radius: 10px;
}

.jis-section .jis-toolbar .jis-search > i {
    width: 18px;
    margin-right: 8px;
    font-size: 12.5px;
}

.jis-section .jis-toolbar .jis-search input {
    min-height: 38px;
    font-size: 12.5px;
}

.jis-section .jis-toolbar .jis-toolbar-fields {
    grid-template-columns: 126px 116px 132px 72px;
    gap: 7px;
}

.jis-section .jis-toolbar .jis-field select {
    height: 40px;
    min-height: 40px;
    padding: 0 28px 0 12px !important;
    border-radius: 8px;
    background-position: right 12px center;
    background-size: 9px 6px;
    font-size: 12.5px;
    line-height: 40px;
}

.jis-section .jis-toolbar .jis-view-toggle {
    width: 72px;
    height: 40px;
    padding: 3px;
    border-radius: 8px;
}

.jis-section .jis-toolbar .jis-view-toggle button {
    height: 32px;
    border-radius: 6px;
    font-size: 13px;
}

.jis-section .jis-toolbar .nice-select {
    height: 40px;
    min-height: 40px;
    padding-right: 30px;
    padding-left: 12px;
    border-radius: 8px;
    font-size: 12.5px;
    line-height: 38px;
}

.jis-section .jis-toolbar .nice-select::after {
    right: 12px;
    width: 8px;
    height: 8px;
    margin-top: -5px;
}

.jis-section .jis-toolbar .nice-select .list {
    min-width: 100%;
    margin-top: 6px;
    border-radius: 8px;
}

.jis-section .jis-toolbar .nice-select .option {
    min-height: 34px;
    padding: 7px 12px;
    font-size: 12.5px;
    line-height: 20px;
}

@media (max-width: 1180px) {
    .jis-section .jis-toolbar .jis-toolbar-fields {
        grid-template-columns: repeat(3, minmax(0, 1fr)) 72px;
    }
}

/* Article card action buttons: compact density */
.jis-section .jis-art-actions {
    gap: 6px;
    margin-top: 10px;
    padding-top: 10px;
}

.jis-section .jis-act-btn {
    min-height: 32px;
    padding: 7px 10px;
    border-radius: 7px;
    gap: 5px;
    font-size: 11px;
    line-height: 1;
}

.jis-section .jis-act-btn i {
    font-size: 11.5px;
}

.jis-section .jis-act-btn.is-primary {
    padding-right: 12px;
    padding-left: 12px;
}

.jis-section .jis-act-btn.is-icon {
    width: 34px;
    min-width: 34px;
    padding: 0;
}

@media (max-width: 640px) {
    .jis-section .jis-act-btn {
        min-height: 34px;
    }

    .jis-section .jis-act-btn.is-icon {
        width: 34px;
    }
}

/* Default desktop viewing scale: visually matches browser zoom at 80%. */
@media (min-width: 1200px) {
    body {
        zoom: 0.80;
    }
}

@supports not (zoom: 1) {
    @media (min-width: 1200px) {
        body {
            width: 125%;
            transform: scale(0.8);
            transform-origin: top left;
        }
    }
}

/* Volume archive card layout: fixed 4-up desktop grid with natural image color. */
.pub-arc-section:not(.is-list-view) .pub-arc-issues {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.pub-arc-issue-cover {
    background: #ffffff;
}

.pub-arc-issue-cover img,
.pub-arc-issue:hover .pub-arc-issue-cover img {
    opacity: 1;
    filter: none;
    mix-blend-mode: normal;
}

@media (max-width: 1199px) {
    .pub-arc-section:not(.is-list-view) .pub-arc-issues {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 991px) {
    .pub-arc-section:not(.is-list-view) .pub-arc-issues {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575px) {
    .pub-arc-section:not(.is-list-view) .pub-arc-issues {
        grid-template-columns: 1fr;
    }
}

/* Volume archive hero: full-width blue band like editorial team, without 100vw overflow. */
/* Band tinggi mengikuti seluruh konten hero (eyebrow + title + lead + search + pills + stats)
   dan ikut menutupi toolbar gelap di bawahnya — supaya tidak ada gap putih dan pills
   tidak terpotong di tepi pita. */
.pub-arc-section {
    --pub-arc-hero-band: 510px;
    padding-top: 0;
    background:
        radial-gradient(circle at 82% 70px, rgba(29, 78, 216, 0.45) 0%, transparent 360px),
        radial-gradient(circle at 12% 330px, rgba(7, 22, 48, 0.55) 0%, transparent 340px),
        linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(180deg, #0b2545 0, #102a55 var(--pub-arc-hero-band), #f6f8fb var(--pub-arc-hero-band), #f6f8fb 100%);
    background-size: auto, auto, 72px 72px, 72px 72px, auto;
}

.pub-arc-section .pub-arc-hero {
    margin-left: 0;
    margin-right: 0;
    padding-top: 64px;
    padding-bottom: 28px;
    border-radius: 0;
    background: transparent;
}

.pub-arc-section .pub-arc-hero::before {
    display: none;
}

/* Tarik toolbar merapat ke hero supaya tidak ada gap putih di antara keduanya. */
.pub-arc-section .pub-arc-toolbar {
    margin-top: 0;
    margin-bottom: 36px;
margin-top: -46px;
    /* Distribusi pakai gap, bukan space-between, supaya tidak ada dead space
       besar di tengah toolbar. */
    justify-content: flex-start;
    gap: 16px;
}

.pub-arc-section .pub-arc-toolbar-left { flex: 0 0 auto; }

.pub-arc-section .pub-arc-toolbar-right {
    /* Right group mengisi sisa lebar; status menempel di kiri group ini
       (mengisi area tengah toolbar), view toggle tetap di ujung kanan. */
    flex: 1 1 auto;
    justify-content: flex-end;
    gap: 14px;
}

.pub-arc-section .pub-arc-toolbar-right .pub-arc-result-status {
    margin: 0 auto 0 4px;
    font-size: 12.5px;
    font-weight: 600;
    white-space: nowrap;
}

@media (max-width: 1199px) {
    .pub-arc-section { --pub-arc-hero-band: 570px; }
}

@media (max-width: 991px) {
    .pub-arc-section { --pub-arc-hero-band: 690px; }
}

@media (max-width: 760px) {
    .pub-arc-section { --pub-arc-hero-band: 830px; }
}

/* Issue page: align hero band and content shell with the archive/editorial layout. */
.funfact-section-two.issue-spotlight-section,
.funfact-section-two.processing-section.issue-spotlight-section {
    padding: 0 !important;
    background:
        radial-gradient(circle at 82% 70px, rgba(29, 78, 216, 0.38) 0%, transparent 360px),
        radial-gradient(circle at 12% 330px, rgba(7, 22, 48, 0.5) 0%, transparent 340px),
        linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(135deg, #0b2545 0%, #102a55 55%, #0b2545 100%);
    background-size: auto, auto, 72px 72px, 72px 72px, auto;
}

.issue-spotlight-section::before,
.issue-spotlight-section::after {
    display: none;
}

.issue-spotlight-section .container {
    max-width: none;
    padding: 0;
}

.funfact-section-two.processing-section.issue-spotlight-section .outer-box {
    max-width: 1450px;
    margin: 0 auto;
    padding: 64px 16px 52px;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.issue-spotlight-section .journal-impact-copy,
.issue-spotlight-section .editorial-hero-stats {
    max-width: 100%;
    margin-left: 0;
}

.issue-spotlight-section .editorial-hero-stats {
    margin-top: 28px;
}

.jis-section {
    padding-top: 44px;
}

.jis-shell {
    max-width: 1450px;
}

.jis-hero {
    grid-template-columns: minmax(260px, 380px) minmax(0, 1fr);
    gap: 52px;
}

.jis-hero-cover {
    max-width: 380px;
}

@media (max-width: 900px) {
    .issue-spotlight-section .outer-box {
        padding: 44px 18px 42px;
    }

    .jis-section {
        padding-top: 34px;
    }
}

/* ==========================================================================
   Hero typography normalization
   Targets: articles (.ar-hero-section), vol (.pub-arc-hero),
            editorial_team (.editorial-hero-section),
            issue (.issue-spotlight-section)
   Goal: enforce a single hierarchy across all four hero variants.
   ========================================================================== */
.ar-hero-section,
.pub-arc-hero,
.editorial-hero-section,
.issue-spotlight-section {
    --hero-pad-top:        clamp(56px, 7vw, 88px);
    --hero-pad-bottom:     clamp(44px, 5.5vw, 64px);
    --hero-eyebrow-fs:     12px;
    --hero-eyebrow-fw:     800;
    --hero-eyebrow-tr:     0.08em;
    --hero-title-fs:       clamp(30px, 3.6vw, 48px);
    --hero-title-fw:       700;
    --hero-title-lh:       1.12;
    --hero-title-ls:       -0.01em;
    --hero-lead-fs:        16px;
    --hero-lead-lh:        1.6;
    --hero-search-input-fs:15px;
    --hero-search-input-fw:500;
    --hero-meta-label-fs:  11.5px;
    --hero-meta-label-tr:  0.06em;
    --hero-stat-value-fs:  24px;
    --hero-stat-value-fw:  800;
    --hero-stat-value-lh:  1.05;
    --hero-stat-label-fs:  12px;
    --hero-stat-label-fw:  600;
    --hero-stat-label-lh:  1.3;
    --hero-text:           #ffffff;
    --hero-text-soft:      rgba(255, 255, 255, 0.78);
    --hero-text-muted:     rgba(255, 255, 255, 0.7);
    --hero-eyebrow-bg:     rgba(255, 255, 255, 0.08);
    --hero-eyebrow-bd:     rgba(255, 255, 255, 0.2);
    --hero-eyebrow-fg:     #c8d8ff;
}

/* ---------- Padding rhythm (consistent vertical spacing) ---------- */
/* Horizontal padding aligns inner content with the centered container (logo gutter). */
.ar-hero { padding: var(--hero-pad-top) 16px var(--hero-pad-bottom) !important; }
.pub-arc-hero { padding: var(--hero-pad-top) 36px var(--hero-pad-bottom) !important; }
.funfact-section-two.processing-section.editorial-hero-section .outer-box,
.funfact-section-two.processing-section.issue-spotlight-section .outer-box {
    max-width: none !important;
    margin: 0 !important;
    padding: var(--hero-pad-top)
             max(20px, calc((100vw - var(--container-width, 1344px)) / 2))
             var(--hero-pad-bottom) !important;
}

/* ---------- Eyebrow ---------- */
.pub-arc-hero .pub-arc-eyebrow,
.editorial-hero-section .journal-impact-copy .sub-title,
.issue-spotlight-section .journal-impact-copy .sub-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px !important;
    padding: 7px 16px !important;
    border-radius: 999px !important;
    border: 1px solid var(--hero-eyebrow-bd) !important;
    background: var(--hero-eyebrow-bg) !important;
    color: var(--hero-eyebrow-fg) !important;
    font-size: var(--hero-eyebrow-fs) !important;
    font-weight: var(--hero-eyebrow-fw) !important;
    line-height: 1 !important;
    letter-spacing: var(--hero-eyebrow-tr) !important;
    text-transform: uppercase !important;
    backdrop-filter: blur(6px);
    min-width: 0 !important;
    text-align: left;
}

/* ---------- Title ---------- */
.ar-hero__title,
.pub-arc-hero .pub-arc-title,
.editorial-hero-section .journal-impact-copy .title,
.issue-spotlight-section .journal-impact-copy .title,
.issue-spotlight-title {
    margin: 0 0 14px !important;
    color: var(--hero-text) !important;
    font-size: var(--hero-title-fs) !important;
    font-weight: var(--hero-title-fw) !important;
    line-height: var(--hero-title-lh) !important;
    letter-spacing: var(--hero-title-ls) !important;
    text-wrap: balance;
}

/* ---------- Lead / subtitle ---------- */
.ar-hero__subtitle,
.pub-arc-hero .pub-arc-lead {
    max-width: 620px;
    margin: 0 0 24px;
    color: var(--hero-text-soft) !important;
    font-size: var(--hero-lead-fs) !important;
    font-weight: 400 !important;
    line-height: var(--hero-lead-lh) !important;
}
.ar-hero__subtitle { margin-left: auto; margin-right: auto; }

/* ---------- Search input ---------- */
.ar-hero__search input,
.pub-arc-hero .pub-arc-search input {
    font-size: var(--hero-search-input-fs) !important;
    font-weight: var(--hero-search-input-fw) !important;
    line-height: 1.4 !important;
}

/* ---------- Meta label (e.g. "Browse by year") ---------- */
.pub-arc-hero .pub-arc-quick-label {
    color: var(--hero-text-muted) !important;
    font-size: var(--hero-meta-label-fs) !important;
    font-weight: 700 !important;
    letter-spacing: var(--hero-meta-label-tr) !important;
    text-transform: uppercase;
}

/* ---------- Stats: value & label ---------- */
.editorial-hero-section .editorial-hero-stats .editorial-stat-value,
.issue-spotlight-section .editorial-hero-stats .editorial-stat-value,
.pub-arc-hero .pub-arc-stat-value {
    /* font-size: var(--hero-stat-value-fs) !important; */
    font-weight: var(--hero-stat-value-fw) !important;
    line-height: var(--hero-stat-value-lh) !important;
    color: var(--hero-text) !important;
}

.editorial-hero-section .editorial-hero-stats .editorial-stat-label,
.issue-spotlight-section .editorial-hero-stats .editorial-stat-label,
.pub-arc-hero .pub-arc-stat-label {
    font-size: var(--hero-stat-label-fs) !important;
    font-weight: var(--hero-stat-label-fw) !important;
    line-height: var(--hero-stat-label-lh) !important;
    color: var(--hero-text-muted) !important;
    letter-spacing: 0.02em;
}

/* Articles inline stats (different markup, same scale) */
.ar-hero__stats .ar-stat__value {
    font-size: var(--hero-stat-value-fs);
    font-weight: var(--hero-stat-value-fw);
    line-height: var(--hero-stat-value-lh);
    color: var(--hero-text);
}
.ar-hero__stats .ar-stat__label {
    font-size: var(--hero-stat-label-fs);
    font-weight: var(--hero-stat-label-fw);
    line-height: var(--hero-stat-label-lh);
    color: var(--hero-text-muted);
}

/* ---------- Mobile rhythm ---------- */
@media (max-width: 720px) {
    .ar-hero-section,
    .pub-arc-hero,
    .editorial-hero-section,
    .issue-spotlight-section {
        --hero-title-fs: clamp(26px, 7vw, 34px);
        --hero-lead-fs:  15px;
        --hero-stat-value-fs: 20px;
    }
}

/* ============================================================
   Issue Spotlight — adopt ar-hero-section visual treatment
   Scoped to .iss-hero-bg (only issue.html opts in via this hook).
   ============================================================ */
.funfact-section-two.processing-section.journal-impact-section.iss-hero-bg {
    position: relative;
    overflow: hidden;
    color: #ffffff;
    background:
        radial-gradient(circle at 85% 20%, rgba(29, 78, 216, 0.45) 0%, transparent 55%),
        radial-gradient(circle at 15% 80%, rgba(7, 22, 48, 0.55) 0%, transparent 50%),
        linear-gradient(135deg, #0b2545 0%, #102a55 50%, #0b2545 100%) !important;
}

/* Replace existing ::before grid with the articles-hero 56px grid */
.iss-hero-bg.journal-impact-section::before {
    background:
        linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px) !important;
    background-size: 56px 56px, 56px 56px !important;
    opacity: 0.7 !important;
}

/* Suppress the diagonal frame artifact from journal-impact-section::after */
.iss-hero-bg.journal-impact-section::after { display: none !important; }

/* Lift content above the grid overlay */
.iss-hero-bg .container,
.iss-hero-bg .outer-box { position: relative; z-index: 1; }


/* === Hero with background slider (index_2) === */
.banner-section-four.hero-with-bg-slider {
    position: relative;
    overflow: hidden;
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding: 180px 0 120px;
}

.banner-section-four.hero-with-bg-slider .hero-bg-slider {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.banner-section-four.hero-with-bg-slider .hero-bg-slider .swiper,
.banner-section-four.hero-with-bg-slider .hero-bg-slider .swiper-wrapper,
.banner-section-four.hero-with-bg-slider .hero-bg-slider .swiper-slide {
    width: 100%;
    height: 100%;
}

.banner-section-four.hero-with-bg-slider .hero-bg-slider .swiper-slide .image,
.banner-section-four.hero-with-bg-slider .hero-bg-slider .swiper-slide figure.image {
    width: 100%;
    height: 100%;
    margin: 0;
}

.banner-section-four.hero-with-bg-slider .hero-bg-slider .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.banner-section-four.hero-with-bg-slider .hero-bg-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(11, 37, 69, 0.78) 0%, rgba(11, 37, 69, 0.65) 100%);
    z-index: 1;
}

.banner-section-four.hero-with-bg-slider .container {
    position: relative;
    z-index: 2;
}

.banner-section-four.hero-with-bg-slider .sec-shape,
.banner-section-four.hero-with-bg-slider .bg-shape {
    z-index: 1;
    pointer-events: none;
}

.banner-section-four.hero-with-bg-slider .content-box .title,
.banner-section-four.hero-with-bg-slider .content-box .text {
    color: #fff;
}

.banner-section-four.hero-with-bg-slider .arry-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.4);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.3s ease;
}

.banner-section-four.hero-with-bg-slider .arry-btn:hover {
    background: rgba(255, 255, 255, 0.3);
}

.banner-section-four.hero-with-bg-slider .banner-slider-four-prev { left: 24px; }
.banner-section-four.hero-with-bg-slider .banner-slider-four-next { right: 24px; }

/* ==========================================================================
   Journal title block (replaces logo image in main-header)
   ========================================================================== */
.main-header .logo-box .journal-title { display: flex; align-items: center; }
.main-header .logo-box .journal-title a {
    display: block;
    text-decoration: none;
    line-height: 1.2;
}
.main-header .logo-box .journal-title .journal-name {
    margin: 0;
    font-size: 17px;
    font-weight: 800;
    color: #0b2545;
    letter-spacing: -0.01em;
    line-height: 1.2;
}
.main-header .logo-box .journal-title .journal-publisher {
    margin: 3px 0 0;
    font-size: 12px;
    font-weight: 500;
    color: #5b6b85;
    line-height: 1.3;
}
.main-header .logo-box .journal-title a:hover .journal-name { color: #133a7a; }

@media (max-width: 991px) {
    .main-header .logo-box .journal-title .journal-name { font-size: 15px; }
    .main-header .logo-box .journal-title .journal-publisher { font-size: 11px; }
}
@media (max-width: 575px) {
    .main-header .logo-box .journal-title .journal-name { font-size: 13px; }
    .main-header .logo-box .journal-title .journal-publisher { display: none; }
}

/* ==========================================================================
   About the Journal — Indexer statistics card
   (replaces the revenue/chart card in .faq-section-two .info)
   ========================================================================== */
.about-journal-section .image-column .info { width: auto; max-width: 380px; }
/* Indexer card is taller than the original chart-card it replaces, so make sure
   the section reserves enough room for the bottom overhang and that the card
   stays above the following partners section's white background. */
.about-journal-section { padding-bottom: 100px; }
.about-journal-section .image-column .inner-column .info { z-index: 5; }
.about-journal-section .indexer-card { position: relative; z-index: 5; }
@media (max-width: 991.98px) {
    .about-journal-section { padding-bottom: 60px; }
    .about-journal-section .image-column .inner-column .info {
        position: static;
        margin-top: 24px;
    }
}

/* ==========================================================================
   Manuscript CTA — replaces the "Building Connections / Growth Rate" banner
   ========================================================================== */
.manuscript-cta-section {
    position: relative;
    padding: 90px 0;
    background: linear-gradient(135deg, var(--theme-color2) 0%, #0e2b58 60%, #102f63 100%);
    overflow: hidden;
    isolation: isolate;
}
.manuscript-cta-section__bg {
    position: absolute;
    inset: 0;
    z-index: -2;
    opacity: 0.22;
}
.manuscript-cta-section__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(100%) brightness(0.55);
}
.manuscript-cta-section .sec-shape {
    position: absolute;
    left: -60px;
    top: 50%;
    transform: translateY(-50%);
    z-index: -1;
    opacity: 0.18;
    pointer-events: none;
}
.manuscript-cta-section .sec-shape img { max-width: 320px; }
.manuscript-cta-section::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(135deg, rgba(11, 42, 91, 0.88) 0%, rgba(16, 47, 99, 0.72) 60%, rgba(11, 42, 91, 0.5) 100%);
}
.manuscript-cta {
    display: flex;
    align-items: center;
    gap: 32px;
    flex-wrap: wrap;
    color: #ffffff;
}
.manuscript-cta__content { flex: 1 1 520px; min-width: 0; }
.manuscript-cta__badge {
    display: inline-block;
    background: var(--theme-color1);
    color: var(--theme-color2);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 8px 18px;
    border-radius: 999px;
    margin-bottom: 18px;
}
.manuscript-cta__title {
    color: #ffffff;
    font-size: 40px;
    line-height: 1.18;
    font-weight: 700;
    margin: 0 0 16px;
}
.manuscript-cta__text {
    color: rgba(255, 255, 255, 0.78);
    font-size: 16px;
    line-height: 1.7;
    max-width: 620px;
    margin: 0;
}
.manuscript-cta__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    flex-shrink: 0;
}
.manuscript-cta__btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 26px;
    font-size: 15px;
    font-weight: 700;
    border-radius: 8px;
    transition: all 0.25s ease;
    border: 1px solid transparent;
    white-space: nowrap;
}
.manuscript-cta__btn--primary {
    background: var(--theme-color1);
    color: var(--theme-color2);
}
.manuscript-cta__btn--primary:hover {
    background: #ffffff;
    color: var(--theme-color2);
}
.manuscript-cta__btn--ghost {
    background: transparent;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.45);
}
.manuscript-cta__btn--ghost:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: #ffffff;
}
.manuscript-cta__btn i { font-size: 13px; }

@media (max-width: 991.98px) {
    .manuscript-cta-section { padding: 60px 0; }
    .manuscript-cta__title { font-size: 30px; }
    .manuscript-cta { gap: 24px; }
}

/* ==========================================================================
   Current Issues — issue cards (replaces .service-block-two services section)
   ========================================================================== */
.issue-block .inner-box { position: relative; }
.issue-block .icon,
.issue-block .icon svg { color: var(--theme-color2); }
.issue-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: rgba(var(--theme-color1-rgb), 0.16);
    color: var(--theme-color1);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 5px 12px;
    border-radius: 999px;
    margin-bottom: 18px;
    align-self: flex-start;
}
.issue-badge--current { background: rgba(var(--theme-color1-rgb), 0.18); color: var(--theme-color1); }
.issue-badge--latest  { background: rgba(var(--theme-color1-rgb), 0.10); color: var(--theme-color1); }
.issue-badge--recent  { background: rgba(11, 42, 91, 0.08); color: var(--theme-color2); }
.services-section .sec-title .text { color: #6b7a93; line-height: 1.7; }

.indexer-card {
    background: linear-gradient(135deg, var(--theme-color2) 0%, #102f63 100%);
    border-radius: 18px;
    padding: 22px 24px;
    box-shadow: none;
    border: 1px solid rgba(255, 255, 255, 0.08);
    width: 360px;
    max-width: 100%;
    color: #ffffff;
}
.indexer-card__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.indexer-card__title {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.25;
}
.indexer-card__subtitle {
    display: block;
    margin-top: 2px;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.65);
    font-weight: 500;
}
.indexer-card__badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: rgba(var(--theme-color1-rgb), 0.18);
    color: var(--theme-color1);
    font-size: 11px;
    font-weight: 700;
    padding: 4px 9px;
    border-radius: 999px;
    white-space: nowrap;
    border: 1px solid rgba(var(--theme-color1-rgb), 0.35);
}
.indexer-card__stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    padding: 16px 0 14px;
}
.indexer-stat { text-align: center; }
.indexer-stat__value {
    display: block;
    font-size: 22px;
    font-weight: 800;
    color: #ffffff;
    line-height: 1.1;
    letter-spacing: -0.01em;
}
.indexer-stat__label {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    color: rgba(255, 255, 255, 0.65);
    font-weight: 500;
    line-height: 1.25;
}
.indexer-card__logos {
    list-style: none;
    margin: 0;
    padding: 12px 0 0;
    border-top: 1px dashed rgba(255, 255, 255, 0.15);
    display: flex;
    flex-wrap: wrap;
    gap: 6px 8px;
}
.indexer-card__logos li {
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 6px;
    letter-spacing: 0.01em;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

@media (max-width: 575px) {
    .indexer-card { width: 100%; padding: 18px; }
    .indexer-stat__value { font-size: 18px; }
}

/* Indexer Marquee (replaces Trusted By client logos) */
.indexer-marquee { gap: 18px; }
.indexer-block {
    display: inline-flex;
    text-decoration: none;
    margin: 0 10px;
}
.indexer-block .inner-box {
    min-width: 220px;
    padding: 22px 28px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    transition: all .25s ease;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.03);
}
.indexer-block:hover .inner-box {
    border-color: #1e3a8a;
    box-shadow: 0 8px 22px rgba(30, 58, 138, 0.12);
    transform: translateY(-3px);
}
.indexer-logo {
    font-family: inherit;
    font-weight: 700;
    font-size: 22px;
    color: #0f172a;
    letter-spacing: .2px;
    line-height: 1.1;
}
.indexer-logo em {
    font-style: normal;
    color: #f59e0b;
    margin-left: 4px;
}
.indexer-sub {
    font-size: 12px;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: .6px;
    font-weight: 500;
}
@media (max-width: 575px) {
    .indexer-block .inner-box { min-width: 180px; padding: 16px 20px; }
    .indexer-logo { font-size: 18px; }
}

/* ==========================================================
   Featured Articles section (replaces testimonial slider)
   ========================================================== */
.featured-articles-section { background: #f7f8fb; }
.featured-articles-section .container {
    max-width: 1280px;
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
}
.featured-articles-section .sec-title .flex-content {
    display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap;
}
.featured-articles-section .sec-title .title { margin: 0; }

.featured-article-slider { padding-bottom: 60px; }
.featured-article-slider .swiper-slide { height: auto; display: flex; }
.featured-article-block { width: 100%; display: flex; }
.featured-article-block .inner-box {
    display: flex;
    flex-direction: column;
    width: 100%;
    background: #ffffff;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.05);
    border: 1px solid rgba(15, 23, 42, 0.05);
    transition: transform .25s ease, box-shadow .25s ease;
}
.featured-article-block .inner-box:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.10);
}
.featured-article-block .thumb {
    position: relative;
    margin: 0;
    overflow: hidden;
    aspect-ratio: 16 / 10;
    background: #0f172a;
}
.featured-article-block .thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .5s ease;
}
.featured-article-block .inner-box:hover .thumb img { transform: scale(1.05); }
.featured-article-block .thumb .video-btn {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 54px; height: 54px;
    border-radius: 50%;
    background: #f59e0b;
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 18px;
    box-shadow: 0 8px 24px rgba(245, 158, 11, 0.45);
    transition: transform .25s ease;
}
.featured-article-block .thumb .video-btn:hover { transform: translate(-50%, -50%) scale(1.08); }
.article-badge {
    position: absolute;
    top: 16px; left: 16px;
    background: #16a34a;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .6px;
    text-transform: uppercase;
    padding: 6px 12px;
    border-radius: 999px;
}

.featured-article-block .content-box {
    padding: 24px 24px 26px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1;
}
.article-meta-top { display: flex; gap: 8px; flex-wrap: wrap; }
.meta-pill {
    font-size: 9.5px;
    font-weight: 600;
    letter-spacing: .4px;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 999px;
    background: #f1f5f9;
    color: #475569;
    line-height: 1.4;
}
.meta-pill--accent { background: #fef3c7; color: #b45309; }

.article-title {
    font-size: 18px;
    line-height: 1.35;
    font-weight: 700;
    margin: 2px 0 4px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 3em;
}
.article-title a { color: #0f172a; text-decoration: none; transition: color .2s ease; }
.article-title a:hover { color: #1e3a8a; }

.article-authors {
    color: #64748b;
    font-size: 12px;
    margin: 0;
    font-weight: 500;
    line-height: 1.45;
}
.article-authors i { color: #94a3b8; margin-right: 5px; font-size: 11px; }

.article-abstract {
    color: #64748b;
    font-size: 13.5px;
    line-height: 1.65;
    margin: 2px 0 4px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.article-doi {
    font-size: 12px;
    color: #475569;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 7px 10px;
    display: flex;
    align-items: center;
    gap: 6px;
    word-break: break-all;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.article-doi a {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
}
.article-doi i { color: #1e3a8a; }
.article-doi a { color: #1e3a8a; text-decoration: none; font-weight: 500; }
.article-doi a:hover { text-decoration: underline; }

.article-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    padding: 10px 0;
    border-top: 1px dashed #e2e8f0;
    border-bottom: 1px dashed #e2e8f0;
}
.article-stats .stat {
    display: flex; align-items: center; gap: 6px;
    font-size: 12px;
    color: #64748b;
}
.article-stats .stat i { color: #1e3a8a; font-size: 12px; }
.article-stats .stat strong { color: #0f172a; font-weight: 700; }

.article-actions {
    display: flex; align-items: center; flex-wrap: wrap;
    gap: 8px;
    margin-top: auto;
    padding-top: 4px;
}
.article-actions .btn-link {
    color: #1e3a8a;
    font-weight: 600;
    text-decoration: none;
    font-size: 13px;
    margin-right: auto;
}
.article-actions .btn-link:hover { color: #f59e0b; }
.article-actions .btn-ghost {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 6px 10px;
    border: 1px solid #e2e8f0;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 500;
    color: #475569;
    text-decoration: none;
    transition: all .2s ease;
}
.article-actions .btn-ghost:hover { border-color: #1e3a8a; color: #1e3a8a; background: #f8fafc; }

/* Responsive */
@media (max-width: 575px) {
    .featured-articles-section .sec-title .flex-content { flex-direction: column; align-items: flex-start; }
    .featured-article-block .content-box { padding: 20px; }
    .article-title { font-size: 17px; }
}

/* ==========================================================
   Journal News Section — refined for academic context
   ========================================================== */
.journal-news-section .sec-title .flex-content {
    display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap;
}
.journal-news-section .sec-title .title { margin: 0; }
.journal-news-block .inner-box {
    transition: transform .25s ease, box-shadow .25s ease;
}
.journal-news-block .inner-box:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.10);
}
.journal-news-block .image-box { position: relative; overflow: hidden; }
.journal-news-block .image img {
    transition: transform .5s ease;
}
.journal-news-block .inner-box:hover .image img { transform: scale(1.05); }

.news-category {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 2;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .6px;
    text-transform: uppercase;
    padding: 5px 11px;
    border-radius: 999px;
    background: #1e3a8a;
    color: #fff;
    box-shadow: 0 4px 12px rgba(30, 58, 138, 0.25);
}
.news-category--cfp { background: #f59e0b; box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3); }
.news-category--announcement { background: #1e3a8a; }
.news-category--indexing { background: #16a34a; box-shadow: 0 4px 12px rgba(22, 163, 74, 0.3); }
.news-category--event { background: #7c3aed; box-shadow: 0 4px 12px rgba(124, 58, 237, 0.3); }

.journal-news-block .info {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    padding: 0;
    margin: 0 0 12px;
    list-style: none;
}
.journal-news-block .info li {
    display: flex; align-items: center; gap: 6px;
    font-size: 12.5px;
    color: #64748b;
}
.journal-news-block .info li i { color: #1e3a8a; font-size: 12px; }
.journal-news-block .info li a { color: #64748b; text-decoration: none; }
.journal-news-block .info li a:hover { color: #1e3a8a; }

.journal-news-block .content-box .title {
    font-size: 18px;
    line-height: 1.4;
    font-weight: 700;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 3.2em;
}
.journal-news-block .content-box .title a { color: #0f172a; transition: color .2s ease; }
.journal-news-block .content-box .title a:hover { color: #1e3a8a; }


/* ==========================================================
   News Hub — premium publisher News & Announcements page
   Used by: pages/news.html (.news-hub scope)
   ========================================================== */
/* ===== News Hub — scoped premium publisher styles ===== */
.news-hub {
    --nh-bg:        var(--color-surface, #f8fafc);
    --nh-surface:   var(--color-bg, #ffffff);
    --nh-ink:       var(--color-text-primary, #0f172a);
    --nh-ink-2:     var(--color-text-primary, #334155);
    --nh-mute:      var(--color-text-secondary, #64748b);
    --nh-line:      var(--color-border, #e2e8f0);
    --nh-line-soft: var(--color-surface-soft, #eef2f6);
    --nh-brand:     var(--color-primary-dark, #1e3a8a);
    --nh-brand-2:   var(--color-primary, #2e4fbd);
    --nh-accent:    var(--color-secondary, #f59e0b);
    --nh-success:   var(--color-accent, #16a34a);
    --nh-violet:    #7c3aed;
    --nh-rose:      #e11d48;
    --nh-radius:    16px;
    --nh-radius-sm: 10px;
    --nh-shadow-1:  0 1px 2px rgba(15,23,42,.04), 0 4px 12px rgba(15,23,42,.04);
    --nh-shadow-2:  0 12px 32px rgba(15,23,42,.10);
    --nh-font:      "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

    font-family: var(--nh-font);
    color: var(--nh-ink);
    background: var(--nh-bg);
    display: block;
    line-height: 1.6;
}
.news-hub *, .news-hub *::before, .news-hub *::after { box-sizing: border-box; }
.news-hub a { color: inherit; text-decoration: none; }
.news-hub button { font: inherit; cursor: pointer; }
.news-hub img { display: block; max-width: 100%; height: auto; }
.news-hub .nh-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
}

/* ===== Hero ===== */
.nh-hero {
    position: relative;
    padding: 72px 0 56px;
    background:
        radial-gradient(1100px 360px at 12% -10%, rgba(30,58,138,.08), transparent 60%),
        radial-gradient(900px 320px at 100% 10%, rgba(245,158,11,.08), transparent 55%),
        linear-gradient(180deg, #ffffff 0%, var(--nh-bg) 100%);
    border-bottom: 1px solid var(--nh-line);
}
.nh-hero__grid {
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    gap: 56px;
    align-items: center;
}
.nh-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 11px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase;
    color: var(--nh-brand);
    background: rgba(30,58,138,.08);
    padding: 6px 12px; border-radius: 999px;
}
.nh-eyebrow .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--nh-accent); }
.nh-hero__title {
    font-size: clamp(32px, 4.4vw, 56px);
    line-height: 1.08;
    font-weight: 800;
    letter-spacing: -.02em;
    margin: 18px 0 16px;
    color: var(--nh-ink);
}
.nh-hero__title em {
    font-style: normal;
    background: linear-gradient(90deg, var(--nh-brand), var(--nh-accent));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.nh-hero__sub {
    font-size: 16.5px;
    color: var(--nh-mute);
    max-width: 560px;
    margin: 0 0 26px;
}
.nh-hero__cta { display: flex; gap: 12px; flex-wrap: wrap; }
.nh-btn {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 12px 20px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 14px;
    border: 1px solid transparent;
    transition: all .2s ease;
    text-decoration: none;
}
.nh-btn--primary { background: var(--nh-brand); color: #fff; }
.nh-btn--primary:hover { background: var(--nh-brand-2); transform: translateY(-1px); box-shadow: 0 8px 20px rgba(30,58,138,.25); }
.nh-btn--ghost { background: #fff; color: var(--nh-ink); border-color: var(--nh-line); }
.nh-btn--ghost:hover { border-color: var(--nh-brand); color: var(--nh-brand); }
.nh-btn svg { width: 16px; height: 16px; }

.nh-hero__feature {
    position: relative;
    background: #fff;
    border: 1px solid var(--nh-line);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--nh-shadow-1);
}
.nh-hero__feature .fig {
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: linear-gradient(135deg, #1e3a8a 0%, #2e4fbd 60%, #f59e0b 140%);
}
.nh-hero__feature .fig img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.nh-hero__feature:hover .fig img { transform: scale(1.04); }
.nh-hero__feature .body { padding: 22px 24px 24px; }
.nh-hero__feature .meta { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--nh-mute); margin-bottom: 8px; }
.nh-hero__feature h3 { font-size: 20px; line-height: 1.35; margin: 0 0 10px; font-weight: 700; }
.nh-hero__feature p { margin: 0; color: var(--nh-mute); font-size: 14px; }

/* ===== Category badges ===== */
.nh-cat {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 10.5px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase;
    padding: 4px 10px; border-radius: 999px;
    background: var(--nh-line-soft); color: var(--nh-ink-2);
}
.nh-cat[data-cat="announcement"]    { background: rgba(30,58,138,.10); color: var(--nh-brand); }
.nh-cat[data-cat="article-highlight"]{ background: rgba(124,58,237,.10); color: var(--nh-violet); }
.nh-cat[data-cat="editorial-update"]{ background: rgba(225,29,72,.10); color: var(--nh-rose); }
.nh-cat[data-cat="call-for-papers"] { background: rgba(245,158,11,.14); color: #b45309; }
.nh-cat[data-cat="event"]           { background: rgba(22,163,74,.10); color: var(--nh-success); }

/* ===== Featured Stories ===== */
.nh-featured { padding: 64px 0 24px; }
.nh-section-head {
    display: flex; align-items: end; justify-content: space-between; gap: 24px;
    margin-bottom: 28px;
}
.nh-section-head h2 {
    font-size: 28px; font-weight: 800; letter-spacing: -.01em; margin: 6px 0 4px; color: var(--nh-ink);
}
.nh-section-head p { color: var(--nh-mute); font-size: 14.5px; margin: 0; max-width: 520px; }
.nh-section-head .nh-link {
    font-weight: 600; font-size: 14px; color: var(--nh-brand);
    display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
}
.nh-section-head .nh-link:hover { gap: 10px; }

.nh-featured__grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 24px;
}
.nh-card {
    background: #fff;
    border: 1px solid var(--nh-line);
    border-radius: var(--nh-radius);
    overflow: hidden;
    display: flex; flex-direction: column;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.nh-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--nh-shadow-2);
    border-color: transparent;
}
.nh-card .nh-thumb {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 10;
    background: #e2e8f0;
}
.nh-card .nh-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.nh-card:hover .nh-thumb img { transform: scale(1.05); }
.nh-card .nh-thumb .nh-cat { position: absolute; top: 14px; left: 14px; backdrop-filter: blur(6px); }
.nh-card .nh-body { padding: 22px 22px 24px; display: flex; flex-direction: column; flex: 1; gap: 10px; }
.nh-card .nh-meta {
    display: flex; align-items: center; gap: 14px; font-size: 12px; color: var(--nh-mute);
}
.nh-card .nh-meta .dot { width: 3px; height: 3px; border-radius: 50%; background: #cbd5e1; }
.nh-card .nh-title {
    font-size: 18px; line-height: 1.4; font-weight: 700; margin: 0;
    display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.nh-card .nh-title a { color: var(--nh-ink); transition: color .2s ease; }
.nh-card .nh-title a:hover { color: var(--nh-brand); }
.nh-card .nh-excerpt {
    margin: 0; color: var(--nh-mute); font-size: 14px; line-height: 1.65;
    display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.nh-card .nh-foot {
    margin-top: auto;
    display: flex; align-items: center; justify-content: space-between;
    padding-top: 12px; border-top: 1px solid var(--nh-line-soft);
    font-size: 13px;
}
.nh-card .nh-foot .nh-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.nh-tag {
    font-size: 11px; font-weight: 500; color: var(--nh-mute);
    background: var(--nh-line-soft); padding: 3px 8px; border-radius: 6px;
}
.nh-card .nh-read {
    font-weight: 600; color: var(--nh-brand);
    display: inline-flex; align-items: center; gap: 5px;
}
.nh-card .nh-read:hover { gap: 8px; }

/* Featured big card variant */
.nh-card--big .nh-thumb { aspect-ratio: 16 / 9; }
.nh-card--big .nh-title { font-size: 24px; -webkit-line-clamp: 3; line-clamp: 3; }
.nh-card--big .nh-excerpt { font-size: 14.5px; -webkit-line-clamp: 4; line-clamp: 4; }
.nh-featured__side { display: grid; grid-template-rows: 1fr 1fr; gap: 24px; }
.nh-featured__side .nh-card .nh-thumb { aspect-ratio: 16 / 9; }
.nh-featured__side .nh-card .nh-title { font-size: 16px; }
.nh-featured__side .nh-card .nh-excerpt { -webkit-line-clamp: 2; line-clamp: 2; }

/* ===== Toolbar (filter/search) ===== */
.nh-toolbar-wrap { padding: 12px 0 0; position: sticky; top: 0; z-index: 30; }
.nh-toolbar {
    display: grid;
    grid-template-columns: 1.5fr repeat(3, 1fr) auto;
    gap: 10px;
    background: rgba(255,255,255,.9);
    backdrop-filter: blur(10px);
    border: 1px solid var(--nh-line);
    border-radius: 14px;
    padding: 10px;
    box-shadow: var(--nh-shadow-1);
}
.nh-toolbar__field {
    display: flex; align-items: center; gap: 8px;
    background: #fff;
    border: 1px solid var(--nh-line);
    border-radius: 10px;
    padding: 0 12px;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.nh-toolbar__field:focus-within {
    border-color: var(--nh-brand);
    box-shadow: 0 0 0 3px rgba(30,58,138,.10);
}
.nh-toolbar__field svg { width: 16px; height: 16px; color: var(--nh-mute); flex-shrink: 0; }
.nh-toolbar input,
.nh-toolbar select {
    border: 0; outline: 0; background: transparent;
    padding: 12px 0; font-size: 14px; color: var(--nh-ink);
    width: 100%; min-width: 0;
    appearance: none; -webkit-appearance: none; -moz-appearance: none;
}
.nh-toolbar select {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2364748b'><path d='M4 6l4 4 4-4'/></svg>");
    background-repeat: no-repeat;
    background-position: right 0 center;
    padding-right: 18px;
    cursor: pointer;
}
.nh-toolbar__clear {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 10px 14px; border-radius: 10px;
    background: var(--nh-ink); color: #fff; border: 0;
    font-size: 13px; font-weight: 600;
    transition: opacity .2s ease;
}
.nh-toolbar__clear:hover { opacity: .85; }

/* topic tags row */
.nh-tags-row {
    display: flex; flex-wrap: wrap; gap: 8px;
    margin: 16px 0 4px;
}
.nh-chip {
    font-size: 12.5px; padding: 6px 12px; border-radius: 999px;
    background: #fff; border: 1px solid var(--nh-line); color: var(--nh-ink-2);
    cursor: pointer; transition: all .2s ease;
}
.nh-chip:hover { border-color: var(--nh-brand); color: var(--nh-brand); }
.nh-chip.is-active { background: var(--nh-brand); color: #fff; border-color: var(--nh-brand); }

/* ===== Main: grid + sidebar ===== */
.nh-main { padding: 32px 0 80px; }
.nh-main__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 40px;
    align-items: start;
}

.nh-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}
.nh-empty {
    grid-column: 1 / -1;
    text-align: center; padding: 60px 24px;
    background: #fff; border: 1px dashed var(--nh-line); border-radius: var(--nh-radius);
    color: var(--nh-mute);
}
.nh-empty strong { color: var(--nh-ink); display: block; font-size: 16px; margin-bottom: 6px; }

.nh-load {
    margin: 36px auto 0; display: flex; justify-content: center;
}
.nh-load button {
    display: inline-flex; align-items: center; gap: 10px;
    background: #fff; border: 1px solid var(--nh-line); color: var(--nh-ink);
    padding: 12px 26px; border-radius: 999px; font-weight: 600; font-size: 14px;
    transition: all .2s ease;
}
.nh-load button:hover { border-color: var(--nh-brand); color: var(--nh-brand); transform: translateY(-1px); }
.nh-load button[disabled] { opacity: .55; cursor: not-allowed; }
.nh-load .spinner {
    width: 14px; height: 14px; border-radius: 50%;
    border: 2px solid var(--nh-line); border-top-color: var(--nh-brand);
    animation: nh-spin .7s linear infinite; display: none;
}
.nh-load.is-loading .spinner { display: inline-block; }
@keyframes nh-spin { to { transform: rotate(360deg); } }

/* ===== Sidebar ===== */
.nh-side {
    position: sticky; top: 100px;
    display: flex; flex-direction: column; gap: 18px;
}
.nh-widget {
    background: #fff; border: 1px solid var(--nh-line); border-radius: var(--nh-radius);
    padding: 20px;
}
.nh-widget h4 {
    font-size: 12.5px; letter-spacing: .8px; text-transform: uppercase;
    margin: 0 0 14px; color: var(--nh-mute); font-weight: 700;
    display: flex; align-items: center; gap: 8px;
}
.nh-widget h4::before {
    content: ""; width: 14px; height: 2px; background: var(--nh-brand); border-radius: 2px;
}
.nh-trend { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 14px; }
.nh-trend li { display: grid; grid-template-columns: 24px 1fr; gap: 12px; align-items: start; }
.nh-trend .num {
    font-weight: 800; font-size: 14px; color: var(--nh-brand);
}
.nh-trend a {
    font-size: 13.5px; line-height: 1.45; color: var(--nh-ink); font-weight: 500;
    display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.nh-trend a:hover { color: var(--nh-brand); }
.nh-trend small { display: block; color: var(--nh-mute); font-size: 11.5px; margin-top: 3px; font-weight: 500; }

.nh-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.nh-metric {
    background: var(--nh-bg); border-radius: 10px; padding: 12px;
}
.nh-metric .v { font-size: 20px; font-weight: 800; color: var(--nh-brand); line-height: 1; }
.nh-metric .l { font-size: 11.5px; color: var(--nh-mute); margin-top: 4px; text-transform: uppercase; letter-spacing: .4px; }

.nh-issue {
    position: relative; overflow: hidden;
    background: linear-gradient(135deg, var(--nh-brand) 0%, var(--nh-brand-2) 100%);
    color: #fff; border: 0;
    padding: 22px;
}
.nh-issue::before {
    content: ""; position: absolute; right: -40px; top: -40px;
    width: 140px; height: 140px; border-radius: 50%;
    background: rgba(255,255,255,.06);
}
.nh-issue h4 { color: rgba(255,255,255,.75); }
.nh-issue h4::before { background: var(--nh-accent); }
.nh-issue .vol { font-size: 22px; font-weight: 800; margin: 0 0 4px; }
.nh-issue .ttl { font-size: 13.5px; opacity: .85; margin: 0 0 16px; line-height: 1.5; }
.nh-issue a {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 13px; font-weight: 600;
    color: var(--nh-accent);
}

.nh-tagcloud { display: flex; flex-wrap: wrap; gap: 6px; }
.nh-tagcloud a {
    font-size: 12px; padding: 5px 10px; border-radius: 999px;
    background: var(--nh-line-soft); color: var(--nh-ink-2);
    transition: all .2s ease;
}
.nh-tagcloud a:hover { background: var(--nh-brand); color: #fff; }

.nh-submit {
    background: var(--nh-ink); color: #fff; border: 0;
}
.nh-submit h4 { color: rgba(255,255,255,.6); }
.nh-submit h4::before { background: var(--nh-accent); }
.nh-submit p { font-size: 13.5px; opacity: .8; margin: 0 0 14px; }
.nh-submit .nh-btn { width: 100%; justify-content: center; }
.nh-submit .nh-btn--primary { background: var(--nh-accent); }
.nh-submit .nh-btn--primary:hover { background: #d97706; }

/* ===== CTA Bottom ===== */
.nh-cta-section { padding: 56px 0 84px; }
.nh-cta-card {
    position: relative; overflow: hidden;
    border-radius: 22px;
    background: linear-gradient(120deg, #0b1020 0%, var(--nh-brand) 60%, var(--nh-brand-2) 100%);
    padding: 56px clamp(28px, 5vw, 80px);
    color: #fff;
    display: grid;
    grid-template-columns: 1.4fr auto;
    align-items: center; gap: 40px;
}
.nh-cta-card::before, .nh-cta-card::after {
    content: ""; position: absolute; border-radius: 50%;
    background: rgba(255,255,255,.05);
}
.nh-cta-card::before { width: 360px; height: 360px; right: -100px; top: -160px; }
.nh-cta-card::after { width: 220px; height: 220px; right: 200px; bottom: -120px; background: rgba(245,158,11,.10); }
.nh-cta-card h2 {
    font-size: clamp(26px, 3vw, 38px); font-weight: 800; letter-spacing: -.01em;
    line-height: 1.18; margin: 0 0 12px; position: relative;
    color: #ffffff !important;
}
.nh-cta-card p {
    color: rgba(255,255,255,.85) !important;
    font-size: 15.5px; margin: 0; max-width: 540px; position: relative;
}
.nh-cta-card .nh-cta__actions {
    position: relative;
    display: flex; gap: 12px; flex-wrap: wrap;
}
.nh-cta-card .nh-btn--primary { background: var(--nh-accent); color: #18181b; }
.nh-cta-card .nh-btn--primary:hover { background: #fbbf24; }
.nh-cta-card .nh-btn--ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.30); }
.nh-cta-card .nh-btn--ghost:hover { border-color: #fff; color: #fff; }

/* ===== Responsive ===== */
@media (max-width: 1100px) {
    .nh-main__grid { grid-template-columns: 1fr; }
    .nh-side { position: static; flex-direction: row; flex-wrap: wrap; }
    .nh-side > * { flex: 1 1 260px; }
}
@media (max-width: 960px) {
    .nh-hero__grid { grid-template-columns: 1fr; gap: 36px; }
    .nh-featured__grid { grid-template-columns: 1fr; }
    .nh-toolbar { grid-template-columns: 1fr 1fr; }
    .nh-toolbar .nh-toolbar__field--search { grid-column: 1 / -1; }
    .nh-toolbar__clear { grid-column: 1 / -1; justify-content: center; }
    .nh-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .nh-cta-card { grid-template-columns: 1fr; padding: 40px 28px; gap: 24px; }
}
@media (max-width: 600px) {
    .nh-hero { padding: 48px 0 36px; }
    .nh-section-head { flex-direction: column; align-items: flex-start; }
    .nh-grid { grid-template-columns: 1fr; }
    .nh-toolbar { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Theme-aware page content overrides
   These pages are static HTML, so their scoped CSS must resolve through the
   active generated token file instead of fixed blue/gold literals.
   ========================================================================== */
.featured-articles-section {
    background: var(--color-surface, #f7f8fb);
}

.featured-article-block .inner-box,
.journal-news-block .inner-box {
    background: var(--color-bg, #ffffff);
    border-color: var(--color-border, #e2e8f0);
}

.featured-article-block .thumb {
    background: var(--color-primary-dark, #0f172a);
}

.featured-article-block .thumb .video-btn,
.meta-pill--accent,
.news-category,
.news-category--cfp {
    background: var(--color-secondary, #f59e0b);
}

.article-badge,
.news-category--indexing {
    background: var(--color-accent, #16a34a);
}

.news-category--announcement {
    background: var(--color-primary-dark, #1e3a8a);
}

.article-title a,
.journal-news-block .content-box .title a,
.article-stats .stat strong {
    color: var(--color-text-primary, #0f172a);
}

.article-authors,
.article-abstract,
.article-doi,
.article-stats .stat,
.journal-news-block .info li,
.journal-news-block .info li a {
    color: var(--color-text-secondary, #64748b);
}

.article-doi,
.meta-pill,
.article-actions .btn-ghost {
    background: var(--color-surface, #f8fafc);
    border-color: var(--color-border, #e2e8f0);
}

.meta-pill {
    color: var(--color-text-secondary, #475569);
}

.meta-pill--accent {
    color: var(--color-text-primary, #172554);
}

.article-title a:hover,
.article-doi i,
.article-doi a,
.article-stats .stat i,
.article-actions .btn-link,
.article-actions .btn-ghost:hover,
.journal-news-block .info li i,
.journal-news-block .info li a:hover,
.journal-news-block .content-box .title a:hover {
    color: var(--color-primary, #1e3a8a);
}

.article-actions .btn-link:hover {
    color: var(--color-secondary, #f59e0b);
}

.article-stats {
    border-color: var(--color-border, #e2e8f0);
}

.article-actions .btn-ghost:hover {
    background: var(--color-surface-soft, #f8fafc);
    border-color: var(--color-primary, #1e3a8a);
}

.nh-submit .nh-btn--primary:hover,
.nh-cta-card .nh-btn--primary:hover {
    background: var(--color-accent, #fbbf24);
}

.nh-cta-card::after {
    background: rgba(var(--theme-color1-rgb), 0.14);
}

.ar-hero-section,
.pub-arc-hero,
.funfact-section-two.editorial-hero-section,
.funfact-section-two.processing-section.editorial-hero-section,
.funfact-section-two.issue-spotlight-section,
.funfact-section-two.processing-section.issue-spotlight-section {
    background:
        radial-gradient(circle at 85% 20%, rgba(var(--theme-color4-rgb), 0.42) 0%, transparent 55%),
        radial-gradient(circle at 15% 80%, rgba(var(--theme-color2-rgb), 0.64) 0%, transparent 50%),
        linear-gradient(135deg, var(--color-primary-dark, #0b2545) 0%, var(--color-primary, #102a55) 55%, var(--color-primary-dark, #0b2545) 100%) !important;
}

.pub-arc-section {
    background:
        linear-gradient(180deg, var(--color-primary-dark, #0b2545) 0, var(--color-primary, #102a55) var(--pub-arc-hero-band), var(--color-surface, #f6f8fb) var(--pub-arc-hero-band), var(--color-surface, #f6f8fb) 100%) !important;
}

.ar-hero__search-submit,
.ar-btn--primary,
.pub-arc-toolbar,
.nh-hero__feature {
    background: var(--color-primary-dark, #0b2545);
}

.ar-hero__search-submit:hover,
.ar-btn--primary:hover {
    background: var(--color-primary, #102a55);
    border-color: var(--color-primary, #102a55);
}

/* Volume archive hero polish */
.pub-arc-section {
    --pub-arc-hero-band: 500px;
}

.pub-arc-shell {
    max-width: 1280px;
}

.pub-arc-section .pub-arc-hero {
    grid-template-columns: minmax(0, 1fr) minmax(410px, 0.72fr);
    gap: clamp(32px, 5vw, 72px);
    align-items: center;
    padding-top: 58px;
    padding-bottom: 106px;
}

.pub-arc-hero-copy {
    max-width: 660px;
}

.pub-arc-hero .pub-arc-eyebrow {
    margin-bottom: 18px;
    padding: 7px 14px;
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.86);
}

.pub-arc-hero .pub-arc-title {
    max-width: 650px;
    margin-bottom: 18px;
    font-size: clamp(34px, 3.8vw, 48px);
    line-height: 1.12;
}

.pub-arc-hero .pub-arc-lead {
    max-width: 610px;
    margin-bottom: 24px;
    font-size: 16px;
    line-height: 1.62;
}

.pub-arc-hero .pub-arc-search {
    max-width: 560px;
    margin-bottom: 20px;
    padding: 4px;
}

.pub-arc-hero .pub-arc-search input {
    min-height: 42px;
}

.pub-arc-hero .pub-arc-quick {
    align-items: center;
    gap: 12px;
    margin-top: 0;
    margin-bottom: 0;
    padding-bottom: 10px;
}

.pub-arc-hero .pub-arc-quick-years {
    gap: 7px;
}

.pub-arc-hero .pub-arc-quick-year {
    min-height: 34px;
    padding: 7px 13px;
}

.pub-arc-hero .pub-arc-hero-stats {
    justify-self: end;
    align-self: center;
    width: min(100%, 500px);
    margin-top: 0;
    padding: 20px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.075);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 18px 42px rgba(var(--theme-color2-rgb), 0.18);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.pub-arc-hero .pub-arc-stat {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 9px;
    row-gap: 3px;
    min-height: 72px;
    padding: 12px 10px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.07);
}

.pub-arc-hero .pub-arc-stat-icon {
    width: 26px;
    height: 26px;
    color: var(--color-secondary, #38BDF8);
    font-size: 21px;
}

.pub-arc-hero .pub-arc-stat-value,
.pub-arc-hero .pub-arc-stat-value[data-stat="yearSpan"],
.pub-arc-hero .pub-arc-stat-value[data-stat="totalCitations"],
.pub-arc-hero .pub-arc-stat-value[data-stat="totalViews"] {
    font-size: 17px;
    line-height: 1.08;
}

.pub-arc-hero .pub-arc-stat:has(.pub-arc-stat-value[data-stat="yearSpan"]) {
    grid-template-columns: 24px minmax(0, 1fr);
    column-gap: 8px;
}

.pub-arc-hero .pub-arc-stat-value[data-stat="yearSpan"] {
    font-size: 15px;
    line-height: 1.12;
    white-space: nowrap;
}

.pub-arc-hero .pub-arc-stat:has(.pub-arc-stat-value[data-stat="yearSpan"]) .pub-arc-stat-icon {
    width: 22px;
    font-size: 19px;
}

.pub-arc-hero .pub-arc-stat-label {
    max-width: none;
    font-size: 10.5px;
    line-height: 1.25;
    color: rgba(255, 255, 255, 0.74);
}

.pub-arc-section .pub-arc-toolbar {
    position: relative;
    z-index: 2;
    margin: -42px 0 56px;
    padding: 10px 12px;
    border-radius: 12px;
    border-color: rgba(255, 255, 255, 0.16);
    background: rgba(var(--theme-color2-rgb), 0.88);
    box-shadow: 0 18px 36px rgba(var(--theme-color2-rgb), 0.18);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.pub-arc-section .pub-arc-toolbar-left {
    gap: 8px;
}

.pub-arc-section .pub-arc-toolbar .pub-arc-field select,
.pub-arc-section .pub-arc-toolbar .nice-select {
    min-width: 150px;
}

@media (max-width: 1199px) {
    .pub-arc-section { --pub-arc-hero-band: 620px; }

    .pub-arc-section .pub-arc-hero {
        grid-template-columns: 1fr;
        padding-bottom: 106px;
    }

    .pub-arc-hero .pub-arc-hero-stats {
        justify-self: start;
        width: min(100%, 680px);
    }
}

@media (max-width: 760px) {
    .pub-arc-section { --pub-arc-hero-band: 790px; }

    .pub-arc-section .pub-arc-hero {
        padding-top: 38px;
        padding-bottom: 96px;
    }

    .pub-arc-hero .pub-arc-hero-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 14px;
    }

    .pub-arc-section .pub-arc-toolbar {
        margin-top: -34px;
        margin-bottom: 44px;
        flex-direction: column;
        align-items: stretch;
    }

    .pub-arc-section .pub-arc-toolbar-left,
    .pub-arc-section .pub-arc-toolbar-right {
        width: 100%;
        flex-wrap: wrap;
    }

    .pub-arc-section .pub-arc-toolbar-right .pub-arc-result-status {
        margin: 0;
    }
}

/* Volume archive: keep the hero content constrained, but let the color band span the viewport. */
.pub-arc-section {
    background:
        radial-gradient(circle at 82% 70px, rgba(var(--theme-color4-rgb), 0.38) 0%, transparent 360px),
        radial-gradient(circle at 12% 330px, rgba(var(--theme-color2-rgb), 0.52) 0%, transparent 340px),
        linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(180deg, var(--color-primary-dark, #0b2545) 0, var(--color-primary, #102a55) var(--pub-arc-hero-band), var(--color-surface, #f6f8fb) var(--pub-arc-hero-band), var(--color-surface, #f6f8fb) 100%) !important;
    background-size: auto, auto, 72px 72px, 72px 72px, auto;
}

.pub-arc-section .pub-arc-hero {
    background: transparent !important;
}

.pub-arc-section .pub-arc-toolbar {
    position: sticky;
    top: 86px;
    z-index: 20;
    margin-top: -42px;
}

@media (max-width: 760px) {
    .pub-arc-section .pub-arc-toolbar {
        top: 76px;
        margin-top: -34px;
    }
}

/* Header journal title guard for normal and sticky states. */
.main-header {
    background: var(--color-bg, #ffffff);
    z-index: 1000;
}

.main-header .journal-title,
.main-header .journal-title--sticky {
    display: inline-flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 2px;
    max-width: 390px;
    min-width: 0;
    text-decoration: none !important;
    line-height: 1.2;
}

.main-header .journal-title .journal-name,
.main-header .journal-title--sticky .journal-name {
    display: block;
    margin: 0;
    color: var(--color-text-primary, #0b2545);
    font-size: 17px !important;
    font-weight: 800;
    line-height: 1.18;
    letter-spacing: 0;
    white-space: normal;
}

.main-header .journal-title .journal-publisher,
.main-header .journal-title--sticky .journal-publisher {
    display: block;
    margin: 0;
    color: var(--color-text-secondary, #5b6b85);
    font-size: 12px !important;
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: 0;
    white-space: normal;
}

.main-header .sticky-header {
    z-index: 1000;
}

.main-header .sticky-header .journal-title--sticky .journal-name {
    font-size: 15px !important;
}

.main-header .sticky-header .journal-title--sticky .journal-publisher {
    font-size: 11px !important;
}

@media (max-width: 575px) {
    .main-header .journal-title .journal-name,
    .main-header .journal-title--sticky .journal-name {
        font-size: 13px !important;
    }

    .main-header .journal-title .journal-publisher,
    .main-header .journal-title--sticky .journal-publisher {
        display: none;
    }
}

/* Publications archive list view refinement */
.pub-arc-section.is-list-view .pub-arc-issues {
    gap: 14px;
}

.pub-arc-section.is-list-view .pub-arc-issue {
    grid-template-columns: 190px minmax(0, 1fr);
    min-height: 172px;
    border-radius: 12px;
}

.pub-arc-section.is-list-view .pub-arc-issue-cover {
    min-height: 172px;
}

.pub-arc-section.is-list-view .pub-arc-issue-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 310px 126px;
    grid-template-rows: auto auto 1fr;
    column-gap: 20px;
    row-gap: 6px;
    align-items: center;
    padding: 18px 18px 18px 16px;
}

.pub-arc-section.is-list-view .pub-arc-issue-meta,
.pub-arc-section.is-list-view .pub-arc-issue-date,
.pub-arc-section.is-list-view .pub-arc-issue-title,
.pub-arc-section.is-list-view .pub-arc-issue-desc {
    grid-column: 1;
}

.pub-arc-section.is-list-view .pub-arc-issue-meta {
    align-self: end;
}

.pub-arc-section.is-list-view .pub-arc-issue-date {
    font-size: 11px;
}

.pub-arc-section.is-list-view .pub-arc-issue-title {
    margin: 0;
    font-size: 16px;
}

.pub-arc-section.is-list-view .pub-arc-issue-desc {
    display: -webkit-box;
    max-width: 680px;
    margin: 0;
    color: var(--pa-slate);
    font-size: 13px;
    line-height: 1.5;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.pub-arc-section.is-list-view .pub-arc-issue-metrics {
    grid-column: 2;
    grid-row: 1 / span 3;
    align-self: center;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
    padding: 0;
    border: 0;
}

.pub-arc-section.is-list-view .pub-arc-issue-metric {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 10px;
    border: 1px solid var(--pa-line);
    border-radius: 9px;
    background: var(--pa-bg-2);
}

.pub-arc-section.is-list-view .pub-arc-issue-metric i {
    display: inline-flex;
    margin: 0;
    color: var(--color-secondary, #38BDF8);
}

.pub-arc-section.is-list-view .pub-arc-issue-metric .v {
    font-size: 13px;
}

.pub-arc-section.is-list-view .pub-arc-issue-actions {
    grid-column: 3;
    grid-row: 1 / span 3;
    align-self: center;
    justify-content: flex-end;
    margin: 0;
    padding: 0;
    border: 0;
}

.pub-arc-section.is-list-view .pub-arc-issue-actions .pub-arc-action {
    width: auto;
    min-width: 112px;
    justify-content: center;
    padding: 10px 13px;
    white-space: nowrap;
}

@media (max-width: 1199px) {
    .pub-arc-section.is-list-view .pub-arc-issue-body {
        grid-template-columns: minmax(0, 1fr) 260px;
    }

    .pub-arc-section.is-list-view .pub-arc-issue-actions {
        grid-column: 1 / -1;
        grid-row: auto;
        justify-content: flex-start;
        padding-top: 10px;
        border-top: 1px solid var(--pa-line-soft);
    }
}

@media (max-width: 760px) {
    .pub-arc-section.is-list-view .pub-arc-issue {
        grid-template-columns: 1fr;
    }

    .pub-arc-section.is-list-view .pub-arc-issue-cover {
        min-height: 190px;
    }

    .pub-arc-section.is-list-view .pub-arc-issue-body {
        grid-template-columns: 1fr;
    }

    .pub-arc-section.is-list-view .pub-arc-issue-metrics,
    .pub-arc-section.is-list-view .pub-arc-issue-actions {
        grid-column: 1;
        grid-row: auto;
    }
}

/* News page hero */
.news-hub .nh-hero {
    padding: 72px 0 70px;
    color: #ffffff;
    border-bottom: 0;
    background:
        radial-gradient(circle at 82% 18%, rgba(var(--theme-color4-rgb), 0.42) 0%, transparent 360px),
        radial-gradient(circle at 10% 74%, rgba(var(--theme-color2-rgb), 0.58) 0%, transparent 340px),
        linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(135deg, var(--color-primary-dark, #0b2545) 0%, var(--color-primary, #102a55) 58%, var(--color-primary-dark, #0b2545) 100%);
    background-size: auto, auto, 72px 72px, 72px 72px, auto;
}

.news-hub .nh-hero__title,
.news-hub .nh-hero__sub {
    color: #ffffff;
}

.news-hub .nh-hero__sub {
    color: rgba(255, 255, 255, 0.78);
}

.news-hub .nh-eyebrow {
    color: rgba(255, 255, 255, 0.86);
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.18);
}

.news-hub .nh-hero__title em {
    background: none;
    color: var(--color-secondary, #38BDF8);
    -webkit-background-clip: initial;
    background-clip: initial;
}

.news-hub .nh-hero__feature {
    background: rgba(255, 255, 255, 0.09);
    border-color: rgba(255, 255, 255, 0.16);
    box-shadow: 0 20px 48px rgba(var(--theme-color2-rgb), 0.22);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.news-hub .nh-hero__feature .body h3 {
    color: #ffffff;
}

.news-hub .nh-hero__feature .body p,
.news-hub .nh-hero__feature .meta {
    color: rgba(255, 255, 255, 0.76);
}

.news-hub .nh-toolbar-wrap {
    position: sticky;
    top: 84px;
    z-index: 30;
    margin-top: -40px;
    padding: 0 0 18px;
}

.news-hub .nh-toolbar {
    border-color: rgba(255, 255, 255, 0.16);
    background: rgba(var(--theme-color2-rgb), 0.88);
    box-shadow: 0 18px 36px rgba(var(--theme-color2-rgb), 0.18);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.news-hub .nh-tags-row {
    padding-top: 18px;
}

@media (max-width: 960px) {
    .news-hub .nh-hero {
        padding: 56px 0 68px;
    }

    .news-hub .nh-toolbar-wrap {
        top: 76px;
        margin-top: -32px;
    }
}

/* News filter polish */
.news-hub .nh-toolbar {
    grid-template-columns: minmax(280px, 1.35fr) repeat(3, minmax(170px, 0.78fr)) auto;
    gap: 8px;
    padding: 8px;
    border-radius: 12px;
}

.news-hub .nh-toolbar__field {
    min-height: 44px;
    gap: 9px;
    padding: 0 11px;
    border-radius: 9px;
    border-color: rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.06);
}

.news-hub .nh-toolbar input,
.news-hub .nh-toolbar select {
    padding: 9px 0;
    font-size: 13.5px;
    line-height: 1.25;
    color: #ffffff;
}

.news-hub .nh-toolbar input::placeholder {
    color: rgba(255, 255, 255, 0.62);
}

.news-hub .nh-toolbar__field svg {
    color: rgba(255, 255, 255, 0.62);
}

.news-hub .nh-toolbar select {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'><path d='M4 6l4 4 4-4'/></svg>");
    background-repeat: no-repeat;
    background-position: right 0 center;
}

.news-hub .nh-toolbar select option {
    color: var(--color-text-primary, #102A32);
    background: #ffffff;
}

.news-hub .nh-toolbar__clear {
    min-height: 44px;
    padding: 9px 14px;
    border-radius: 9px;
    font-size: 13px;
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
}

.news-hub .nh-tags-row {
    gap: 7px;
    margin: 14px 0 0;
}

.news-hub .nh-chip {
    padding: 6px 11px;
    font-size: 12.5px;
    line-height: 1.2;
    box-shadow: 0 1px 0 rgba(var(--theme-color2-rgb), 0.04);
    background: #ffffff;
    border-color: var(--color-border, #D4F1F5);
}

@media (max-width: 1180px) {
    .news-hub .nh-toolbar {
        grid-template-columns: 1fr 1fr;
    }

    .news-hub .nh-toolbar__field--search,
    .news-hub .nh-toolbar__clear {
        grid-column: span 2;
    }
}

/* ==========================================================
   Pages Layout Harmonization
   Scope: files inside themes/edupress/pages
   Purpose: keep content width, gutters, and vertical rhythm consistent across
   template-based pages and custom page modules.
   ========================================================== */
.page-wrapper {
    --ph-page-max: 1280px;
    --ph-page-gutter: 20px;
    --ph-section-y: 96px;
    --ph-section-y-sm: 72px;
}

.page-wrapper main > section > .container,
.page-wrapper main > section > .auto-container,
.page-wrapper main > footer > .container,
.page-wrapper main .featured-articles-section .container,
.author-page main > section > .container,
.cfp-page main > section > .container,
.cfp-detail-page main > section > .container {
    max-width: var(--ph-page-max);
    padding-left: var(--ph-page-gutter);
    padding-right: var(--ph-page-gutter);
}

.ar-hero-shell,
.ar-main > .auto-container,
.pub-arc-shell,
.jis-shell,
.news-hub .nh-wrap,
.editorial-team-shell,
.funfact-section-two.processing-section.editorial-hero-section .outer-box,
.funfact-section-two.processing-section.issue-spotlight-section .outer-box {
    max-width: var(--ph-page-max);
    padding-left: var(--ph-page-gutter);
    padding-right: var(--ph-page-gutter);
}

.page-wrapper main > section.pt-120,
.author-page main > section.pt-120,
.cfp-page main > section.pt-120,
.cfp-detail-page main > section.pt-120 {
    padding-top: var(--ph-section-y) !important;
}

.page-wrapper main > section.pb-120,
.author-page main > section.pb-120,
.cfp-page main > section.pb-120,
.cfp-detail-page main > section.pb-120 {
    padding-bottom: var(--ph-section-y) !important;
}

.page-wrapper main > section.pt-100,
.author-page main > section.pt-100,
.cfp-page main > section.pt-100,
.cfp-detail-page main > section.pt-100 {
    padding-top: var(--ph-section-y-sm) !important;
}

.page-wrapper main > section.pb-100,
.author-page main > section.pb-100,
.cfp-page main > section.pb-100,
.cfp-detail-page main > section.pb-100 {
    padding-bottom: var(--ph-section-y-sm) !important;
}

.page-title .auto-container {
    max-width: var(--ph-page-max);
    padding-left: var(--ph-page-gutter);
    padding-right: var(--ph-page-gutter);
}

.sec-title .flex-content {
    gap: 28px;
}

.sec-title .title {
    max-width: 860px;
}

.sec-title.center .title,
.sec-title.text-center .title {
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 1400px) {
    .page-wrapper main > section > .container,
    .page-wrapper main > section > .auto-container,
    .author-page main > section > .container,
    .cfp-page main > section > .container,
    .cfp-detail-page main > section > .container {
        max-width: var(--ph-page-max);
    }
}

@media (max-width: 991px) {
    .page-wrapper {
        --ph-section-y: 76px;
        --ph-section-y-sm: 60px;
    }
}

@media (max-width: 575px) {
    .page-wrapper {
        --ph-page-gutter: 16px;
        --ph-section-y: 64px;
        --ph-section-y-sm: 52px;
    }
}