/* ═══════════════════════════════════════════════════════════
   AMS — Arab Metric Score  |  Main Stylesheet v2
   Font: Cairo (Google Fonts)  |  Icons: Font Awesome 6
   Framework: Bootstrap 5
═══════════════════════════════════════════════════════════ */

/* ── Variables ─────────────────────────────────────────── */
:root {
    --navy:         #1a2e4a;
    --navy-dark:    #0d1c2e;
    --navy-mid:     #132336;
    --gold:         #c9a84c;
    --gold-light:   rgba(201,168,76,.12);
    --gold-border:  rgba(201,168,76,.3);

    --blue-light:   #e6f1fb;
    --blue-mid:     #185fa5;
    --teal-light:   #e1f5ee;
    --teal-mid:     #0f6e56;
    --coral-light:  #faece7;
    --coral-mid:    #993c1d;
    --gold-bg:      #faeeda;
    --gold-text:    #854f0b;
    --purple-light: #eeedfe;
    --purple-mid:   #534ab7;

    --body-bg:      #f5f7fa;
    --white:        #ffffff;
    --border:       #dce4ed;
    --border-light: #eaf0f6;
    --text-dark:    #1a2e4a;
    --text-mid:     #4a6a88;
    --text-muted:   #7a9ab5;
    --text-faint:   #b0c4d8;

    --radius-sm:    6px;
    --radius-md:    8px;
    --radius-lg:    12px;
    --radius-xl:    16px;

    --shadow-sm:    0 1px 4px rgba(26,46,74,.08);
    --shadow-md:    0 4px 16px rgba(26,46,74,.10);
    --shadow-lg:    0 8px 32px rgba(26,46,74,.13);
    --transition:   .18s ease;
}

/* ── Base ──────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.ams-body {
    font-family: 'Cairo', sans-serif;
    font-size: 14px;
    line-height: 1.65;
    color: var(--text-dark);
    background: var(--body-bg);
    -webkit-font-smoothing: antialiased;
}
a { color: var(--blue-mid); text-decoration: none; }
a:hover { color: var(--navy); }
img { max-width: 100%; height: auto; }

/* Prevent scroll when fullscreen menu open */
body.fs-menu-open { overflow: hidden; }

/* ── Colour helpers ────────────────────────────────────── */
.ic-blue   { background: var(--blue-light);   color: var(--blue-mid); }
.ic-teal   { background: var(--teal-light);   color: var(--teal-mid); }
.ic-gold   { background: var(--gold-bg);      color: var(--gold-text); }
.ic-coral  { background: var(--coral-light);  color: var(--coral-mid); }
.ic-purple { background: var(--purple-light); color: var(--purple-mid); }

/* ── Top Bar ───────────────────────────────────────────── */
.ams-topbar {
    background: var(--navy-dark);
    height: 40px;
    font-size: 11px;
    color: #6a8aaa;
}
.topbar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100%;
    padding-top: 10px;
}
.topbar-status { display: flex; align-items: center; gap: 5px; color: #fff; font-size: 14px; }
.topbar-status i { color: #4dcba0; font-size: 14px; }
.topbar-right { display: flex; align-items: center; gap: .9rem; }
.topbar-right a {
    color: #fff; font-size: 14px;
    display: flex; align-items: center; gap: 4px;
    transition: color var(--transition);
}
.topbar-right a:hover { color: var(--gold); }
.topbar-register { color: var(--gold) !important; }
.tb-divider { width: 1px; height: 13px; background: #1e3a55; flex-shrink: 0; }
.topbar-lang-form { display: inline; }
.topbar-lang-btn {
    background: transparent; border: none;
    color: #8fafc7; font-size: 11px; cursor: pointer;
    font-family: 'Cairo', sans-serif;
    display: flex; align-items: center; gap: 4px;
    padding: 0; transition: color var(--transition);
}
.topbar-lang-btn:hover { color: var(--gold); }

/* ── Navbar ─────────────────────────────────────────────── */
.ams-navbar {
    background: #fff;
    height: 64px;
    position: sticky;
    top: 0;
    z-index: 1000;
    border-bottom: 1px solid #e8edf2;
    box-shadow: 0 1px 12px rgba(0,0,0,.06);
    transition: box-shadow var(--transition);
}
.navbar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 64px;
}

/* Brand */
.nav-brand { display: flex; align-items: center; text-decoration: none; }
.nav-logo-img { height: 58px; width: auto; display: block; }

/* Nav right */
.nav-right { display: flex; align-items: center; gap: 10px; }

/* Search icon button */
.nav-search-btn {
    width: 36px; height: 36px; border-radius: var(--radius-md);
    display: flex; align-items: center; justify-content: center;
    color: var(--text-mid); font-size: 15px;
    text-decoration: none;
    transition: color var(--transition), background var(--transition);
}
.nav-search-btn:hover { color: var(--navy); background: var(--body-bg); }

/* Submit journal button */
.nav-submit-btn {
    display: inline-flex; align-items: center; gap: 6px;
    background: var(--gold); color: var(--navy-dark);
    padding: 7px 16px; border-radius: var(--radius-md);
    font-size: 12px; font-weight: 700; text-decoration: none;
    white-space: nowrap;
    transition: opacity var(--transition);
}
.nav-submit-btn:hover { opacity: .88; color: var(--navy-dark); }
.nav-submit-btn span { display: inline; }

.nav-lang-btn {
    background: transparent;
    border: 1px solid #dde3ea;
    color: var(--text-mid);
    padding: 6px 13px;
    border-radius: var(--radius-md);
    font-size: 12px; cursor: pointer;
    font-family: 'Cairo', sans-serif;
    display: flex; align-items: center; gap: 5px;
    transition: background var(--transition), border-color var(--transition);
}
.nav-lang-btn:hover { background: var(--body-bg); border-color: var(--gold-border); color: var(--gold-text); }

/* ── Burger button ──────────────────────────────────────── */
.burger-btn {
    width: 44px; height: 44px;
    border-radius: var(--radius-md);
    background: var(--body-bg);
    border: 1px solid #dde3ea;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    gap: 5px; cursor: pointer;
    transition: background var(--transition), border-color var(--transition);
}
.burger-btn:hover { background: var(--gold-light); border-color: var(--gold-border); }
.burger-bar {
    display: block;
    width: 20px; height: 1.5px;
    background: var(--navy);
    border-radius: 2px;
    transition: transform .3s ease, opacity .3s ease, width .3s ease;
    transform-origin: center;
}
.burger-bar--mid { width: 14px; align-self: flex-end; margin-right: 3px; }
.burger-btn.is-open .burger-bar:nth-child(1) { transform: translateY(6.5px) rotate(45deg); width: 20px; }
.burger-btn.is-open .burger-bar--mid         { opacity: 0; }
.burger-btn.is-open .burger-bar:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); width: 20px; }

/* ── Fullscreen menu ─────────────────────────────────────── */
.fs-menu {
    position: fixed;
    inset: 0;
    background: #fff;
    z-index: 2000;
    display: flex;
    flex-direction: column;
    visibility: hidden;
    opacity: 0;
    transition: opacity .3s ease, visibility .3s ease;
    overflow: hidden;
}
.fs-menu.fs-open { opacity: 1; visibility: visible; }

/* Logo inside fullscreen menu — desktop */
.fs-mobile-header { display: none; } /* hidden on desktop */
.fs-logo-desktop {
    position: absolute; top: .8rem; left: 1.5rem;
    z-index: 10;
}
.fs-logo-desktop img { height: 80px; width: auto; display: block; }
.fs-close-desktop {
    position: absolute; top: 1.2rem; right: 1.5rem; z-index: 10;
}
.fs-back-btn { display: none; } /* hidden on desktop */

.fs-close {
    position: absolute;
    top: 1.2rem; right: 1.5rem;
    width: 44px; height: 44px;
    border-radius: var(--radius-md);
    background: var(--body-bg);
    border: 1px solid #dde3ea;
    color: var(--text-mid); font-size: 20px; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: background var(--transition), color var(--transition);
    z-index: 10;
}
.fs-close:hover { background: var(--gold-light); color: var(--gold-text); border-color: var(--gold-border); }

.fs-inner {
    display: grid;
    grid-template-columns: 340px 1fr;
    flex: 1;
    overflow: hidden;
    padding-top: 0;
}

/* Left: main items */
.fs-left {
    padding: 3rem 3rem 2rem;
    border-right: .5px solid #e8edf2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #fafbfc;
}
.fs-eyebrow {
    font-size: 9px; font-weight: 800;
    color: #aab4be; letter-spacing: 2.5px;
    text-transform: uppercase; margin-bottom: 2rem;
}
.fs-nav-item {
    display: flex; align-items: center; gap: 12px;
    padding: .65rem 0;
    border-bottom: .5px solid #e8edf2;
    cursor: pointer;
}
.fs-nav-item:last-child { border-bottom: none; }
.fs-num {
    font-size: 10px; font-weight: 800;
    color: #c8d0d8; width: 28px; flex-shrink: 0;
    transition: color var(--transition);
}
.fs-label {
    font-size: 26px; font-weight: 800;
    color: #bdc5ce; flex: 1; line-height: 1.1;
    transition: color var(--transition);
}
.fs-arrow {
    font-size: 16px; color: #c8d0d8;
    opacity: 0; transform: translateX(-8px);
    transition: opacity var(--transition), transform var(--transition), color var(--transition);
}
.fs-nav-item.active .fs-num   { color: var(--gold-text); }
.fs-nav-item.active .fs-label { color: var(--navy); }
.fs-nav-item.active .fs-arrow { color: var(--gold-text); opacity: 1; transform: translateX(0); }
.fs-nav-item:hover .fs-label  { color: var(--navy); }

/* Right: sub panels */
.fs-right { padding: 3rem 3.5rem 2rem; overflow-y: auto; background: #fff; }
.fs-panel { display: none; animation: fsSlideIn .22s ease; }
.fs-panel.active { display: block; }
@keyframes fsSlideIn {
    from { opacity: 0; transform: translateX(14px); }
    to   { opacity: 1; transform: translateX(0); }
}
.fs-panel-label {
    font-size: 20px; font-weight: 800;
    color: var(--gold-text); letter-spacing: 2px;
    text-transform: uppercase; margin-bottom: 1.6rem;
}
.fs-sub-cols {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 0 2rem;
}
.fs-sub-group { margin-bottom: 1.8rem; }
.fs-sub-title {
    font-size: 19px; font-weight: 800;
    color: #aab4be; letter-spacing: 1.8px;
    text-transform: uppercase;
    margin-bottom: .7rem; padding-bottom: .5rem;
    border-bottom: .5px solid #e8edf2;
}
.fs-link {
    display: flex; align-items: center; gap: 7px;
    color: var(--text-mid); font-size: 18px; padding: 4px 0;
    text-decoration: none;
    transition: color var(--transition);
}
.fs-link:hover { color: var(--gold-text); }
.fs-link i { font-size: 11px; }
.fs-link--featured { color: var(--navy); font-weight: 900; font-size: 20px; margin-bottom: 2px; }
.fs-link--featured:hover { color: var(--gold-text); }
.fs-link--featured i { color: var(--gold-text); }

/* Bottom bar */
.fs-bottom {
    padding: .9rem 3rem;
    border-top: 1px solid #e8edf2;
    display: flex; align-items: center;
    justify-content: space-between;
    flex-wrap: wrap; gap: .5rem; flex-shrink: 0;
    background: #fafbfc;
}
.fs-bottom-left { display: flex; gap: 1.4rem; align-items: center; flex-wrap: wrap; }
.fs-bottom-left a {
    color: var(--text-mid); font-size: 11px; text-decoration: none;
    display: flex; align-items: center; gap: 5px;
    transition: color var(--transition);
}
.fs-bottom-left a:hover { color: var(--navy); }
.fs-bottom-right { display: flex; align-items: center; gap: 8px; }
.fs-social {
    width: 30px; height: 30px;
    border-radius: var(--radius-sm);
    border: 1px solid #dde3ea;
    color: var(--text-mid);
    display: flex; align-items: center; justify-content: center;
    font-size: 13px; text-decoration: none;
    transition: border-color var(--transition), color var(--transition);
}
.fs-social:hover { border-color: var(--gold); color: var(--gold); }
.fs-cta-btn {
    background: var(--gold); color: var(--navy-dark);
    border: none; padding: 7px 18px;
    border-radius: var(--radius-md);
    font-size: 12px; font-weight: 800; cursor: pointer;
    font-family: 'Cairo', sans-serif;
    display: flex; align-items: center; gap: 6px;
    text-decoration: none; transition: opacity var(--transition);
}
.fs-cta-btn:hover { opacity: .88; color: var(--navy-dark); }

/* ── HERO ───────────────────────────────────────────────── */
.ams-hero-wrap {
    padding: 16px;
    background: #fff;
}
.ams-hero {
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    min-height: 88vh;
    border-radius: 20px;
    overflow: hidden;
}
.ams-hero::before {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(to bottom, rgba(0,0,0,.72) 0%, rgba(0,0,0,.55) 50%, rgba(0,0,0,.78) 100%);
    z-index: 1;
}
.ams-hero > * { position: relative; z-index: 2; }
.hero-video-bg {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    z-index: 0;
    pointer-events: none;
}

/* (field nav bar removed) */

/* Hero body */
.hero-body {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 3.5rem 3.5rem 2rem;
    gap: 3rem;
}

/* Left */
.hero-left {
    flex: 1;
    display: flex; flex-direction: column;
    max-width: 600px;
}
.hero-eyebrow-new {
    display: inline-flex; align-items: center; gap: 6px;
    color: rgba(255,255,255,.55); font-size: 11px; font-weight: 700;
    letter-spacing: 2px; text-transform: uppercase;
    margin-bottom: 1.2rem;
}
.hero-h1-new {
    display: flex; flex-direction: column;
    margin: 0 0 1.4rem; line-height: 1.1;
}
.h1-solid {
    color: #fff;
    font-size: clamp(32px, 4.5vw, 58px);
    font-weight: 900; display: block;
}
.h1-ghost {
    font-size: clamp(32px, 4.5vw, 58px);
    font-weight: 900; display: block;
    color: transparent;
    -webkit-text-stroke: 1.5px rgba(255,255,255,.3);
}
.hero-desc-new {
    color: rgba(255,255,255,.55); font-size: 13px;
    line-height: 1.75; max-width: 480px; margin-bottom: 1.6rem;
}

/* Search tabs */
.search-tabs { display: flex; gap: 4px; margin-bottom: .6rem; flex-wrap: wrap; }
.search-tab {
    background: rgba(255,255,255,.06);
    border: .5px solid rgba(255,255,255,.15);
    color: rgba(255,255,255,.55); font-size: 10px; padding: 5px 13px;
    border-radius: 20px; cursor: pointer;
    font-family: 'Cairo', sans-serif; white-space: nowrap;
    transition: all var(--transition);
}
.search-tab:hover { color: rgba(255,255,255,.85); border-color: rgba(255,255,255,.3); }
.search-tab.active { background: var(--gold); color: var(--navy-dark); border-color: var(--gold); font-weight: 700; }

/* Search field */
.search-field {
    background: rgba(255,255,255,.1);
    border: .5px solid rgba(255,255,255,.2);
    border-radius: 10px;
    display: flex; align-items: center;
    padding: 5px 5px 5px 14px; gap: 8px; margin-bottom: .7rem;
    backdrop-filter: blur(8px);
    transition: border-color var(--transition);
}
.search-field:focus-within { border-color: rgba(201,168,76,.6); }
.search-field i { color: rgba(255,255,255,.4); font-size: 15px; flex-shrink: 0; }
.search-field input {
    background: transparent; border: none; color: #fff;
    font-size: 13px; flex: 1; outline: none;
    font-family: 'Cairo', sans-serif;
}
.search-field input::placeholder { color: rgba(255,255,255,.35); }
.search-btn {
    background: var(--gold); border: none; color: var(--navy-dark);
    padding: 9px 20px; border-radius: 7px;
    font-size: 13px; font-weight: 800; cursor: pointer;
    font-family: 'Cairo', sans-serif; white-space: nowrap;
    display: flex; align-items: center; gap: 6px;
    transition: opacity var(--transition);
}
.search-btn:hover { opacity: .9; }

/* Search bottom row */
.search-bottom-row {
    display: flex; align-items: center;
    justify-content: space-between; gap: 1rem;
}
.search-hints { display: flex; gap: 6px; flex-wrap: wrap; font-size: 10px; color: rgba(255,255,255,.35); align-items: center; }
.search-hint-link { color: var(--gold); cursor: pointer; transition: opacity var(--transition); }
.search-hint-link:hover { opacity: .8; }
.btn-submit-journal {
    display: inline-flex; align-items: center; gap: 6px;
    background: transparent; border: 1px solid rgba(201,168,76,.4);
    color: var(--gold); padding: 6px 14px; border-radius: 7px;
    font-size: 11px; font-weight: 700; text-decoration: none;
    white-space: nowrap; cursor: pointer;
    font-family: 'Cairo', sans-serif;
    transition: background var(--transition);
}
.btn-submit-journal:hover { background: rgba(201,168,76,.12); color: var(--gold); }

/* Hero counters */
.hero-counters {
    display: flex; gap: 0;
    border-top: .5px solid rgba(255,255,255,.1);
    margin-top: 2rem;
}
.hero-counter {
    flex: 1; padding: .9rem .5rem; text-align: center;
    border-right: .5px solid rgba(255,255,255,.1);
}
.hero-counter:last-child { border-right: none; }
.hc-num { color: var(--gold); font-size: 20px; font-weight: 800; }
.hc-label { color: rgba(255,255,255,.4); font-size: 9px; letter-spacing: .5px; }

/* News carousel card */
.hero-news-card {
    width: 300px; flex-shrink: 0;
    border-radius: 20px;
    overflow: hidden;
    align-self: center;
    box-shadow: 0 24px 60px rgba(0,0,0,.5);
}
.hnc-slides { position: relative; }
.hnc-slide {
    display: none;
    height: 400px;
    background-size: cover;
    background-position: center;
    position: relative;
    overflow: hidden;
}
.hnc-slide.active { display: block; }
.hnc-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,.92) 0%, rgba(0,0,0,.4) 50%, rgba(0,0,0,.15) 100%);
}
.hnc-content {
    position: absolute; inset: 0;
    display: flex; flex-direction: column;
    justify-content: space-between;
    padding: 18px 18px 20px;
}
.hnc-top {
    display: flex; align-items: center; justify-content: space-between;
}
.hnc-logo-pill {
    background: rgba(0,0,0,.45);
    backdrop-filter: blur(6px);
    border: .5px solid rgba(255,255,255,.15);
    color: var(--gold); font-size: 10px; font-weight: 800;
    letter-spacing: .8px; padding: 4px 10px; border-radius: 20px;
    display: flex; align-items: center; gap: 5px;
}
.hnc-badge {
    font-size: 9px; font-weight: 800; letter-spacing: 1px;
    color: #fff; padding: 4px 10px; border-radius: 20px;
}
.hnc-bottom { display: flex; flex-direction: column; gap: 8px; }
.hnc-title {
    color: #fff; font-size: 16px; font-weight: 700;
    line-height: 1.4;
}
.hnc-excerpt {
    color: rgba(255,255,255,.6); font-size: 11px;
    line-height: 1.6;
}
.hnc-meta {
    display: flex; align-items: center; justify-content: space-between;
    font-size: 10px; padding-top: 8px;
    border-top: .5px solid rgba(255,255,255,.15);
}
.hnc-meta span { color: rgba(255,255,255,.45); display: flex; align-items: center; gap: 4px; }
.hnc-meta a { color: var(--gold); text-decoration: none; font-weight: 700; display: flex; align-items: center; gap: 4px; }
.hnc-meta a:hover { opacity: .8; }
.hnc-dots {
    display: flex; gap: 6px; justify-content: center;
    padding: 10px 0;
    background: rgba(0,0,0,.6);
    backdrop-filter: blur(8px);
}
.hnc-dot {
    width: 6px; height: 6px; border-radius: 50%;
    background: rgba(255,255,255,.25);
    border: none; cursor: pointer; padding: 0;
    transition: background var(--transition), transform var(--transition);
}
.hnc-dot.active { background: var(--gold); transform: scale(1.3); }

@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.4} }

/* ── Trust Bar ──────────────────────────────────────────── */
/* ── Intro + Trusted By bar ──────────────────────────────── */
.intro-trust-bar {
    background: #fff;
    border-bottom: 1px solid #e8edf2;
    padding: 2.4rem 0;
}
.intro-trust-inner {
    display: flex; align-items: center; gap: 0;
}
.intro-left {
    display: flex; align-items: flex-start; gap: 1.1rem;
    flex: 0 0 42%; padding-right: 3rem;
}
.intro-logo { height: 56px; width: auto; flex-shrink: 0; margin-top: 4px; }
.intro-statement {
    font-size: 20px; font-weight: 900; line-height: 1.45;
    color: var(--navy); margin: 0;
}
.intro-statement em { color: var(--gold-text); font-style: normal; }
.intro-divider {
    width: 1px; align-self: stretch; background: #dde3ea;
    flex-shrink: 0; margin: 0 3rem;
}
.intro-right { flex: 1; }
.intro-trusted-label {
    font-size: 11px; font-weight: 700; letter-spacing: .1em;
    text-transform: uppercase; color: var(--text-faint);
    margin-bottom: 1rem;
}
.intro-logos-grid {
    display: grid; grid-template-columns: repeat(4, 1fr);
    gap: .7rem 1rem;
}
.intro-logo-item {
    display: flex; align-items: center; gap: 7px;
    font-size: 13px; font-weight: 700; color: var(--navy);
    white-space: nowrap;
}
.intro-logo-item i { font-size: 14px; color: var(--text-muted); }
@media (max-width: 991px) {
    .intro-trust-inner { flex-direction: column; gap: 1.6rem; }
    .intro-left { flex: none; width: 100%; padding-right: 0; }
    .intro-divider { width: 100%; height: 1px; align-self: auto; margin: 0; }
    .intro-logos-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 576px) {
    .intro-logos-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── Section common ─────────────────────────────────────── */
.ams-section { padding: 2.5rem 0; }
.ams-section-alt { background: #fff; }
.section-header { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 1.4rem; }
.section-label { font-size: 10px; font-weight: 800; color: var(--gold); letter-spacing: 2px; text-transform: uppercase; margin-bottom: 3px; }
.section-title { font-size: 18px; font-weight: 800; color: var(--navy); margin-bottom: 2px; }
.section-sub   { font-size: 11px; color: var(--text-muted); }
.section-link  { font-size: 11px; color: var(--blue-mid); text-decoration: none; white-space: nowrap; display: flex; align-items: center; gap: 4px; }
.section-link:hover { color: var(--navy); }

/* ── Stats cards ────────────────────────────────────────── */
/* ── Platform Cards (staggered) ─────────────────────────── */
.platform-cards-section {
    background: #f4f5f7;
    padding: 3rem 0 4rem;
}
.platform-cards-label {
    font-size: 11px; font-weight: 700; letter-spacing: .1em;
    text-transform: uppercase; color: var(--text-faint);
    margin-bottom: 2rem;
}
.platform-cards-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    align-items: start;
}
.pc-card {
    border-radius: 20px; overflow: hidden;
    display: flex; flex-direction: column;
    transition: transform .25s ease, box-shadow .25s ease;
}
.pc-card:hover { transform: translateY(-4px); box-shadow: 0 16px 48px rgba(0,0,0,.13); }
.pc-card--offset-0 { margin-top: 0; }
.pc-card--offset-1 { margin-top: 60px; }
.pc-card--dark {
    background: #12181f;
    color: #fff;
}
.pc-card--light {
    background: #fff;
    color: var(--navy);
    border: 1px solid #e4e8ee;
}

/* Full-background video cards (cards 1 & 3) */
.pc-card--bg-video {
    position: relative;
    min-height: 420px;
}
.pc-bg-video {
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    object-fit: cover; object-position: center;
    display: block;
}
.pc-bg-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(160deg, rgba(10,15,20,.45) 0%, rgba(8,12,18,.62) 100%);
}
.pc-bg-overlay--light {
    background: linear-gradient(160deg, rgba(255,255,255,.55) 0%, rgba(250,248,244,.70) 100%);
}
.pc-card-body--over-video {
    position: relative;
    z-index: 1;
}

/* Video strip in light cards (cards 2 & 4) */
.pc-card-video {
    width: 100%; height: 220px;
    flex-shrink: 0;
    object-fit: cover; object-position: center;
    display: block;
}
.pc-card-video--bottom {
    height: 160px;
    margin-top: auto;
    object-position: center top;
}

.pc-card-body {
    padding: 1.4rem 1.5rem 1.6rem;
    display: flex; flex-direction: column; gap: .6rem;
    flex: 1;
}
.pc-stat {
    font-size: clamp(52px, 6vw, 72px);
    font-weight: 900;
    line-height: 1;
    color: #fff;
    letter-spacing: -2px;
    margin-bottom: .1rem;
}
.pc-stat--dark { color: var(--navy); }
.pc-stat-unit {
    font-size: .5em;
    font-weight: 900;
    letter-spacing: 0;
    opacity: .7;
    vertical-align: baseline;
}
.pc-stat-sup {
    font-size: .3em;
    font-weight: 900;
    letter-spacing: 1px;
    background: var(--gold-text);
    color: #fff;
    border-radius: 5px;
    padding: 2px 6px;
    vertical-align: super;
    margin-left: 4px;
}
.pc-stat-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(255,255,255,.5);
    margin-bottom: 1.2rem;
}
.pc-stat-label--dark { color: var(--text-faint); }
.pc-icon {
    width: 40px; height: 40px; border-radius: 10px;
    background: rgba(255,255,255,.12);
    display: flex; align-items: center; justify-content: center;
    font-size: 17px; color: #fff; margin-bottom: .2rem;
}
.pc-icon--dark {
    background: #f0f3f7; color: var(--navy);
}
.pc-title {
    font-size: 20px; font-weight: 800; color: #fff; line-height: 1.25;
}
.pc-title--dark { color: var(--navy); }
.pc-desc {
    font-size: 13px; line-height: 1.6; color: rgba(255,255,255,.7);
}
.pc-desc--dark { color: var(--text-mid); }

@media (max-width: 991px) {
    .platform-cards-row { grid-template-columns: repeat(2, 1fr); }
    .pc-card--offset-1 { margin-top: 0; }
}
@media (max-width: 576px) {
    .platform-cards-row { grid-template-columns: 1fr; }
}

/* ── Ranking cards ──────────────────────────────────────── */
.rank-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 14px; }
.rank-card {
    background: var(--white); border: .5px solid var(--border);
    border-radius: var(--radius-lg); overflow: hidden;
    transition: box-shadow var(--transition);
}
.rank-card:hover { box-shadow: var(--shadow-md); }
.rank-card-head {
    padding: .85rem 1rem; display: flex; align-items: center; gap: 9px;
    border-bottom: .5px solid var(--border-light);
}
.rank-card-icon { width: 32px; height: 32px; border-radius: 7px; display: flex; align-items: center; justify-content: center; font-size: 14px; flex-shrink: 0; }
.rank-card-title { font-size: 13px; font-weight: 700; color: var(--navy); }
.rank-card-sub   { font-size: 10px; color: var(--text-muted); }
.rank-card-body  { padding: .3rem 0; }
.rank-row {
    display: flex; align-items: center; gap: 8px; padding: 6px 1rem;
    transition: background var(--transition);
}
.rank-row:hover { background: #f7fafd; }
.rank-num {
    width: 20px; height: 20px; border-radius: 4px;
    background: var(--navy); color: var(--gold);
    font-size: 10px; font-weight: 800;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.rank-info { flex: 1; min-width: 0; }
.rank-name { font-size: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--navy); }
.rank-meta { font-size: 10px; color: var(--text-muted); }
.rank-val  { text-align: right; flex-shrink: 0; }
.rank-score { font-size: 13px; font-weight: 800; color: var(--gold-text); }
.rank-unit  { font-size: 9px; color: var(--text-muted); }
.rank-bar-wrap { width: 60px; height: 3px; background: var(--border-light); border-radius: 2px; margin-top: 4px; margin-left: auto; }
.rank-bar { height: 3px; border-radius: 2px; background: var(--gold); }
.rank-bar.bar-red    { background: #e24b4a; }
.rank-bar.bar-blue   { background: var(--blue-mid); }
.rank-bar.bar-purple { background: var(--purple-mid); }
.rank-card-footer { padding: .6rem 1rem; border-top: .5px solid var(--border-light); text-align: center; }
.rank-card-footer a { font-size: 11px; color: var(--blue-mid); text-decoration: none; }
.rank-card-footer a:hover { color: var(--navy); }

/* ── Why AMS cards ──────────────────────────────────────── */
/* ── Why AMS — staggered process steps ─────────────────── */
.why-ams-section {
    background: #fff;
    padding: 4rem 0 5rem;
}
.why-ams-top {
    display: flex; justify-content: space-between; align-items: flex-start;
    margin-bottom: 3.5rem; gap: 2rem;
}
.why-ams-headline {
    font-size: clamp(32px, 4.5vw, 58px);
    font-weight: 900; line-height: 1.1;
    color: var(--navy); margin: 0;
    letter-spacing: -1.5px;
}
.why-ams-cta {
    display: inline-flex; align-items: center; gap: 10px;
    background: var(--navy); color: #fff;
    font-size: 14px; font-weight: 700;
    padding: 14px 24px; border-radius: 50px;
    text-decoration: none; white-space: nowrap;
    flex-shrink: 0; margin-top: 8px;
    transition: background .2s, transform .2s;
}
.why-ams-cta:hover { background: var(--gold-text); transform: translateY(-2px); }

.why-steps-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 28px;
    align-items: start;
}
.why-step { display: flex; flex-direction: column; gap: 1rem; }
.why-step--offset  { margin-top: 80px; }
.why-step--offset2 { margin-top: 160px; }
.why-step--offset3 { margin-top: 240px; }

/* Pill image */
.why-step-pill {
    width: 80px; height: 140px;
    border-radius: 50px;
    position: relative; overflow: hidden;
    display: flex; align-items: flex-start;
    justify-content: center; padding-top: 14px;
    flex-shrink: 0;
}
.wsp-1 { background: linear-gradient(160deg, #0d2240 0%, #1a4a80 50%, #0a2a50 100%); }
.wsp-2 { background: linear-gradient(160deg, #0a1a2e 0%, #1e3a6a 50%, #112255 100%); }
.wsp-3 { background: linear-gradient(160deg, #1a1000 0%, #4a2a00 50%, #8a5200 100%); }
.wsp-4 { background: linear-gradient(160deg, #0a1520 0%, #152a40 50%, #1e3a55 100%); }

.why-step-num {
    background: #fff; color: var(--navy);
    font-size: 12px; font-weight: 900;
    width: 36px; height: 36px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    letter-spacing: .5px;
    box-shadow: 0 2px 8px rgba(0,0,0,.2);
    position: relative; z-index: 1;
}

.why-step-content h4 {
    font-size: 20px; font-weight: 800;
    color: var(--navy); margin: 0 0 .5rem;
    line-height: 1.2;
}
.why-step-content p {
    font-size: 13px; color: var(--text-mid);
    line-height: 1.65; margin: 0;
}
.why-step-line {
    width: 100%; height: 1px;
    background: #dde3ea; margin-top: 1.2rem;
}

@media (max-width: 991px) {
    .why-steps-row { grid-template-columns: repeat(2, 1fr); }
    .why-step--offset  { margin-top: 0; }
    .why-step--offset2 { margin-top: 0; }
    .why-step--offset3 { margin-top: 0; }
    .why-ams-headline { font-size: 32px; }
}
@media (max-width: 576px) {
    .why-steps-row { grid-template-columns: 1fr; }
    .why-ams-top { flex-direction: column; }
}

/* ── Packages ───────────────────────────────────────────── */
/* ── Packages v2 — carousel ─────────────────────────────── */
.pkg2-section {
    background: #f4f5f7;
    padding: 4rem 0 5rem;
    overflow: hidden;
}
.pkg2-top {
    display: flex; justify-content: space-between; align-items: flex-end;
    margin-bottom: 2.5rem; gap: 2rem;
}
.pkg2-headline {
    font-size: clamp(28px, 4vw, 50px);
    font-weight: 900; line-height: 1.1;
    color: var(--navy); margin: 0; letter-spacing: -1.5px;
}
.pkg2-nav { display: flex; gap: 10px; flex-shrink: 0; }
.pkg2-arrow {
    width: 46px; height: 46px; border-radius: 50%;
    border: 1.5px solid #cdd3dc;
    background: #fff; color: var(--navy);
    font-size: 15px; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: background .2s, color .2s, border-color .2s;
}
.pkg2-arrow:hover { background: var(--navy); color: #fff; border-color: var(--navy); }

/* Viewport clips the track */
.pkg2-viewport { overflow: hidden; }
.pkg2-track {
    display: flex; gap: 20px;
    transition: transform .4s cubic-bezier(.4,0,.2,1);
}

/* Each card */
.pkg2-card {
    flex: 0 0 calc(33.333% - 14px);
    background: #eceef1;
    border-radius: 20px;
    padding: 2rem;
    display: flex; flex-direction: column;
    position: relative;
    transition: box-shadow .25s;
}
.pkg2-card:hover { box-shadow: 0 12px 40px rgba(0,0,0,.1); }
.pkg2-card--featured {
    background: #fdf0ec;
    border: 1.5px solid #f0b8a0;
}
.pkg2-badge {
    position: absolute; top: 1.4rem; right: 1.4rem;
    background: #e85d2f; color: #fff;
    font-size: 10px; font-weight: 800; letter-spacing: .8px;
    padding: 4px 12px; border-radius: 50px;
}
.pkg2-card-top { flex: 1; }
.pkg2-name {
    font-size: 18px; font-weight: 800; color: var(--navy);
    margin-bottom: .8rem;
}
.pkg2-price {
    font-size: clamp(40px, 5vw, 56px);
    font-weight: 900; color: var(--navy);
    line-height: 1; letter-spacing: -2px;
    margin-bottom: .3rem;
}
.pkg2-per {
    font-size: 14px; font-weight: 500;
    color: var(--text-mid); letter-spacing: 0;
    vertical-align: middle;
}
.pkg2-desc {
    font-size: 13px; color: var(--text-mid);
    line-height: 1.6; margin: .8rem 0 1.4rem;
}
.pkg2-cta {
    display: inline-flex; align-items: center; justify-content: space-between;
    width: 100%; padding: 14px 20px;
    background: var(--navy); color: #fff;
    font-size: 14px; font-weight: 700;
    border-radius: 50px; text-decoration: none;
    transition: background .2s, transform .2s;
    box-sizing: border-box;
}
.pkg2-cta:hover { background: var(--gold-text); transform: translateY(-2px); }
.pkg2-card--featured .pkg2-cta { background: #1a1a1a; }
.pkg2-divider {
    height: 1px; background: rgba(0,0,0,.1);
    margin: 1.6rem 0;
}
.pkg2-features {
    list-style: none; padding: 0; margin: 0;
    display: flex; flex-direction: column; gap: .65rem;
}
.pkg2-features li {
    display: flex; align-items: flex-start; gap: 10px;
    font-size: 13px; color: var(--navy);
}
.pkg2-feat-icon {
    width: 22px; height: 22px; border-radius: 50%;
    background: var(--navy); color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 10px; flex-shrink: 0; margin-top: 1px;
}
.pkg2-card--featured .pkg2-feat-icon { background: #1a1a1a; }

@media (max-width: 991px) {
    .pkg2-card { flex: 0 0 calc(50% - 10px); }
}
@media (max-width: 576px) {
    .pkg2-card { flex: 0 0 calc(100% - 0px); }
    .pkg2-headline { font-size: 26px; }
    .pkg2-top { flex-direction: column; align-items: flex-start; }
}

/* ── CTA Banner ─────────────────────────────────────────── */
/* ── CTA v2 — testimonial split ─────────────────────────── */
.cta2-wrap {
    display: grid; grid-template-columns: 1fr 1.6fr;
    min-height: 520px; overflow: hidden;
}

/* Left */
.cta2-left {
    background: #0d1520;
    background-image: linear-gradient(160deg, #0d1520 40%, #0a2035 100%);
    padding: 3rem 2.5rem;
    display: flex; flex-direction: column;
    position: relative; overflow: hidden;
}
.cta2-left::before {
    content: '';
    position: absolute; inset: 0;
    background: radial-gradient(ellipse at 80% 110%, rgba(180,130,40,.18) 0%, transparent 60%);
    pointer-events: none;
}
.cta2-eyebrow {
    display: flex; align-items: center; gap: 8px;
    font-size: 11px; font-weight: 800; letter-spacing: .1em;
    color: rgba(255,255,255,.5); text-transform: uppercase;
    margin-bottom: 1.4rem;
}
.cta2-headline {
    font-size: clamp(28px, 3.5vw, 46px);
    font-weight: 900; color: #fff; line-height: 1.1;
    letter-spacing: -1.5px; margin: 0;
    flex: 1;
}
.cta2-divider {
    width: 100%; height: 1px; background: rgba(255,255,255,.12);
    margin: 1.8rem 0;
}
.cta2-rating { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 2rem; }
.cta2-star-icon {
    width: 48px; height: 48px; border-radius: 50%;
    border: 1.5px solid rgba(255,255,255,.2);
    display: flex; align-items: center; justify-content: center;
    font-size: 20px; color: #f5c842; flex-shrink: 0;
}
.cta2-stars { color: #f5c842; font-size: 13px; display: flex; gap: 3px; margin-bottom: 4px; }
.cta2-rating-text { font-size: 12px; color: rgba(255,255,255,.55); line-height: 1.4; }
.cta2-btn {
    display: inline-flex; align-items: center; gap: 10px;
    background: #fff; color: var(--navy);
    font-size: 14px; font-weight: 800;
    padding: 14px 24px; border-radius: 50px;
    text-decoration: none; width: fit-content;
    transition: background .2s, color .2s, transform .2s;
}
.cta2-btn:hover { background: var(--gold-text); color: #fff; transform: translateY(-2px); }

/* Right */
.cta2-right {
    background: #111820;
    background-image: linear-gradient(160deg, #0e1f30 0%, #0a1520 60%, #12202e 100%);
    padding: 3rem 3rem 2.5rem;
    display: flex; flex-direction: column;
    position: relative; overflow: hidden;
}
.cta2-right::before {
    content: '';
    position: absolute; inset: 0;
    background: radial-gradient(ellipse at 60% 80%, rgba(30,80,130,.3) 0%, transparent 65%);
    pointer-events: none;
}
.cta2-quote-mark {
    font-size: 120px; line-height: .7;
    color: rgba(255,255,255,.15);
    font-family: Georgia, serif;
    margin-bottom: 1rem;
    user-select: none;
}
.cta2-quotes { flex: 1; position: relative; }
.cta2-quote {
    display: none; flex-direction: column; gap: .8rem;
    position: absolute; inset: 0;
}
.cta2-quote.active { display: flex; }
.cta2-quote-text {
    font-size: clamp(15px, 1.8vw, 20px);
    color: rgba(255,255,255,.9); line-height: 1.65;
    font-weight: 400; margin: 0;
}
.cta2-author {
    font-size: 17px; font-weight: 800; color: #fff;
    margin-top: .6rem;
}
.cta2-role { font-size: 13px; color: rgba(255,255,255,.45); }
.cta2-dots {
    display: flex; gap: 8px; margin-top: 2rem; position: relative; z-index: 1;
}
.cta2-dot {
    width: 8px; height: 8px; border-radius: 50%;
    border: none; background: rgba(255,255,255,.25); cursor: pointer;
    transition: background .2s, width .2s;
    padding: 0;
}
.cta2-dot.active { background: #fff; width: 24px; border-radius: 4px; }

@media (max-width: 991px) {
    .cta2-wrap { grid-template-columns: 1fr; }
    .cta2-left { padding: 2.5rem 1.5rem; }
    .cta2-right { padding: 2.5rem 1.5rem; min-height: 380px; }
    .cta2-quotes { position: relative; min-height: 200px; }
}
@media (max-width: 576px) {
    .cta2-headline { font-size: 28px; }
}
.btn-cta-primary {
    background: var(--gold); color: var(--navy-dark); border: none;
    padding: 11px 24px; border-radius: 8px;
    font-size: 13px; font-weight: 800; cursor: pointer;
    font-family: 'Cairo', sans-serif;
    display: flex; align-items: center; gap: 7px;
    text-decoration: none; transition: opacity var(--transition);
}
.btn-cta-primary:hover { opacity: .9; color: var(--navy-dark); }
.btn-cta-secondary {
    background: transparent; color: var(--gold);
    border: 1px solid var(--gold-border); padding: 11px 24px; border-radius: 8px;
    font-size: 13px; font-weight: 600; cursor: pointer;
    font-family: 'Cairo', sans-serif;
    display: flex; align-items: center; gap: 7px;
    text-decoration: none; transition: background var(--transition);
}
.btn-cta-secondary:hover { background: var(--gold-light); color: var(--gold); }

/* ── Footer ─────────────────────────────────────────────── */
.ams-footer { background: var(--navy-dark); margin: 16px; border-radius: 20px; }
.footer-top { padding: 2.8rem 0 2rem; border-bottom: .5px solid #1e3550; }
.footer-brand { margin-bottom: .5rem; }
.footer-logo-link { display: flex; align-items: center; gap: 10px; text-decoration: none; margin-bottom: 1rem; }
.footer-logo-box {
    width: 44px; height: 44px; background: var(--gold);
    border-radius: var(--radius-md);
    display: flex; align-items: center; justify-content: center;
    font-weight: 800; font-size: 15px; color: var(--navy-dark); flex-shrink: 0;
}
.footer-logo-text { display: flex; flex-direction: column; }
.fl-en { color: #fff; font-weight: 700; font-size: 14px; line-height: 1.1; }
.fl-ar { color: var(--gold); font-size: 10px; }
.footer-desc { color: #4a6a88; font-size: 11px; line-height: 1.7; margin-bottom: 1rem; }
.footer-social { display: flex; gap: 8px; }
.footer-social a {
    width: 32px; height: 32px; border-radius: var(--radius-md);
    border: .5px solid #1e3550; color: #6a8aaa;
    display: flex; align-items: center; justify-content: center;
    font-size: 13px; text-decoration: none;
    transition: border-color var(--transition), color var(--transition);
}
.footer-social a:hover { border-color: var(--gold); color: var(--gold); }
.footer-col-title { color: var(--gold); font-size: 11px; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase; margin-bottom: .9rem; }
.footer-col ul { list-style: none; padding: 0; margin: 0; }
.footer-col ul li { margin-bottom: 4px; }
.footer-col ul li a {
    color: #4a6a88; font-size: 11px; text-decoration: none;
    display: flex; align-items: center; gap: 5px;
    transition: color var(--transition);
}
.footer-col ul li a:hover { color: #8fafc7; }
.footer-col ul li a i { font-size: 9px; color: #2a4a6a; }
.footer-newsletter-desc { color: #4a6a88; font-size: 10px; line-height: 1.6; margin-bottom: 8px; }
.footer-newsletter { display: flex; flex-direction: column; gap: 6px; }
.footer-newsletter input {
    background: #132336; border: .5px solid #1e3550;
    border-radius: var(--radius-md); padding: 8px 10px;
    color: #fff; font-size: 12px; font-family: 'Cairo', sans-serif;
    outline: none; transition: border-color var(--transition);
}
.footer-newsletter input:focus { border-color: var(--gold); }
.footer-newsletter input::placeholder { color: #3a5a7a; }
.footer-newsletter button {
    background: var(--gold); border: none; color: var(--navy-dark);
    padding: 8px; border-radius: var(--radius-md);
    font-size: 12px; font-weight: 800; cursor: pointer;
    font-family: 'Cairo', sans-serif;
    display: flex; align-items: center; justify-content: center; gap: 5px;
}
.footer-contact { margin-top: .5rem; }
.footer-contact-item { display: flex; align-items: center; gap: 7px; color: #4a6a88; font-size: 11px; margin-bottom: 4px; }
.footer-contact-item i { color: var(--gold); font-size: 12px; }
.footer-contact-item a { color: #4a6a88; text-decoration: none; }
.footer-contact-item a:hover { color: #8fafc7; }
.footer-mid { border-bottom: .5px solid #1e3550; padding: 1.2rem 0; }
.footer-mid-inner { display: flex; gap: 2rem; flex-wrap: wrap; }
.footer-badges-group { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.fbg-label { font-size: 10px; font-weight: 700; color: #3a5a7a; letter-spacing: 1px; white-space: nowrap; }
.footer-badge {
    background: #132336; border: .5px solid #1e3550;
    border-radius: 4px; padding: 4px 9px;
    font-size: 10px; color: #4a6a88;
    display: flex; align-items: center; gap: 4px; white-space: nowrap;
}
.footer-badge i { color: var(--gold); font-size: 11px; }
.footer-bottom { padding: 1rem 0; }
.footer-bottom-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; }
.footer-copy { color: #2a4a6a; font-size: 10px; margin: 0; }
.footer-bottom-links { display: flex; gap: 1rem; }
.footer-bottom-links a { color: #2a4a6a; font-size: 10px; text-decoration: none; transition: color var(--transition); }
.footer-bottom-links a:hover { color: #4a6a88; }

/* ── Utilities ──────────────────────────────────────────── */
.bg-white { background: var(--white); }
.bg-light  { background: var(--body-bg); }

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 991px) {
    /* Hide topbar on mobile */
    .ams-topbar { display: none; }

    .hero-body { flex-direction: column; padding: 2rem 1.5rem; gap: 2rem; }
    .hero-news-card { width: 100%; max-width: 380px; align-self: flex-start; }
    .hero-left { max-width: 100%; }
    .rank-grid { grid-template-columns: 1fr; }
    .footer-mid-inner { gap: 1rem; }

    /* Fullscreen menu — mobile layout */
    .fs-menu { flex-direction: column; }
    .fs-mobile-header {
        display: flex; align-items: center; justify-content: space-between;
        padding: .8rem 1.2rem;
        border-bottom: 1px solid #e8edf2;
        flex-shrink: 0;
    }
    .fs-logo { position: static; padding: 0; }
    .fs-logo img { height: 52px; }
    .fs-logo-desktop { display: none; }
    .fs-close-desktop { display: none; }
    .fs-close {
        position: static;
        background: var(--body-bg); border: 1px solid #dde3ea;
        color: var(--text-mid); width: 40px; height: 40px; font-size: 18px;
    }
    .fs-inner {
        grid-template-columns: 1fr;
        flex: 1; overflow: hidden;
        padding-top: 0; position: relative;
    }
    .fs-left {
        border-right: none; border-bottom: none;
        padding: 1.2rem 1.4rem 1.4rem;
        justify-content: flex-start;
        background: #fff;
        overflow-y: auto;
    }
    .fs-label { font-size: 22px; }
    /* Sub panel slides in on mobile */
    .fs-right {
        position: absolute; inset: 0;
        background: #fff; padding: 0;
        display: flex; flex-direction: column;
        transform: translateX(100%);
        transition: transform .28s ease;
        overflow-y: auto;
    }
    .fs-right.fs-right--active { transform: translateX(0); }
    .fs-back-btn {
        display: flex; align-items: center; gap: 8px;
        padding: 1rem 1.4rem;
        font-size: 13px; font-weight: 700; color: var(--navy);
        border-bottom: 1px solid #e8edf2;
        cursor: pointer; background: #fafbfc;
        border: none; width: 100%; text-align: left;
    }
    .fs-back-btn i { color: var(--gold-text); }
    .fs-right-content { padding: 1.4rem; }
}
@media (max-width: 576px) {
    .nav-submit-btn span { display: none; }
    .nav-submit-btn { padding: 7px 10px; }
    .nav-logo-img { height: 44px; }
    .nav-right { gap: 6px; }
    .h1-solid, .h1-ghost { font-size: 26px; }
    .pkg-grid { grid-template-columns: 1fr; }
    .footer-bottom-inner { flex-direction: column; text-align: center; }
    .fs-bottom { flex-direction: column; align-items: flex-start; gap: 1rem; }
    .fs-sub-cols { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════
   JOURNALS PAGE
═══════════════════════════════════════════════════════════ */

/* ── Page hero (shared across inner pages) ──────────────── */
/* ── Page Hero (inner pages) ────────────────────────────── */
.page-hero {
    background: #0e1318 url('/ams/assets/img/59699.jpg') center center / cover no-repeat;
    padding: 2.8rem 0 0;
    position: relative; overflow: hidden;
    margin: 16px 16px 0;
    border-radius: 20px 20px 0 0;
}
.page-hero::before {
    content: '';
    position: absolute; inset: 0;
    background: radial-gradient(ellipse at 75% 110%, rgba(201,168,76,.32) 0%, rgba(180,130,40,.12) 40%, transparent 65%),
                radial-gradient(ellipse at -5% -10%, rgba(201,168,76,.18) 0%, transparent 45%),
                radial-gradient(ellipse at 40% 50%,  rgba(133,90,31,.10)  0%, transparent 60%);
    pointer-events: none;
}
.page-hero-inner {
    display: flex; align-items: flex-end;
    justify-content: space-between; gap: 2rem;
    padding-bottom: 0; flex-wrap: wrap;
    position: relative; z-index: 1;
}
.page-breadcrumb {
    display: flex; align-items: center; gap: 6px;
    font-size: 11px; color: rgba(255,255,255,.35); margin-bottom: .6rem;
}
.page-breadcrumb a { color: var(--gold); text-decoration: none; }
.page-breadcrumb a:hover { color: #fff; }
.page-breadcrumb i { font-size: 8px; }
.page-hero-title {
    color: #fff;
    font-size: clamp(28px, 4vw, 48px);
    font-weight: 900; margin-bottom: .4rem;
    letter-spacing: -1.5px; line-height: 1.1;
}
.page-hero-sub { color: rgba(255,255,255,.45); font-size: 13px; max-width: 560px; line-height: 1.6; }

/* Stats bar inside hero */
.page-hero-stats {
    display: flex; gap: 0;
    align-self: stretch; align-items: flex-end;
}
.phs-item {
    text-align: center;
    padding: 1rem 2rem 1.4rem;
    border-left: 1px solid rgba(255,255,255,.08);
}
.phs-num   { display: block; color: #fff; font-size: clamp(28px,3vw,40px); font-weight: 900; letter-spacing: -1.5px; line-height: 1; }
.phs-gold  { color: var(--gold); }
.phs-label { color: rgba(255,255,255,.35); font-size: 11px; white-space: nowrap; margin-top: 4px; display: block; }

/* ══════════════════════════════════════════════════════════
   UNIVERSAL INNER-PAGE COMPONENTS
   Used across journals, journal detail, search, authors, etc.
══════════════════════════════════════════════════════════ */

/* White content wrapper that connects below .page-hero */
.page-content-wrap {
    margin: 0 16px;
    background: #fff;
    border-radius: 0 0 20px 20px;
    border: 1px solid #e8edf2;
    border-top: none;
    margin-bottom: 16px;
}

/* Universal sticky tabs bar */
.page-tabs-bar {
    background: #fff;
    border-bottom: 1px solid #e8edf2;
    position: sticky; top: 0; z-index: 100;
    transition: box-shadow .2s;
}
.page-tabs-bar.is-stuck { box-shadow: 0 4px 16px rgba(0,0,0,.08); }
.page-tabs {
    display: flex; gap: 0;
    overflow-x: auto; scrollbar-width: none;
}
.page-tabs::-webkit-scrollbar { display: none; }
.page-tab {
    background: transparent; border: none;
    border-bottom: 3px solid transparent;
    color: var(--text-muted); font-size: 13px; font-weight: 700;
    padding: 1rem 1.4rem; cursor: pointer; white-space: nowrap;
    font-family: 'Cairo', sans-serif;
    transition: color .2s, border-color .2s;
}
.page-tab:hover  { color: var(--navy); }
.page-tab.active { color: var(--navy); border-bottom-color: var(--gold-text); }

/* Universal content card */
.ui-card {
    background: #fff; border: 1px solid #e8edf2;
    border-radius: 16px; padding: 1.4rem;
    margin-bottom: 1.2rem;
}
.ui-card-title {
    font-size: 11px; font-weight: 800; color: var(--text-faint);
    text-transform: uppercase; letter-spacing: 1px;
    display: flex; align-items: center; gap: 8px;
    margin-bottom: 1.2rem; padding-bottom: .8rem;
    border-bottom: 1px solid #e8edf2;
}
.ui-card-title i { color: var(--gold-text); font-size: 14px; }

/* Universal KPI / stat tile */
.ui-kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 12px;
}
.ui-kpi {
    background: #fafbfc; border: 1px solid #e8edf2;
    border-radius: 14px; padding: 1.2rem 1rem;
    display: flex; flex-direction: column; align-items: center;
    text-align: center; gap: 4px;
    transition: box-shadow .2s, transform .2s;
}
.ui-kpi:hover { box-shadow: 0 4px 16px rgba(0,0,0,.07); transform: translateY(-2px); }
.ui-kpi-icon {
    width: 38px; height: 38px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px; margin-bottom: 5px;
}
.ui-kpi-val   { font-size: 24px; font-weight: 900; color: var(--navy); letter-spacing: -1px; }
.ui-kpi-label { font-size: 11px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .5px; }

/* Universal pagination */
.ui-pagination {
    display: flex; align-items: center; justify-content: center;
    gap: 6px; margin-top: 2rem; flex-wrap: wrap;
}
.ui-pgn-btn {
    min-width: 38px; height: 38px; border-radius: 50px;
    border: 1px solid #e8edf2; background: #fff;
    color: var(--text-mid); font-size: 13px; font-weight: 700;
    display: flex; align-items: center; justify-content: center;
    text-decoration: none; transition: all .2s; cursor: pointer;
    font-family: 'Cairo', sans-serif;
}
.ui-pgn-btn:hover    { border-color: var(--navy); color: var(--navy); background: #f0f4f8; }
.ui-pgn-btn.active   { background: var(--navy); border-color: var(--navy); color: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.15); }
.ui-pgn-btn.disabled { opacity: .3; pointer-events: none; }
.ui-pgn-ellipsis     { color: var(--text-muted); font-size: 13px; padding: 0 4px; }

/* Universal pill button */
.ui-pill-btn {
    display: inline-flex; align-items: center; gap: 8px;
    background: var(--navy); color: #fff;
    font-size: 14px; font-weight: 700;
    padding: 12px 22px; border-radius: 50px;
    text-decoration: none; border: none; cursor: pointer;
    font-family: 'Cairo', sans-serif;
    transition: background .2s, transform .2s;
}
.ui-pill-btn:hover { background: var(--gold-text); color: #fff; transform: translateY(-2px); }
.ui-pill-btn--ghost {
    background: #f0f4f8; color: var(--navy);
}
.ui-pill-btn--ghost:hover { background: var(--navy); color: #fff; }

/* Responsive for all inner pages */
@media (max-width: 991px) {
    .page-content-wrap { margin: 0 8px; border-radius: 0 0 16px 16px; }
    .page-hero { margin: 8px 8px 0 !important; border-radius: 16px 16px 0 0 !important; }
    .page-tabs-bar { margin: 0; }
}

/* ── Two-column layout ──────────────────────────────────── */
.journals-layout {
    display: grid;
    grid-template-columns: 250px 1fr;
    gap: 0;
    align-items: start;
    margin: 0 16px;
    background: #fff;
    border-radius: 0 0 20px 20px;
    border: 1px solid #e8edf2;
    border-top: none;
}

/* ── Sidebar ────────────────────────────────────────────── */
.journals-sidebar {
    padding: 1.6rem 1.2rem 2rem;
    border-right: 1px solid #e8edf2;
    min-height: calc(100vh - 180px);
    position: sticky;
    top: 72px;
    overflow-y: auto;
    max-height: calc(100vh - 72px);
    background: #fafbfc;
    border-radius: 0 0 0 20px;
}
.filter-search-wrap {
    display: flex; align-items: center; gap: 8px;
    background: #fff; border: 1px solid #e8edf2;
    border-radius: 50px; padding: 8px 14px;
    margin-bottom: 1.4rem;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
}
.filter-search-wrap i { color: var(--text-muted); font-size: 13px; flex-shrink: 0; }
.filter-search-input {
    border: none; background: transparent; outline: none;
    font-family: 'Cairo', sans-serif; font-size: 13px; color: var(--text-dark);
    width: 100%;
}
.filter-search-input::placeholder { color: var(--text-faint); }

.filter-group { margin-bottom: 1.4rem; }
.filter-group-title {
    font-size: 10px; font-weight: 800; letter-spacing: 1.2px;
    text-transform: uppercase; color: var(--text-faint);
    margin-bottom: .7rem; display: flex; align-items: center; gap: 5px;
}
.filter-group-title i { font-size: 11px; color: var(--gold-text); }

.filter-option {
    display: flex; align-items: center; gap: 8px;
    font-size: 12px; color: var(--text-mid);
    padding: 5px 8px; border-radius: 8px;
    cursor: pointer; transition: background var(--transition), color var(--transition);
}
.filter-option:hover { background: #fff; color: var(--navy); }
.filter-option.selected { color: var(--navy); font-weight: 700; background: #fff; }
.filter-option input[type="radio"] { display: none; }
.fo-dot {
    width: 13px; height: 13px;
    border-radius: 50%; border: 1.5px solid #d0d7e2;
    flex-shrink: 0; transition: border-color var(--transition), background var(--transition);
}
.filter-option.selected .fo-dot { border-color: var(--gold-text); background: var(--gold-text); }

.filter-clear-btn {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 12px; font-weight: 700; color: #e85d2f; text-decoration: none;
    padding: 7px 14px; border-radius: 50px;
    background: #fdf0ec; border: 1px solid #f0b8a0;
    margin-top: .6rem; transition: background var(--transition);
}
.filter-clear-btn:hover { background: #fbe0d8; }
.filter-clear-btn i { font-size: 10px; }

/* ── Main area ──────────────────────────────────────────── */
.journals-main { padding: 1.4rem 1.6rem 2.5rem; }

/* Toolbar */
.journals-toolbar {
    display: flex; align-items: center; justify-content: space-between;
    flex-wrap: wrap; gap: .7rem; margin-bottom: 1.2rem;
    padding-bottom: 1rem; border-bottom: 1px solid #e8edf2;
}
.toolbar-left { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.toolbar-count { font-size: 13px; font-weight: 800; color: var(--navy); }
.active-filter-chip {
    display: inline-flex; align-items: center; gap: 5px;
    background: #f0f4ff; color: #2a4a9a;
    font-size: 11px; font-weight: 700; padding: 4px 10px;
    border-radius: 50px; border: 1px solid #ccd8f8;
}
.active-filter-chip a { color: #2a4a9a; text-decoration: none; font-size: 13px; margin-left: 2px; }
.toolbar-right { display: flex; align-items: center; gap: 8px; }
.toolbar-sort-label { font-size: 11px; color: var(--text-muted); }
.toolbar-sort {
    font-family: 'Cairo', sans-serif; font-size: 12px;
    border: 1px solid #e8edf2; border-radius: 50px;
    padding: 6px 12px; color: var(--text-dark); outline: none;
    background: #fff; cursor: pointer;
}
.view-toggle { display: flex; gap: 3px; background: #f4f5f7; border-radius: 50px; padding: 3px; }
.view-btn {
    width: 30px; height: 30px; border-radius: 50px;
    border: none; background: transparent;
    color: var(--text-muted); font-size: 13px; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: all var(--transition);
}
.view-btn.active { background: #fff; color: var(--navy); box-shadow: 0 1px 4px rgba(0,0,0,.1); }

/* ── Journal grid ───────────────────────────────────────── */
.journals-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 16px;
}

.journal-card {
    background: #fafbfc; border: 1px solid #e8edf2;
    border-radius: 16px; padding: 1.2rem;
    text-decoration: none; display: flex; flex-direction: column;
    transition: box-shadow .22s, border-color .22s, transform .22s;
    color: inherit;
}
.journal-card:hover {
    box-shadow: 0 8px 28px rgba(0,0,0,.09);
    border-color: var(--gold-border);
    transform: translateY(-3px);
    background: #fff;
    color: inherit;
}

.jc-top { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: .8rem; }
.jc-logo {
    width: 46px; height: 46px; border-radius: 12px;
    background: var(--navy); color: var(--gold);
    display: flex; align-items: center; justify-content: center;
    font-size: 9px; font-weight: 800; letter-spacing: .5px; flex-shrink: 0;
}
.jc-badges { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.jc-quartile { font-size: 10px; font-weight: 800; padding: 3px 9px; border-radius: 50px; }
.jc-oa {
    font-size: 9px; font-weight: 700; color: var(--teal-mid);
    background: var(--teal-light); padding: 2px 8px; border-radius: 50px;
    display: flex; align-items: center; gap: 3px;
}
.jc-oa i { font-size: 8px; }

.jc-name {
    font-size: 13px; font-weight: 800; color: var(--navy);
    line-height: 1.35; margin-bottom: 4px;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.jc-issn { font-size: 11px; color: var(--text-muted); margin-bottom: .9rem; }

/* AMS score — large and bold */
.jc-ams-score {
    font-size: 38px; font-weight: 900; color: var(--navy);
    letter-spacing: -2px; line-height: 1;
    margin-bottom: .1rem;
}
.jc-ams-score span { font-size: 14px; color: var(--gold-text); font-weight: 700; letter-spacing: 0; vertical-align: middle; margin-left: 4px; }

.jc-metrics {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 6px; margin-bottom: .8rem;
    border-top: 1px solid #e8edf2; padding-top: .8rem;
}
.jc-metric { text-align: center; }
.jcm-val   { display: block; font-size: 14px; font-weight: 800; color: var(--navy); }
.jcm-label { font-size: 9px; color: var(--text-muted); letter-spacing: .3px; text-transform: uppercase; }

.jc-bar-wrap { height: 4px; background: #e8edf2; border-radius: 4px; margin-bottom: .9rem; }
.jc-bar      { height: 4px; background: linear-gradient(90deg, var(--gold-text), #f5c842); border-radius: 4px; }

.jc-footer { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: .6rem; }
.jc-country { font-size: 11px; color: var(--text-muted); }
.jc-view {
    font-size: 11px; font-weight: 700; color: var(--navy);
    display: flex; align-items: center; gap: 5px;
    background: #f0f4f8; padding: 5px 10px; border-radius: 50px;
    transition: background .2s, color .2s;
}
.journal-card:hover .jc-view { background: var(--navy); color: #fff; }
.jc-view i  { font-size: 9px; }

/* ── List view ──────────────────────────────────────────── */
.journals-grid.list-view { grid-template-columns: 1fr; gap: 8px; }
.journals-grid.list-view .journal-card {
    flex-direction: row; align-items: center; gap: 1rem; padding: .85rem 1.2rem;
    border-radius: 12px;
}
.journals-grid.list-view .jc-top    { flex-direction: column; align-items: flex-start; margin-bottom: 0; flex-shrink: 0; }
.journals-grid.list-view .jc-badges { flex-direction: row; align-items: center; margin-top: 4px; }
.journals-grid.list-view .jc-name   { -webkit-line-clamp: 1; flex: 1; margin-bottom: 0; }
.journals-grid.list-view .jc-issn   { display: none; }
.journals-grid.list-view .jc-ams-score { display: none; }
.journals-grid.list-view .jc-bar-wrap  { display: none; }
.journals-grid.list-view .jc-footer    { flex-direction: column; align-items: flex-end; flex-shrink: 0; gap: 4px; min-width: 90px; }
.journals-grid.list-view .jc-metrics   { grid-template-columns: repeat(3, 64px); flex-shrink: 0; margin-bottom: 0; border-top: none; padding-top: 0; }
.journals-grid.list-view .jcm-val  { font-size: 13px; }

/* ── No results ─────────────────────────────────────────── */
.no-results {
    grid-column: 1 / -1; text-align: center; padding: 4rem;
    color: var(--text-muted);
}
.no-results i { font-size: 36px; margin-bottom: 1rem; display: block; color: #dde3ea; }
.no-results a { color: var(--gold-text); font-weight: 700; }

/* ── Pagination ─────────────────────────────────────────── */
.journals-pagination {
    display: flex; align-items: center; justify-content: center;
    gap: 6px; margin-top: 2rem; flex-wrap: wrap;
}
.pgn-btn {
    min-width: 38px; height: 38px; border-radius: 50px;
    border: 1px solid #e8edf2; background: #fff;
    color: var(--text-mid); font-size: 13px; font-weight: 700;
    display: flex; align-items: center; justify-content: center;
    text-decoration: none; transition: all .2s;
}
.pgn-btn:hover { border-color: var(--navy); color: var(--navy); background: #f0f4f8; }
.pgn-btn.pgn-active { background: var(--navy); border-color: var(--navy); color: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.15); }
.pgn-btn.pgn-disabled { opacity: .3; pointer-events: none; }
.pgn-ellipsis { color: var(--text-muted); font-size: 13px; padding: 0 4px; }

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 991px) {
    .page-hero { margin: 8px 8px 0; border-radius: 16px 16px 0 0; }
    .journals-layout { grid-template-columns: 1fr; margin: 0 8px; border-radius: 0 0 16px 16px; }
    .journals-sidebar {
        position: static; border-right: none;
        border-bottom: 1px solid #e8edf2;
        max-height: none; min-height: auto;
        padding: 1rem 1rem .8rem; overflow: visible;
        border-radius: 0;
    }
    .filter-group { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
    .filter-group-title { width: 100%; }
    .filter-option { border: 1px solid #e8edf2; border-radius: 50px; }
    .filter-option.selected { background: #f5f0e6; border-color: var(--gold-border); }
    .page-hero-inner { flex-direction: column; align-items: flex-start; }
    .page-hero-stats { gap: 1.2rem; }
}
@media (max-width: 576px) {
    .journals-grid { grid-template-columns: 1fr; }
    .journals-grid.list-view .jc-metrics { display: none; }
    .phs-num { font-size: 18px; }
}

/* ═══════════════════════════════════════════════════════════
   JOURNAL PROFILE PAGE
═══════════════════════════════════════════════════════════ */

/* ── Hero ───────────────────────────────────────────────── */
/* jp-hero reuses page-hero — just override padding */
.jp-hero { padding: 0; }
.jp-hero > * { position: relative; z-index: 1; }
.jp-breadcrumb { padding: 1.2rem 0 0; }

.jp-hero-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 2.5rem;
    align-items: center;
    padding: 2rem 0 2.5rem;
}

/* Identity block */
.jp-identity { display: flex; align-items: flex-start; gap: 1.6rem; }
.jp-big-logo {
    width: 80px; height: 80px; border-radius: 18px;
    background: linear-gradient(135deg, var(--gold-text), #f5c842);
    color: var(--navy-dark);
    display: flex; align-items: center; justify-content: center;
    font-size: 14px; font-weight: 900; flex-shrink: 0;
    box-shadow: 0 8px 28px rgba(201,168,76,.3);
    letter-spacing: .5px;
}
.jp-identity-text { min-width: 0; }

.jp-oa-pill {
    display: inline-flex; align-items: center; gap: 6px;
    background: rgba(15,110,86,.18); border: 1px solid rgba(15,110,86,.35);
    color: #4dcba0; font-size: 11px; font-weight: 700;
    padding: 4px 12px; border-radius: 50px;
    margin-bottom: .7rem; letter-spacing: .3px;
}
.jp-oa-sep { color: rgba(77,203,160,.4); }

.jp-title {
    color: #fff; font-size: clamp(20px, 3vw, 32px); font-weight: 900;
    line-height: 1.2; margin-bottom: .3rem; letter-spacing: -.5px;
}
.jp-title-ar {
    color: var(--gold); font-size: 15px; direction: rtl;
    margin-bottom: .9rem; opacity: .85;
}

.jp-meta-row { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: .9rem; }
.jp-meta-pill {
    display: inline-flex; align-items: center; gap: 6px;
    background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
    color: rgba(255,255,255,.6); font-size: 11px; padding: 5px 12px; border-radius: 50px;
}
.jp-meta-pill i { color: rgba(255,255,255,.3); font-size: 10px; }

.jp-indexed-row { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.jp-indexed-label {
    font-size: 10px; font-weight: 800; color: rgba(255,255,255,.3);
    letter-spacing: 1.5px; text-transform: uppercase;
}
.jp-idx-badge {
    background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14);
    color: rgba(255,255,255,.6); font-size: 10px; font-weight: 700; padding: 3px 10px;
    border-radius: 50px; letter-spacing: .3px;
}

/* Metrics strip */
.jp-metrics-strip {
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 20px;
    padding: 1.6rem 1.8rem;
    min-width: 300px;
    display: flex; flex-direction: column; gap: 1.2rem;
    align-self: flex-start;
}
.jp-ms-score { text-align: center; }
.jp-ms-num   {
    color: #fff; font-size: 64px; font-weight: 900; line-height: 1;
    letter-spacing: -3px;
}
.jp-ms-label { color: rgba(255,255,255,.35); font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; margin-bottom: 10px; }
.jp-ms-bar-bg { height: 5px; background: rgba(255,255,255,.1); border-radius: 3px; }
.jp-ms-bar    { height: 5px; background: linear-gradient(90deg, var(--gold-text), #f5c842); border-radius: 3px; }
.jp-ms-divider { height: 1px; background: rgba(255,255,255,.08); }
.jp-ms-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 8px; }
.jp-ms-cell { text-align: center; }
.jp-ms-val  { display: block; font-size: 16px; font-weight: 800; color: #fff; margin-bottom: 3px; }
.jp-q-val   { font-size: 12px; padding: 3px 10px; border-radius: 50px; }
.jp-ms-key  { display: block; font-size: 10px; color: rgba(255,255,255,.3); letter-spacing: .3px; text-transform: uppercase; }

/* ── Tabs: journal detail uses universal .page-tabs-bar/.page-tab */

/* ── Content layout ─────────────────────────────────────── */
.jp-content { padding: 1.6rem 16px 2.5rem; }
.jp-layout  { display: grid; grid-template-columns: 1fr 280px; gap: 1.6rem; align-items: start; min-width: 0; }
.jp-layout > * { min-width: 0; }

/* Sections toggle */
.jp-section        { display: none; }
.jp-section.active { display: block; }

/* ── Content cards: journal detail uses universal .ui-card/.ui-card-title */
.jp-aims { font-size: 13px; color: var(--text-mid); line-height: 1.8; margin-bottom: 1.2rem; }

/* Details grid */
.jp-details-grid { display: flex; flex-direction: column; gap: 0; }
.jp-detail-row {
    display: flex; align-items: baseline; gap: 1rem;
    padding: 8px 0; border-bottom: 1px solid #f0f4f8; font-size: 13px;
}
.jp-detail-row:last-child { border-bottom: none; }
.jdr-label { color: var(--text-muted); min-width: 150px; flex-shrink: 0; font-size: 12px; }
.jdr-val   { color: var(--navy); font-weight: 700; }
.jdr-val a { color: var(--gold-text); text-decoration: none; }

/* Subjects */
.jp-subjects { display: flex; flex-wrap: wrap; gap: 8px; }
.jp-subject-tag {
    background: #f4f5f7; border: 1px solid #e8edf2;
    color: var(--text-mid); font-size: 12px; padding: 5px 14px;
    border-radius: 50px; transition: all .2s; cursor: default;
}
.jp-subject-tag:hover { border-color: var(--gold-text); color: var(--navy); background: #faf6ec; }

/* Country list */
.jp-country-list { display: flex; flex-direction: column; gap: 10px; }
.jp-country-row  { display: flex; align-items: center; gap: 10px; }
.jp-c-flag  { font-size: 18px; flex-shrink: 0; }
.jp-c-name  { font-size: 13px; color: var(--navy); font-weight: 600; min-width: 120px; }
.jp-c-bar-wrap { flex: 1; height: 5px; background: #e8edf2; border-radius: 3px; }
.jp-c-bar  { height: 5px; background: linear-gradient(90deg, var(--gold-text), #f5c842); border-radius: 3px; }
.jp-c-pct  { font-size: 12px; font-weight: 700; color: var(--navy); min-width: 36px; text-align: right; }

/* ── Charts ─────────────────────────────────────────────── */
.jp-metrics-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; margin-bottom: 1.2rem; }
.jp-chart-card  { margin-bottom: 0; }
.jp-chart-wrap  { height: 200px; position: relative; }
.jp-doughnut-wrap { height: 240px; }

/* KPI grid: uses universal .ui-kpi-grid / .ui-kpi — see universal section above */

/* ── Papers ─────────────────────────────────────────────── */
.jp-paper-row {
    display: flex; align-items: flex-start; gap: 14px;
    padding: 12px 0; border-bottom: 1px solid #f0f4f8;
}
.jp-paper-row:last-of-type { border-bottom: none; }
.jp-paper-num {
    width: 28px; height: 28px; border-radius: 8px;
    background: var(--navy); color: var(--gold);
    font-size: 11px; font-weight: 900;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
    margin-top: 2px;
}
.jp-paper-body { flex: 1; min-width: 0; }
.jp-paper-title {
    font-size: 13px; font-weight: 700; color: var(--navy);
    line-height: 1.45; margin-bottom: 5px; display: block;
}
a.jp-paper-title:hover { color: var(--gold-text); }
.jp-paper-meta { display: flex; flex-wrap: wrap; gap: 5px 14px; font-size: 11px; color: var(--text-muted); }
.jp-paper-meta i { color: var(--text-faint); }
.jp-paper-meta a { color: var(--gold-text); text-decoration: none; }
.jp-paper-cites { text-align: right; flex-shrink: 0; min-width: 60px; }
.jp-cites-num   { display: block; font-size: 20px; font-weight: 900; color: var(--navy); letter-spacing: -1px; }
.jp-cites-label { font-size: 10px; color: var(--text-muted); text-transform: uppercase; }
.jp-all-link {
    display: inline-flex; align-items: center; gap: 7px;
    font-size: 13px; font-weight: 700; color: var(--navy);
    background: #f0f4f8; padding: 9px 18px; border-radius: 50px;
    text-decoration: none; margin-top: 1rem;
    transition: background .2s, color .2s;
}
.jp-all-link:hover { background: var(--navy); color: #fff; }

/* ── Editorial ──────────────────────────────────────────── */
.jp-editors-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.jp-editor-card  {
    display: flex; align-items: flex-start; gap: 10px;
    background: #fafbfc; border-radius: 12px; padding: .9rem;
    border: 1px solid #e8edf2;
}
.jp-editor-avatar {
    width: 40px; height: 40px; border-radius: 50%;
    background: var(--navy); color: var(--gold);
    display: flex; align-items: center; justify-content: center;
    font-size: 13px; font-weight: 800; flex-shrink: 0;
}
.jp-editor-name  { font-size: 13px; font-weight: 700; color: var(--navy); }
.jp-editor-role  { font-size: 11px; color: var(--gold-text); font-weight: 600; }
.jp-editor-affil { font-size: 11px; color: var(--text-muted); line-height: 1.4; }

/* ── Submission ─────────────────────────────────────────── */
.jp-submit-info { display: flex; flex-direction: column; gap: 1.2rem; margin-bottom: 1.4rem; }
.jp-submit-step { display: flex; align-items: flex-start; gap: 14px; font-size: 13px; color: var(--text-mid); }
.jp-submit-step strong { display: block; color: var(--navy); font-size: 14px; font-weight: 800; margin-bottom: 4px; }
.jp-submit-step p { margin: 0; line-height: 1.65; }
.jp-step-num {
    width: 32px; height: 32px; border-radius: 50%;
    background: var(--navy); color: var(--gold);
    font-size: 13px; font-weight: 900;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.jp-submit-btn {
    display: inline-flex; align-items: center; gap: 8px;
    background: var(--navy); color: #fff;
    padding: 13px 24px; border-radius: 50px;
    font-size: 14px; font-weight: 700; text-decoration: none;
    transition: background .2s, transform .2s;
}
.jp-submit-btn:hover { background: var(--gold-text); color: #fff; transform: translateY(-2px); }
.jp-submit-note { font-size: 12px; color: var(--text-muted); margin-top: 1rem; display: flex; align-items: center; gap: 6px; }
.jp-submit-note i { color: var(--gold-text); }

/* ── Sidebar ────────────────────────────────────────────── */
.jp-sidebar { display: flex; flex-direction: column; gap: 1.2rem; position: sticky; top: 80px; }
.jp-side-card {
    background: #fff; border: 1px solid #e8edf2;
    border-radius: 16px; padding: 1.2rem;
}
.jp-side-title {
    font-size: 11px; font-weight: 800; color: var(--text-faint);
    letter-spacing: 1px; text-transform: uppercase;
    margin-bottom: 1rem; padding-bottom: .6rem;
    border-bottom: 1px solid #e8edf2;
}
.jp-ams-card { text-align: center; background: #0d1520; border-color: rgba(255,255,255,.08); }
.jp-ams-card .jp-side-title { color: rgba(255,255,255,.3); border-bottom-color: rgba(255,255,255,.08); }
.jp-ams-ring-wrap { position: relative; width: 130px; height: 130px; margin: 0 auto 1rem; }
.jp-ams-ring-label {
    position: absolute; inset: 0;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
}
.jp-ams-big   { font-size: 32px; font-weight: 900; color: #fff; line-height: 1; letter-spacing: -2px; }
.jp-ams-small { font-size: 11px; color: rgba(255,255,255,.4); font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; }
.jp-ams-rank-row { display: flex; align-items: center; justify-content: center; gap: 8px; margin-bottom: 1rem; }
.jp-quartile-pill { font-size: 12px; font-weight: 800; padding: 4px 12px; border-radius: 50px; }
.jp-rank-text { font-size: 11px; color: rgba(255,255,255,.5); }
.jp-index-cta {
    display: flex; align-items: center; justify-content: center; gap: 7px;
    background: var(--gold-text); color: #fff;
    padding: 11px; border-radius: 50px;
    font-size: 12px; font-weight: 800; text-decoration: none;
    transition: background .2s, transform .2s;
}
.jp-index-cta:hover { background: #fff; color: var(--navy); transform: translateY(-2px); }

.jp-quick-facts { display: flex; flex-direction: column; gap: 0; }
.jp-qf-row {
    display: flex; justify-content: space-between; align-items: baseline;
    padding: 7px 0; border-bottom: 1px solid #f0f4f8; font-size: 12px;
}
.jp-qf-row:last-child { border-bottom: none; }
.jp-qf-label { color: var(--text-muted); }
.jp-qf-val   { color: var(--navy); font-weight: 700; text-align: right; }

.jp-indexed-list { display: flex; flex-direction: column; gap: 8px; }
.jp-idx-row { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--navy); font-weight: 600; }

.jp-share-btns { display: flex; flex-direction: column; gap: 8px; }
.jp-share-btn {
    display: flex; align-items: center; gap: 9px;
    background: #f4f5f7; border: 1px solid #e8edf2;
    color: var(--navy); font-size: 13px; font-weight: 700;
    padding: 10px 14px; border-radius: 50px; cursor: pointer;
    font-family: 'Cairo', sans-serif; text-decoration: none;
    transition: background .2s, border-color .2s;
}
.jp-share-btn:hover { background: var(--navy); color: #fff; border-color: var(--navy); }
.jp-share-btn:hover i { color: var(--gold); }
.jp-share-btn i { color: var(--gold-text); font-size: 13px; }

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 991px) {
    /* .jp-hero responsive handled by .page-hero in universal section */
    .page-tabs-bar { margin: 0 8px; }
    .jp-content { padding: 1.2rem 8px 2rem; }
    .jp-layout           { grid-template-columns: 1fr; }
    .jp-sidebar          { position: static; }
    .jp-hero-row         { grid-template-columns: 1fr; padding-bottom: 1.5rem; }
    .jp-metrics-strip    { min-width: 0; }
    .jp-metrics-row      { grid-template-columns: 1fr; }
    .jp-editors-grid     { grid-template-columns: 1fr; }
}
@media (max-width: 576px) {
    .jp-ms-grid          { grid-template-columns: repeat(2, 1fr); }
    .ui-kpi-grid         { grid-template-columns: repeat(2, 1fr); }
    .jp-identity         { flex-direction: column; }
    .jp-big-logo         { width: 52px; height: 52px; }
    .jp-title            { font-size: 18px; }
}

/* ═══════════════════════════════════════════════════════════
   SEARCH PAGE
═══════════════════════════════════════════════════════════ */

/* ── Hero ───────────────────────────────────────────────── */
/* ══════════════════════════════════════════════════════════
   SEARCH PAGE
══════════════════════════════════════════════════════════ */

/* Hero overrides on top of .page-hero */
.srch-hero { padding-bottom: 0; }
.srch-hero-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem; align-items: center;
    padding: 2rem 0 1.8rem;
}
.srch-hero-text { }

/* Search bar */
.srch-bar-form { }
.srch-bar {
    display: flex; align-items: center; gap: 10px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 50px; padding: 6px 6px 6px 20px;
    transition: border-color .2s, box-shadow .2s;
}
.srch-bar:focus-within {
    border-color: rgba(201,168,76,.6);
    box-shadow: 0 0 0 3px rgba(201,168,76,.1);
}
.srch-bar > i { color: rgba(255,255,255,.35); font-size: 15px; flex-shrink: 0; }
.srch-bar input {
    flex: 1; background: transparent; border: none; outline: none;
    color: #fff; font-size: 14px; font-family: 'Cairo', sans-serif;
}
.srch-bar input::placeholder { color: rgba(255,255,255,.3); }
.srch-clear {
    color: rgba(255,255,255,.4); font-size: 15px; padding: 4px 8px;
    text-decoration: none; transition: color .2s;
}
.srch-clear:hover { color: #fff; }
.srch-submit {
    background: var(--gold-text); color: #fff; border: none;
    padding: 10px 22px; border-radius: 50px;
    font-size: 13px; font-weight: 800; cursor: pointer;
    font-family: 'Cairo', sans-serif; white-space: nowrap;
    display: flex; align-items: center; gap: 7px;
    transition: background .2s, transform .2s;
}
.srch-submit:hover { background: #fff; color: var(--navy); transform: scale(1.02); }

/* Type tabs — bottom of hero */
.srch-type-tabs {
    display: flex; gap: 0; overflow-x: auto; scrollbar-width: none;
    border-top: 1px solid rgba(255,255,255,.08);
}
.srch-type-tabs::-webkit-scrollbar { display: none; }
.srch-type-tab {
    display: flex; align-items: center; gap: 7px;
    color: rgba(255,255,255,.4); font-size: 12px; font-weight: 700;
    padding: .9rem 1.2rem; border-bottom: 3px solid transparent;
    text-decoration: none; white-space: nowrap;
    transition: color .2s, border-color .2s;
}
.srch-type-tab i { font-size: 11px; }
.srch-type-tab:hover { color: rgba(255,255,255,.75); }
.srch-type-tab.active { color: var(--gold); border-bottom-color: var(--gold-text); }

/* ── Content area (uses .page-content-wrap) ─────────────── */
.srch-body { }
.srch-layout { display: grid; grid-template-columns: 1fr 260px; gap: 1.6rem; align-items: start; min-width: 0; }
.srch-layout > * { min-width: 0; }

/* ── Results header ─────────────────────────────────────── */
.srch-results-header {
    display: flex; align-items: center; gap: 10px;
    margin-bottom: 1.2rem; padding-bottom: .8rem;
    border-bottom: 1px solid #e8edf2;
}
.srch-count      { font-size: 14px; font-weight: 800; color: var(--navy); }
.srch-query-note { font-size: 12px; color: var(--text-muted); }

/* ── Journal result row ─────────────────────────────────── */
.srch-journal-row {
    display: flex; align-items: center; gap: 14px;
    background: #fff; border: 1px solid #e8edf2;
    border-radius: 16px; padding: 1rem 1.2rem;
    margin-bottom: 10px; text-decoration: none; color: inherit;
    transition: box-shadow .2s, border-color .2s, transform .2s;
}
.srch-journal-row:hover {
    box-shadow: 0 4px 20px rgba(0,0,0,.08);
    border-color: var(--gold-text);
    transform: translateY(-2px); color: inherit;
}
.sjr-logo {
    width: 48px; height: 48px; border-radius: 12px;
    background: var(--navy); color: var(--gold);
    display: flex; align-items: center; justify-content: center;
    font-size: 10px; font-weight: 800; flex-shrink: 0;
    letter-spacing: .3px;
}
.sjr-body    { flex: 1; min-width: 0; }
.sjr-name    { font-size: 14px; font-weight: 800; color: var(--navy); margin-bottom: 5px; }
.sjr-meta    { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 11px; color: var(--text-muted); margin-bottom: 5px; }
.sjr-meta i  { color: var(--text-faint); }
.sjr-oa      { color: #0f6e56; font-weight: 700; }
.sjr-match   { font-size: 11px; color: #0f6e56; display: inline-flex; align-items: center; gap: 4px; font-weight: 600; }
.sjr-scores  { display: flex; gap: 16px; flex-shrink: 0; }
.sjr-score-item { text-align: center; }
.sjr-score-num  { display: block; font-size: 18px; font-weight: 900; color: var(--navy); letter-spacing: -1px; }
.sjr-ams        { color: var(--gold-text); }
.sjr-score-label{ font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .3px; }
.sjr-q-badge    { display: inline-block; font-size: 11px; font-weight: 800; padding: 3px 10px; border-radius: 50px; }
.sjr-arrow      { color: var(--text-faint); font-size: 13px; flex-shrink: 0; }

/* ── Paper result row ───────────────────────────────────── */
.srch-paper-row {
    display: flex; align-items: flex-start; gap: 14px;
    background: #fff; border: 1px solid #e8edf2;
    border-radius: 16px; padding: 1rem 1.2rem;
    margin-bottom: 10px;
    transition: box-shadow .2s, transform .2s;
}
.srch-paper-row:hover { box-shadow: 0 4px 20px rgba(0,0,0,.08); transform: translateY(-2px); }
.spr-num {
    width: 28px; height: 28px; border-radius: 8px;
    background: var(--navy); color: var(--gold);
    font-size: 11px; font-weight: 900;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
    margin-top: 2px;
}
.spr-body   { flex: 1; min-width: 0; }
.spr-title  { font-size: 14px; font-weight: 700; color: var(--navy); margin-bottom: 5px; line-height: 1.45; }
.spr-authors{ font-size: 12px; color: var(--text-mid); margin-bottom: 6px; }
.spr-meta   { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 11px; color: var(--text-muted); }
.spr-meta i { color: var(--text-faint); }
.spr-meta a { color: var(--gold-text); text-decoration: none; }
.spr-oa     { color: #0f6e56; font-weight: 700; }
.spr-cites  { text-align: center; flex-shrink: 0; min-width: 60px; }
.spr-cites-num   { display: block; font-size: 22px; font-weight: 900; color: var(--navy); letter-spacing: -1px; }
.spr-cites-label { font-size: 10px; color: var(--text-muted); text-transform: uppercase; }

/* ── Author result row ──────────────────────────────────── */
.srch-author-row {
    display: flex; align-items: center; gap: 14px;
    background: #fff; border: 1px solid #e8edf2;
    border-radius: 16px; padding: 1rem 1.2rem;
    margin-bottom: 10px;
    transition: box-shadow .2s, transform .2s;
}
.srch-author-row:hover { box-shadow: 0 4px 20px rgba(0,0,0,.08); transform: translateY(-2px); }
.sar-avatar {
    width: 48px; height: 48px; border-radius: 50%;
    background: linear-gradient(135deg, var(--navy), #1a3a5c);
    color: var(--gold);
    display: flex; align-items: center; justify-content: center;
    font-size: 14px; font-weight: 900; flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(0,0,0,.15);
}
.sar-body   { flex: 1; min-width: 0; }
.sar-name   { font-size: 14px; font-weight: 800; color: var(--navy); margin-bottom: 5px; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.sar-meta   { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 11px; color: var(--text-muted); }
.sar-orcid  { color: var(--teal-mid); display: flex; align-items: center; gap: 4px; }
.sar-orcid i{ color: #a6ce39; }
.sar-src-badge {
    display: inline-flex; align-items: center;
    background: #f0f4f8; border: 1px solid #e8edf2;
    color: var(--text-muted); font-size: 10px; font-weight: 700;
    padding: 2px 9px; border-radius: 50px;
    letter-spacing: .3px;
}
.sar-stats  { display: flex; gap: 20px; flex-shrink: 0; }
.sar-stat   { text-align: center; }
.sar-stat-val  { display: block; font-size: 18px; font-weight: 900; color: var(--navy); letter-spacing: -1px; }
.sar-stat-label{ font-size: 10px; color: var(--text-muted); text-transform: uppercase; }

/* ── DOI / ISSN result card ─────────────────────────────── */
.doi-result-card {
    background: #fff; border: 1px solid #e8edf2;
    border-radius: 16px; padding: 1.6rem;
}
.doi-rc-head { display: flex; align-items: center; gap: 8px; margin-bottom: 1rem; }
.doi-rc-type { font-size: 11px; font-weight: 800; color: var(--text-muted); letter-spacing: 1px; text-transform: uppercase; }
.doi-oa-badge {
    display: inline-flex; align-items: center; gap: 5px;
    background: #e1f5ee; color: #0f6e56;
    font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 50px;
}
.doi-rc-title   { font-size: 18px; font-weight: 900; color: var(--navy); line-height: 1.4; margin-bottom: .7rem; letter-spacing: -.3px; }
.doi-rc-authors { font-size: 13px; color: var(--text-mid); margin-bottom: .8rem; }
.doi-rc-meta    { display: flex; flex-wrap: wrap; gap: 5px 16px; font-size: 12px; color: var(--text-muted); margin-bottom: 1.2rem; }
.doi-rc-meta i  { color: var(--text-faint); }
.doi-rc-abstract { background: #f4f5f7; border-radius: 12px; padding: 1rem 1.2rem; margin-bottom: 1.2rem; }
.doi-rc-abstract strong { font-size: 11px; font-weight: 800; color: var(--navy); display: block; margin-bottom: 6px; text-transform: uppercase; letter-spacing: .5px; }
.doi-rc-abstract p  { font-size: 13px; color: var(--text-mid); line-height: 1.75; margin: 0; }
.doi-rc-footer  { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .8rem; }
.doi-rc-details { display: flex; gap: 8px; flex-wrap: wrap; }
.doi-pill {
    display: inline-flex; align-items: center; gap: 6px;
    background: #f4f5f7; border: 1px solid #e8edf2;
    font-size: 11px; color: var(--text-mid); padding: 5px 12px; border-radius: 50px;
}
.doi-pill i { color: var(--gold-text); }
.doi-rc-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.doi-btn {
    display: inline-flex; align-items: center; gap: 7px;
    font-size: 13px; font-weight: 700; padding: 10px 20px;
    border-radius: 50px; text-decoration: none;
    transition: background .2s, transform .2s;
}
.doi-btn:hover { transform: translateY(-2px); }
.doi-btn-primary   { background: var(--navy); color: #fff; }
.doi-btn-primary:hover { background: var(--gold-text); color: #fff; }
.doi-btn-secondary { background: #f0f4f8; border: 1px solid #e8edf2; color: var(--navy); }
.doi-btn-secondary:hover { background: var(--navy); color: #fff; }

/* ISSN metrics */
.issn-metrics-row { display: flex; gap: 2rem; margin: 1.2rem 0; }
.issn-metric      { text-align: center; }
.issn-m-val   { display: block; font-size: 32px; font-weight: 900; color: var(--navy); letter-spacing: -2px; }
.issn-q-val   { font-size: 20px; padding: 5px 16px; border-radius: 50px; }
.issn-m-label { font-size: 11px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .5px; }

/* ── Empty state ────────────────────────────────────────── */
.srch-empty {
    text-align: center; padding: 4rem 1rem;
    background: #fff; border: 1px solid #e8edf2;
    border-radius: 16px;
}
.srch-empty > i { font-size: 40px; color: #d0d8e4; display: block; margin-bottom: 1.2rem; }
.srch-empty h3 { font-size: 18px; font-weight: 800; color: var(--navy); margin-bottom: .5rem; }
.srch-empty p  { font-size: 13px; color: var(--text-muted); }
.srch-empty a  { color: var(--gold-text); text-decoration: none; }
.srch-suggestions { margin-top: 1.4rem; }
.srch-sug-label { font-size: 11px; color: var(--text-muted); margin-bottom: .6rem; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; }
.srch-sug-chip {
    display: inline-block; margin: 4px;
    background: #f4f5f7; border: 1px solid #e8edf2;
    color: var(--text-mid); font-size: 12px; font-weight: 600;
    padding: 6px 16px; border-radius: 50px; text-decoration: none;
    transition: all .2s;
}
.srch-sug-chip:hover { border-color: var(--gold-text); color: var(--navy); background: #faf6ec; }

/* ── Sidebar ────────────────────────────────────────────── */
.srch-main    { min-width: 0; }
.srch-sidebar { display: flex; flex-direction: column; gap: 1.2rem; position: sticky; top: 80px; }
.srch-side-card {
    background: #fff; border: 1px solid #e8edf2;
    border-radius: 16px; padding: 1.2rem;
}
.srch-side-title {
    font-size: 11px; font-weight: 800; color: var(--text-faint);
    text-transform: uppercase; letter-spacing: 1px;
    display: flex; align-items: center; gap: 7px;
    margin-bottom: 1rem; padding-bottom: .6rem;
    border-bottom: 1px solid #e8edf2;
}
.srch-side-title i { color: var(--gold-text); }
.srch-filter-group { margin-bottom: 1rem; }
.srch-filter-label { font-size: 10px; font-weight: 800; color: var(--text-muted); letter-spacing: .8px; text-transform: uppercase; display: block; margin-bottom: .5rem; }
.srch-filter-check {
    display: flex; align-items: center; gap: 8px;
    font-size: 12px; color: var(--text-mid); padding: 4px 0; cursor: pointer;
}
.srch-filter-check input { accent-color: var(--gold-text); width: 14px; height: 14px; }
.srch-filter-select {
    width: 100%; font-family: 'Cairo', sans-serif; font-size: 12px;
    border: 1px solid #e8edf2; border-radius: 50px;
    padding: 8px 14px; color: var(--navy); outline: none;
    background: #f4f5f7; appearance: none;
    transition: border-color .2s;
}
.srch-filter-select:focus { border-color: var(--gold-text); }
.srch-filter-apply {
    width: 100%; background: var(--navy); color: #fff;
    border: none; padding: 10px; border-radius: 50px;
    font-size: 13px; font-weight: 700; cursor: pointer;
    font-family: 'Cairo', sans-serif; margin-top: .5rem;
    transition: background .2s;
}
.srch-filter-apply:hover { background: var(--gold-text); }

.srch-quick-links { display: flex; flex-direction: column; gap: 4px; }
.srch-quick-link {
    display: flex; align-items: center; gap: 9px;
    font-size: 13px; font-weight: 600; color: var(--navy); text-decoration: none;
    padding: 8px 10px; border-radius: 10px;
    transition: background .2s, color .2s;
}
.srch-quick-link i { color: var(--gold-text); font-size: 12px; width: 16px; text-align: center; }
.srch-quick-link:hover { background: #f4f5f7; }

.srch-tips-card { background: #faf6ec; border-color: #f0e4b0; }
.srch-tips-card .srch-side-title { border-color: #f0e4b0; }
.srch-tips { padding-left: 1.2rem; margin: 0; }
.srch-tips li { font-size: 12px; color: var(--text-mid); margin-bottom: 7px; line-height: 1.55; }
.srch-tips strong { color: var(--navy); }

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 991px) {
    .srch-hero-inner { grid-template-columns: 1fr; gap: 1.2rem; }
    .srch-layout { grid-template-columns: 1fr; }
    .srch-sidebar { position: static; }
    .srch-hero-inner { max-width: none; }
}
@media (max-width: 576px) {
    .sjr-scores { display: none; }
    .sar-stats  { gap: 10px; }
    .doi-rc-footer { flex-direction: column; }
}

/* ============================================================
   RANKINGS PAGE
   ============================================================ */

/* Hero */
/* ══════════════════════════════════════════════════════════
   AMS BADGE PAGE
══════════════════════════════════════════════════════════ */
.badge-preview-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(220px,1fr)); gap: 14px; margin-bottom: 2rem; }
.badge-preview-card { background:#fff; border:1px solid #e8edf2; border-radius:14px; padding:1.2rem; display:flex; flex-direction:column; gap:.8rem; align-items:flex-start; }
.badge-preview-label { font-size:10px; font-weight:800; color:var(--text-faint); text-transform:uppercase; letter-spacing:1px; }
.badge-preview-code { width:100%; background:#f4f5f7; border-radius:8px; padding:.6rem .8rem; font-size:10px; color:var(--text-mid); word-break:break-all; }

/* ══════════════════════════════════════════════════════════
   API ACCESS & DOCS PAGES
══════════════════════════════════════════════════════════ */
.api-endpoints { display:flex; flex-direction:column; gap:6px; }
.api-endpoint  { display:flex; align-items:flex-start; gap:10px; background:#fff; border:1px solid #e8edf2; border-radius:10px; padding:.8rem 1rem; }
.api-method    { font-size:10px; font-weight:900; padding:3px 9px; border-radius:6px; background:#e1f5ee; color:#0a6244; flex-shrink:0; font-family:monospace; }
.api-method--get  { background:#e1f5ee; color:#0a6244; }
.api-method--post { background:#e6f1fb; color:#185fa5; }
.api-path      { font-size:12px; color:var(--navy); flex-shrink:0; }
.api-desc      { font-size:12px; color:var(--text-muted); }
.api-code-block { background:#1a2d42; border-radius:12px; overflow:hidden; margin-bottom:.6rem; max-width:100%; }
.api-code-header { background:#0d1e2e; padding:.5rem 1rem; font-size:11px; font-weight:700; color:rgba(255,255,255,.5); display:flex; align-items:center; justify-content:space-between; }
.api-code      { margin:0; padding:1rem; color:#a8c4e0; font-size:12px; line-height:1.7; overflow-x:auto; white-space:pre; display:block; max-width:100%; box-sizing:border-box; }
.api-table-wrap { overflow-x:auto; margin-bottom:1rem; max-width:100%; }
.api-table     { width:100%; border-collapse:collapse; font-size:13px; }
.api-table th  { text-align:left; padding:.6rem .8rem; font-size:10px; font-weight:800; color:var(--text-faint); text-transform:uppercase; letter-spacing:.5px; border-bottom:2px solid #e8edf2; }
.api-table td  { padding:.7rem .8rem; border-bottom:1px solid #f0f2f5; color:var(--text-mid); }
.api-status    { font-size:11px; font-weight:800; padding:2px 8px; border-radius:50px; }
.api-status--ok   { background:#e1f5ee; color:#0a6244; }
.api-status--warn { background:#faeeda; color:#7a4f0e; }
.api-status--err  { background:#faece7; color:#993c1d; }

/* API Docs layout */
.apidoc-wrap   { display:grid; grid-template-columns:200px 1fr; gap:0; align-items:start; min-width:0; }
.apidoc-sidebar { padding:1.4rem; position:sticky; top:80px; min-width:0; }
.apidoc-nav-link { display:block; font-size:13px; color:var(--text-mid); text-decoration:none; padding:5px 8px; border-radius:8px; font-weight:600; transition:background .15s,color .15s; }
.apidoc-nav-link:hover { background:#f0f4f8; color:var(--navy); }
.apidoc-main   { padding:1.4rem; border-left:1px solid #e8edf2; min-width:0; overflow:hidden; }
.apidoc-section { margin-bottom:2.4rem; scroll-margin-top:80px; }
.apidoc-section h2 { font-size:17px; font-weight:800; color:var(--navy); margin:0 0 .8rem; padding-bottom:.6rem; border-bottom:1px solid #e8edf2; }
.apidoc-section p  { font-size:13px; color:var(--text-mid); line-height:1.6; margin-bottom:.8rem; }
.apidoc-endpoint { background:#fff; border:1px solid #e8edf2; border-radius:12px; padding:1.1rem; margin-bottom:1rem; }
.apidoc-ep-header { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:.6rem; }
.apidoc-ep-path   { font-size:13px; color:var(--navy); font-weight:700; }
.apidoc-ep-desc   { font-size:12px; color:var(--text-muted); }
.apidoc-params    { font-size:12px; color:var(--text-mid); margin:.4rem 0 .6rem; }
@media (max-width:768px) {
    .apidoc-wrap { grid-template-columns:1fr; }
    .apidoc-sidebar { position:static; border-bottom:1px solid #e8edf2; }
    .apidoc-main { border-left:none; }
}

/* ══════════════════════════════════════════════════════════
   DASHBOARD PAGE
══════════════════════════════════════════════════════════ */
.dash-login-card { background:#fff; border:1px solid #e8edf2; border-radius:20px; padding:2rem; margin-bottom:1.4rem; }
.dash-login-icon { width:56px; height:56px; background:var(--navy); border-radius:16px; display:flex; align-items:center; justify-content:center; font-size:24px; color:var(--gold); margin-bottom:1rem; }
.dash-login-title { font-size:18px; font-weight:800; color:var(--navy); margin:0 0 6px; }
.dash-login-sub   { font-size:13px; color:var(--text-muted); margin-bottom:1.4rem; }
.dash-login-form  { display:flex; flex-direction:column; gap:.8rem; }
.dash-field label { font-size:12px; font-weight:700; color:var(--navy); display:block; margin-bottom:5px; }
.dash-features    { background:#fff; border:1px solid #e8edf2; border-radius:16px; padding:1.4rem; }
.dash-feat-title  { font-size:11px; font-weight:800; color:var(--text-faint); text-transform:uppercase; letter-spacing:1px; margin-bottom:1rem; }
.dash-feat-grid   { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.dash-feat-item   { display:flex; align-items:flex-start; gap:10px; }
.dash-feat-icon   { width:36px; height:36px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:15px; flex-shrink:0; }
.dash-feat-name   { font-size:13px; font-weight:700; color:var(--navy); }
.dash-feat-desc   { font-size:11px; color:var(--text-muted); }
@media (max-width:576px) { .dash-feat-grid { grid-template-columns:1fr; } }

/* ══════════════════════════════════════════════════════════
   FOR PUBLISHERS PAGE
══════════════════════════════════════════════════════════ */
.fp-wrap { max-width: 1100px; margin: 0 auto; padding: 2rem 1.4rem; }
.fp-benefits-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 2.4rem; }
.fp-benefit {
    display: flex; gap: 1rem; background: #fff;
    border: 1px solid #e8edf2; border-radius: 16px; padding: 1.4rem;
    transition: box-shadow .2s, transform .2s;
    scroll-margin-top: 80px;
}
.fp-benefit:hover { box-shadow: 0 6px 24px rgba(0,0,0,.08); transform: translateY(-2px); }
.fp-benefit-icon {
    width: 52px; height: 52px; border-radius: 14px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center; font-size: 22px;
}
.fp-benefit-body { flex: 1; min-width: 0; }
.fp-benefit-title { font-size: 15px; font-weight: 800; color: var(--navy); margin: 0 0 6px; }
.fp-benefit-desc  { font-size: 13px; color: var(--text-mid); line-height: 1.6; margin-bottom: 10px; }
.fp-benefit-items { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 5px; }
.fp-benefit-items li { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--text-mid); }
.fp-benefit-items li i { font-size: 10px; margin-top: 2px; flex-shrink: 0; }

/* Plans strip */
.fp-plans-strip  { background: var(--navy) url('/ams/assets/img/59699.jpg') center center / cover no-repeat; border-radius: 20px; padding: 2rem; margin-bottom: 1.4rem; }
.fp-plans-header { text-align: center; margin-bottom: 1.4rem; }
.fp-plans-header h2 { font-size: 20px; font-weight: 800; color: #fff; margin-bottom: 6px; }
.fp-plans-header p  { font-size: 13px; color: rgba(255,255,255,.6); }
.fp-plans-all    { font-size: 13px; font-weight: 700; color: var(--gold); text-decoration: none; }
.fp-plans-row    { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); gap: 12px; }
.fp-plan-card {
    position: relative;
    background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12);
    border-radius: 16px; padding: 1.4rem 1.2rem;
    display: flex; flex-direction: column; gap: .5rem;
}
.fp-plan-card--featured { background: #fff; border-color: #fff; }
.fp-plan-card--featured .fp-plan-name { color: var(--navy) !important; }
.fp-plan-card--featured .fp-plan-price { color: var(--navy); }
.fp-plan-card--featured .fp-plan-feats li { color: var(--text-mid); }
.fp-plan-name    { font-size: 15px; font-weight: 800; }
.fp-plan-price   { font-size: 28px; font-weight: 900; color: #fff; letter-spacing: -1px; }
.fp-plan-price span { font-size: 13px; font-weight: 600; letter-spacing: 0; }
.fp-plan-feats   { list-style: none; padding: 0; margin: .4rem 0 .8rem; flex: 1; display: flex; flex-direction: column; gap: 5px; }
.fp-plan-feats li { display: flex; align-items: flex-start; gap: 7px; font-size: 12px; color: rgba(255,255,255,.75); }
.fp-plan-feats li i { font-size: 9px; margin-top: 2px; flex-shrink: 0; }
.fp-plan-more    { font-size: 11px; color: rgba(255,255,255,.4); font-style: italic; }
.fp-plan-btn {
    display: block; text-align: center; color: #fff;
    padding: 10px; border-radius: 50px; font-size: 13px; font-weight: 700;
    text-decoration: none; font-family: 'Cairo',sans-serif;
    transition: opacity .2s;
}
.fp-plan-btn:hover { opacity: .85; color: #fff; }

@media (max-width: 991px) {
    .fp-benefits-grid { grid-template-columns: 1fr; }
    .fp-plans-row     { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 576px) {
    .fp-plans-row { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════
   FAQ PAGE
══════════════════════════════════════════════════════════ */
.faq-wrap  { max-width: 860px; margin: 0 auto; padding: 2rem 1.4rem; }
.faq-topics { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 2rem; }
.faq-topic-btn {
    display: inline-flex; align-items: center; gap: 7px;
    font-size: 12px; font-weight: 700; padding: 7px 14px;
    border-radius: 50px; text-decoration: none; transition: opacity .2s, transform .15s;
}
.faq-topic-btn:hover { opacity: .8; transform: translateY(-1px); }
.faq-section { margin-bottom: 2rem; scroll-margin-top: 80px; }
.faq-section-header { display: flex; align-items: center; gap: 12px; margin-bottom: 1rem; }
.faq-section-icon {
    width: 40px; height: 40px; border-radius: 10px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center; font-size: 17px;
}
.faq-section-title { font-size: 16px; font-weight: 800; color: var(--navy); margin: 0; }
.faq-accordion { display: flex; flex-direction: column; gap: 6px; }
.faq-item  { background: #fff; border: 1px solid #e8edf2; border-radius: 12px; overflow: hidden; }
.faq-q {
    width: 100%; text-align: left; background: none; border: none;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 1rem 1.1rem; cursor: pointer;
    font-family: 'Cairo',sans-serif; font-size: 13px; font-weight: 700; color: var(--navy);
}
.faq-chevron { font-size: 11px; color: var(--text-muted); transition: transform .25s; flex-shrink: 0; }
.faq-a {
    font-size: 13px; color: var(--text-mid); line-height: 1.7;
    padding: 0 1.1rem; max-height: 0; overflow: hidden;
    transition: max-height .3s ease, padding .3s ease;
}
.faq-item.open .faq-chevron { transform: rotate(180deg); }
.faq-item.open .faq-a { max-height: 300px; padding: 0 1.1rem 1rem; }
.faq-item.open { border-color: var(--gold-text); }

/* ══════════════════════════════════════════════════════════
   REVIEW TIMELINE PAGE
══════════════════════════════════════════════════════════ */
.rt-wrap         { max-width: 900px; margin: 0 auto; padding: 2rem 1.4rem; }
.rt-section-title {
    font-size: 17px; font-weight: 800; color: var(--navy);
    display: flex; align-items: center; gap: 10px;
    margin: 0 0 1.4rem;
}
.rt-section-title i { color: var(--gold-text); }

/* Timeline */
.rt-timeline  { display: flex; flex-direction: column; gap: 0; }
.rt-step      { display: flex; gap: 1rem; }
.rt-step-connector { display: flex; flex-direction: column; align-items: center; flex-shrink: 0; width: 48px; }
.rt-step-dot  {
    width: 44px; height: 44px; border-radius: 50%; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 17px; color: #fff; box-shadow: 0 4px 12px rgba(0,0,0,.15);
}
.rt-step-line { flex: 1; width: 2px; background: #e8edf2; margin: 6px 0; min-height: 20px; }
.rt-step-card {
    background: #fff; border: 1px solid #e8edf2; border-radius: 16px;
    padding: 1.3rem 1.4rem; margin-bottom: 14px; flex: 1;
}
.rt-step-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: .6rem; }
.rt-step-num  { font-size: 10px; font-weight: 900; padding: 3px 10px; border-radius: 50px; letter-spacing: .5px; }
.rt-step-days { font-size: 12px; font-weight: 700; color: var(--text-muted); display: flex; align-items: center; gap: 5px; }
.rt-step-days i { color: var(--gold-text); }
.rt-step-title { font-size: 15px; font-weight: 800; color: var(--navy); margin: 0 0 6px; }
.rt-step-desc  { font-size: 13px; color: var(--text-mid); line-height: 1.6; margin-bottom: 10px; }
.rt-step-items { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 5px; }
.rt-step-items li { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--text-mid); }
.rt-step-items li i { font-size: 9px; margin-top: 3px; flex-shrink: 0; }

/* Per-plan SLA */
.rt-sla-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.rt-sla-card {
    position: relative;
    background: #fff; border: 1px solid #e8edf2; border-radius: 16px;
    padding: 1.4rem 1.2rem 1.2rem; text-align: center;
    transition: box-shadow .2s, transform .2s;
}
.rt-sla-card:hover { box-shadow: 0 6px 24px rgba(0,0,0,.09); transform: translateY(-3px); }
.rt-sla-card--featured { border-color: var(--navy); box-shadow: 0 6px 28px rgba(14,38,68,.12); }
.rt-sla-name  { font-size: 13px; font-weight: 800; color: var(--navy); margin-bottom: 3px; }
.rt-sla-price { font-size: 12px; color: var(--text-muted); margin-bottom: .8rem; }
.rt-sla-days  { font-size: 40px; font-weight: 900; letter-spacing: -2px; line-height: 1; }
.rt-sla-days span { font-size: 14px; font-weight: 700; letter-spacing: 0; }
.rt-sla-label { font-size: 10px; font-weight: 700; color: var(--text-faint); text-transform: uppercase; letter-spacing: .5px; margin: 4px 0 10px; }
.rt-sla-bar-wrap { background: #f0f2f5; border-radius: 50px; height: 5px; }
.rt-sla-bar   { height: 5px; border-radius: 50px; transition: width .6s ease; }

/* Carousel */
.rt-sla-carousel-wrap { display: flex; align-items: center; gap: 10px; }
.rt-sla-viewport { flex: 1; overflow: hidden; }
.rt-sla-track {
    display: flex; gap: 16px;
    transition: transform .4s cubic-bezier(.4,0,.2,1);
    will-change: transform;
}
.rt-sla-slide {
    flex: 0 0 calc((100% - 32px) / 3);
    background: #fff; border: 1px solid #e8edf2; border-radius: 16px;
    padding: 1.6rem 1.4rem 1.4rem;
    display: flex; flex-direction: column; align-items: center;
    text-align: center; gap: .4rem;
    transition: box-shadow .2s, border-color .2s;
    min-height: 340px;
}
.rt-sla-slide--featured { border-color: var(--navy); box-shadow: 0 6px 28px rgba(14,38,68,.12); }
.rt-sla-icon {
    width: 48px; height: 48px; border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    font-size: 20px; margin-bottom: .4rem;
}
.rt-sla-feats {
    list-style: none; padding: 0; margin: .6rem 0 0;
    display: flex; flex-direction: column; gap: 5px;
    text-align: left; width: 100%;
}
.rt-sla-feats li { display: flex; align-items: flex-start; gap: 7px; font-size: 11px; color: var(--text-mid); }
.rt-sla-feats li i { font-size: 9px; margin-top: 2px; flex-shrink: 0; }
.rt-sla-arrow {
    width: 38px; height: 38px; border-radius: 50%; border: 1px solid #e8edf2;
    background: #fff; color: var(--navy); font-size: 13px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; transition: background .2s, color .2s, border-color .2s;
}
.rt-sla-arrow:hover { background: var(--navy); color: #fff; border-color: var(--navy); }
.rt-sla-dots { display: flex; justify-content: center; gap: 6px; margin-top: 1rem; }
.rt-sla-dot {
    width: 8px; height: 8px; border-radius: 50%; border: none;
    background: #d0d6dd; cursor: pointer; transition: background .2s, transform .2s;
    padding: 0;
}
.rt-sla-dot.active { background: var(--navy); transform: scale(1.3); }

@media (max-width: 576px) {
    .rt-step      { gap: .6rem; }
    .rt-step-connector { width: 36px; }
    .rt-step-dot  { width: 36px; height: 36px; font-size: 14px; }
    .rt-sla-grid  { grid-template-columns: 1fr 1fr; }
}

/* ══════════════════════════════════════════════════════════
   PRICING PAGE
══════════════════════════════════════════════════════════ */
.pricing-wrap { max-width: 1100px; margin: 0 auto; padding: 2rem 1.4rem; }

.pricing-note {
    display: flex; align-items: flex-start; gap: 10px;
    background: #f0f7ff; border: 1px solid #c8dff5; border-radius: 12px;
    padding: 1rem 1.2rem; font-size: 13px; color: var(--text-mid);
    margin-bottom: 2rem;
}
.pricing-note i { color: #185fa5; font-size: 15px; flex-shrink: 0; margin-top: 1px; }
.pricing-note strong { color: var(--navy); }

/* Plans grid */
.pricing-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; margin-bottom: 2.4rem; }

.pricing-card {
    position: relative;
    background: #fff; border: 1px solid #e8edf2; border-radius: 20px;
    padding: 2rem 1.6rem 1.6rem;
    display: flex; flex-direction: column; gap: .5rem;
    transition: box-shadow .2s, transform .2s;
}
.pricing-card:hover { box-shadow: 0 8px 32px rgba(0,0,0,.1); transform: translateY(-4px); }
.pricing-card--featured {
    border-color: var(--navy);
    box-shadow: 0 8px 40px rgba(14,38,68,.14);
}
.pricing-popular-badge {
    position: absolute; top: -14px; left: 50%; transform: translateX(-50%);
    background: var(--navy); color: var(--gold);
    font-size: 11px; font-weight: 800; letter-spacing: .5px;
    padding: 4px 16px; border-radius: 50px; white-space: nowrap;
}
.pricing-card-icon {
    width: 52px; height: 52px; border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    font-size: 22px; margin-bottom: .4rem;
}
.pricing-plan-name { font-size: 19px; font-weight: 900; color: var(--navy); }
.pricing-tagline   { font-size: 12px; color: var(--text-muted); margin-bottom: .6rem; }

.pricing-price    { display: flex; align-items: baseline; gap: 3px; margin: .6rem 0 1rem; }
.pricing-currency { font-size: 18px; font-weight: 700; color: var(--navy); }
.pricing-amount   { font-size: 44px; font-weight: 900; color: var(--navy); letter-spacing: -2px; line-height: 1; }
.pricing-period   { font-size: 13px; color: var(--text-muted); margin-left: 2px; }

.pricing-features { list-style: none; padding: 0; margin: 0 0 1.4rem; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.pricing-features li { display: flex; align-items: flex-start; gap: 9px; font-size: 13px; color: var(--text-mid); }
.pricing-feat-check { font-size: 11px; margin-top: 2px; flex-shrink: 0; }

.pricing-cta-btn {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    background: #f0f4f8; color: var(--navy); border-radius: 50px;
    padding: 13px; font-size: 14px; font-weight: 800;
    text-decoration: none; font-family: 'Cairo', sans-serif;
    transition: background .2s, color .2s;
}
.pricing-cta-btn:hover { background: var(--navy); color: #fff; }
.pricing-cta-btn--featured { background: var(--navy); color: #fff; }
.pricing-cta-btn--featured:hover { background: #0d2d4d; }

/* FAQ */
.pricing-faq        { margin-bottom: 2rem; }
.pricing-faq-title  { font-size: 17px; font-weight: 800; color: var(--navy); margin-bottom: 1.2rem; display: flex; align-items: center; gap: 10px; }
.pricing-faq-title i { color: var(--gold-text); }
.pricing-faq-grid   { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pricing-faq-item   { background: #fff; border: 1px solid #e8edf2; border-radius: 14px; padding: 1.1rem 1.2rem; }
.pricing-faq-q      { font-size: 13px; font-weight: 800; color: var(--navy); margin-bottom: 6px; display: flex; gap: 7px; }
.pricing-faq-q i    { color: var(--gold-text); font-size: 10px; margin-top: 3px; flex-shrink: 0; }
.pricing-faq-a      { font-size: 12px; color: var(--text-mid); line-height: 1.6; }

@media (max-width: 991px) {
    .pricing-grid     { grid-template-columns: 1fr; max-width: 440px; margin-left: auto; margin-right: auto; }
    .pricing-faq-grid { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════
   INDEXING CRITERIA PAGE
══════════════════════════════════════════════════════════ */
.ic-wrap    { margin: 0 auto; padding: 2rem 1.4rem; }
.ic-intro   { font-size: 15px; color: var(--text-mid); line-height: 1.7; border-left: 4px solid var(--gold-text); padding-left: 1.2rem; margin-bottom: 2.4rem; }
.ic-intro strong { color: var(--navy); }

/* 2-col grid for criteria sections */
.ic-grid    { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 2.4rem; min-width: 0; }
.ic-grid > * { min-width: 0; }
.ic-section { background: #fff; border: 1px solid #e8edf2; border-radius: 16px; padding: 1.4rem; }
.ic-section-header { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 1.2rem; }
.ic-section-icon {
    width: 48px; height: 48px; border-radius: 12px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center; font-size: 20px;
}
.ic-section-num   { font-size: 10px; font-weight: 900; color: var(--text-faint); text-transform: uppercase; letter-spacing: 1px; }
.ic-section-title { font-size: 15px; font-weight: 800; color: var(--navy); margin: 2px 0 0; }
.ic-list          { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 9px; }
.ic-list li       { display: flex; align-items: flex-start; gap: 9px; font-size: 13px; color: var(--text-mid); line-height: 1.5; }
.ic-list li strong { color: var(--navy); }
.ic-check { color: #0f6e56; font-size: 12px; margin-top: 2px; flex-shrink: 0; }
.ic-cross  { color: #c0392b; font-size: 12px; margin-top: 2px; flex-shrink: 0; }

/* AMS Score block */
.ic-score-block  { background: var(--gold-text); border-radius: 20px; padding: 2rem; margin-bottom: 1.4rem; }
.ic-score-title  { font-size: 17px; font-weight: 800; color: #fff; margin-bottom: .4rem; display: flex; align-items: center; gap: 10px; }
.ic-score-title i { color: var(--gold); }
.ic-score-sub    { font-size: 13px; color: rgba(255,255,255,.65); margin-bottom: 1.4rem; }
.ic-score-grid   { display: grid; grid-template-columns: repeat(auto-fill,minmax(180px,1fr)); gap: 12px; }
.ic-score-card   { background: rgba(255,255,255,.07); border-radius: 12px; padding: 1rem; }
.ic-score-icon   { width: 36px; height: 36px; border-radius: 9px; display: flex; align-items: center; justify-content: center; font-size: 15px; margin-bottom: .7rem; }
.ic-score-label  { font-size: 12px; font-weight: 700; color: #fff; margin-bottom: .6rem; }
.ic-score-bar-wrap { background: rgba(255,255,255,.12); border-radius: 50px; height: 6px; margin-bottom: 5px; }
.ic-score-bar    { height: 6px; border-radius: 50px; }
.ic-score-pct    { font-size: 18px; font-weight: 900; }

/* Quartile table */
.ic-quartile-block { background: #fff; border: 1px solid #e8edf2; border-radius: 16px; padding: 1.4rem; margin-bottom: 1.4rem; }
.ic-quartile-block .ic-score-title { color: var(--navy); margin-bottom: 1rem; }
.ic-quartile-block .ic-score-title i { color: var(--gold-text); }
.ic-q-table { display: flex; flex-direction: column; gap: 8px; }
.ic-q-row   { display: flex; align-items: center; gap: 14px; padding: 10px 14px; border-radius: 12px; background: #fafbfc; border: 1px solid #f0f2f5; }
.ic-q-badge { font-size: 12px; font-weight: 900; padding: 4px 12px; border-radius: 50px; flex-shrink: 0; }
.ic-q-range { font-size: 14px; font-weight: 800; flex-shrink: 0; min-width: 80px; }
.ic-q-desc  { font-size: 13px; color: var(--text-mid); }

/* CTA */
.ic-cta       { margin-top: 2rem; }
.ic-cta-inner { background: linear-gradient(135deg,#162d46,var(--navy)); border-radius: 20px; padding: 2rem; display: flex; align-items: center; gap: 1.4rem; flex-wrap: wrap; }
.ic-cta-icon  { font-size: 32px; color: var(--gold); flex-shrink: 0; }
.ic-cta-title { font-size: 17px; font-weight: 800; color: #fff; margin-bottom: 4px; }
.ic-cta-sub   { font-size: 13px; color: rgba(255,255,255,.65); max-width: 480px; }
.ic-cta-btns  { display: flex; gap: 10px; flex-wrap: wrap; margin-left: auto; }
.ui-pill-btn--ghost {
    background: transparent; border: 2px solid rgba(255,255,255,.35); color: #fff;
}
.ui-pill-btn--ghost:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.6); }

@media (max-width: 991px) {
    .ic-grid        { grid-template-columns: 1fr; }
    .ic-score-grid  { grid-template-columns: 1fr 1fr; }
    .ic-cta-inner   { flex-direction: column; text-align: center; }
    .ic-cta-btns    { margin-left: 0; justify-content: center; }
}
@media (max-width: 576px) {
    .ic-score-grid  { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════
   COUNTRIES PAGE
══════════════════════════════════════════════════════════ */
.ctry-layout { display: grid; grid-template-columns: 240px 1fr; align-items: start; min-width: 0; }
.ctry-layout > * { min-width: 0; }
.ctry-card {
    display: flex; align-items: center; gap: 1rem;
    background: #fff; border: 1px solid #e8edf2; border-radius: 16px;
    padding: 1rem 1.2rem; margin-bottom: 10px;
    transition: box-shadow .2s, transform .2s, border-color .2s;
}
.ctry-card:hover { box-shadow: 0 6px 24px rgba(0,0,0,.09); transform: translateY(-2px); border-color: var(--gold-text); }
.ctry-card--empty { opacity: .55; }
.ctry-card--empty:hover { transform: none; box-shadow: none; border-color: #e8edf2; }
.ctry-card-left { display: flex; align-items: flex-start; gap: 10px; flex: 1; min-width: 0; }
.ctry-rank {
    font-size: 11px; font-weight: 900; color: rgba(255,255,255,.7);
    background: var(--navy); border-radius: 6px;
    width: 26px; height: 26px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
}
.ctry-flag  { font-size: 32px; line-height: 1; flex-shrink: 0; }
.ctry-info  { min-width: 0; flex: 1; }
.ctry-name  { font-size: 14px; font-weight: 800; color: var(--navy); margin-bottom: 5px; display: flex; align-items: center; gap: 8px; }
.ctry-region-tag {
    font-size: 10px; font-weight: 700; color: var(--text-faint);
    background: #f0f2f5; border-radius: 50px; padding: 2px 8px; white-space: nowrap;
}
.ctry-badges { display: flex; flex-wrap: wrap; gap: 5px; }
.ctry-no-data { font-size: 11px; color: var(--text-faint); font-style: italic; flex-shrink: 0; }
@media (max-width: 991px) {
    .ctry-layout { grid-template-columns: 1fr; }
    .ctry-card   { flex-direction: column; align-items: stretch; }
    .pub-stats   { justify-content: space-around; border-top: 1px solid #e8edf2; padding-top: .8rem; }
}

/* ══════════════════════════════════════════════════════════
   SUBJECTS PAGE
══════════════════════════════════════════════════════════ */
.subj-wrap        { padding: 1.4rem; }
.subj-toolbar     { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.subj-search-form { flex: 0 0 260px; }
.subj-search      { margin-bottom: 0; }
.subj-sort-bar    { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.subj-sort-label  { font-size: 11px; font-weight: 800; color: var(--text-faint); text-transform: uppercase; letter-spacing: .5px; margin-right: 4px; }
.subj-sort-btn {
    font-size: 12px; font-weight: 700; color: var(--text-mid);
    border: 1px solid #e8edf2; background: #fff; border-radius: 50px;
    padding: 5px 13px; text-decoration: none; transition: all .15s;
}
.subj-sort-btn.active { background: var(--navy); border-color: var(--navy); color: #fff; }
.subj-count-row { font-size: 13px; color: var(--text-muted); margin-bottom: 1.2rem; }
.subj-count-row strong { color: var(--navy); }

.subj-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 12px;
}
.subj-card {
    display: flex; align-items: flex-start; gap: 14px;
    background: #fff; border: 1px solid #e8edf2; border-radius: 16px;
    padding: 1.2rem; text-decoration: none;
    transition: box-shadow .2s, transform .2s, border-color .2s;
    position: relative;
}
.subj-card:hover { box-shadow: 0 6px 24px rgba(0,0,0,.09); transform: translateY(-3px); border-color: var(--gold-text); }
.subj-card--empty { opacity: .6; }
.subj-card--empty:hover { transform: none; box-shadow: none; border-color: #e8edf2; }
.subj-card-icon {
    width: 52px; height: 52px; border-radius: 14px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 22px;
}
.subj-card-body   { flex: 1; min-width: 0; }
.subj-card-name   { font-size: 14px; font-weight: 800; color: var(--navy); margin-bottom: 2px; }
.subj-card-name-ar { font-size: 11px; color: var(--text-muted); margin-bottom: 7px; direction: rtl; }
.subj-card-meta   { display: flex; flex-wrap: wrap; gap: 8px; font-size: 11px; color: var(--text-mid); margin-bottom: 8px; }
.subj-card-meta i { color: var(--gold-text); font-size: 9px; }
.subj-q1          { color: #0f6e56; font-weight: 700; }
.subj-card-stats  { display: flex; align-items: center; gap: 0; }
.subj-stat        { text-align: center; padding: 0 .8rem; }
.subj-stat:first-child { padding-left: 0; }
.subj-stat-num    { display: block; font-size: 16px; font-weight: 900; color: var(--navy); letter-spacing: -.5px; }
.subj-stat-ams    { color: var(--gold-text); }
.subj-stat-label  { display: block; font-size: 9px; font-weight: 700; color: var(--text-faint); text-transform: uppercase; letter-spacing: .5px; }
.subj-stat-div    { width: 1px; height: 28px; background: #e8edf2; flex-shrink: 0; }
.subj-card-empty-msg { font-size: 11px; color: var(--text-faint); font-style: italic; margin-top: 4px; }
.subj-card-arrow  { font-size: 11px; color: #c5cdd6; align-self: center; flex-shrink: 0; transition: color .2s, transform .2s; }
.subj-card:hover .subj-card-arrow { color: var(--gold-text); transform: translateX(3px); }

@media (max-width: 991px) {
    .subj-toolbar { flex-direction: column; align-items: stretch; }
    .subj-search-form { flex: none; }
    .subj-grid { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════
   PAPERS PAGE
══════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════
   PUBLISHERS PAGE
══════════════════════════════════════════════════════════ */
.pub-layout {
    display: grid;
    grid-template-columns: 240px 1fr;
    align-items: start;
    min-width: 0;
}
.pub-layout > * { min-width: 0; }
.pub-card {
    display: flex; align-items: center; gap: 1rem;
    background: #fff; border: 1px solid #e8edf2;
    border-radius: 16px; padding: 1.1rem 1.3rem;
    margin-bottom: 10px;
    transition: box-shadow .2s, transform .2s, border-color .2s;
}
.pub-card:hover { box-shadow: 0 6px 24px rgba(0,0,0,.09); transform: translateY(-2px); border-color: var(--gold-text); }
.pub-card-left { display: flex; align-items: flex-start; gap: 10px; flex: 1; min-width: 0; }
.pub-rank {
    font-size: 11px; font-weight: 900; color: rgba(255,255,255,.7);
    background: var(--navy); border-radius: 6px;
    width: 26px; height: 26px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
}
.pub-avatar {
    width: 48px; height: 48px; border-radius: 12px; flex-shrink: 0;
    background: linear-gradient(135deg, #1a3a5c, var(--navy));
    color: var(--gold); font-size: 15px; font-weight: 900;
    display: flex; align-items: center; justify-content: center;
}
.pub-info    { min-width: 0; flex: 1; }
.pub-name    { font-size: 14px; font-weight: 800; color: var(--navy); line-height: 1.3; margin-bottom: 3px; }
.pub-meta    { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 11px; color: var(--text-muted); margin-bottom: 5px; }
.pub-oa      { color: #0f6e56; font-weight: 700; }
.pub-badges  { display: flex; flex-wrap: wrap; gap: 5px; }
.pub-q-badge { font-size: 10px; font-weight: 800; padding: 2px 8px; border-radius: 50px; }
.pub-journal-badge {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 10px; font-weight: 600; color: var(--text-mid);
    background: #f4f5f7; border: 1px solid #e8edf2; padding: 2px 8px; border-radius: 50px;
}
.pub-journal-badge i { color: var(--gold-text); font-size: 9px; }
.pub-stats   { display: flex; align-items: center; gap: 0; flex-shrink: 0; }
.pub-stat    { text-align: center; padding: 0 1.2rem; }
.pub-stat-num    { display: block; font-size: 18px; font-weight: 900; color: var(--navy); letter-spacing: -.5px; }
.pub-stat-ams    { color: var(--gold-text); }
.pub-stat-label  { display: block; font-size: 10px; font-weight: 700; color: var(--text-faint); text-transform: uppercase; letter-spacing: .5px; margin-top: 1px; }
.pub-stat-divider { width: 1px; height: 36px; background: #e8edf2; flex-shrink: 0; }
@media (max-width: 991px) {
    .pub-layout { grid-template-columns: 1fr; }
    .pub-card   { flex-direction: column; align-items: stretch; }
    .pub-stats  { justify-content: space-around; border-top: 1px solid #e8edf2; padding-top: .8rem; margin-top: .2rem; }
    .pub-stat   { padding: 0 .5rem; }
}

/* ══════════════════════════════════════════════════════════
   INSTITUTIONS PAGE
══════════════════════════════════════════════════════════ */
.inst-layout {
    display: grid;
    grid-template-columns: 240px 1fr;
    align-items: start;
    min-width: 0;
}
.inst-layout > * { min-width: 0; }
.inst-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
    gap: 12px;
}
.inst-card {
    background: #fff; border: 1px solid #e8edf2;
    border-radius: 16px; padding: 1.2rem;
    display: flex; flex-direction: column; gap: .9rem;
    transition: box-shadow .2s, transform .2s, border-color .2s;
}
.inst-card:hover { box-shadow: 0 6px 24px rgba(0,0,0,.09); transform: translateY(-3px); border-color: var(--gold-text); }
.inst-card--publisher { border-style: dashed; }
.inst-card--publisher:hover { border-style: solid; }
.inst-card-top { display: flex; align-items: flex-start; gap: 10px; }
.inst-rank {
    font-size: 11px; font-weight: 900; color: rgba(255,255,255,.7);
    background: var(--navy); border-radius: 6px;
    width: 26px; height: 26px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
}
.inst-avatar {
    width: 44px; height: 44px; border-radius: 12px; flex-shrink: 0;
    background: linear-gradient(135deg, #1a3a5c, var(--navy));
    color: var(--gold); font-size: 14px; font-weight: 900;
    display: flex; align-items: center; justify-content: center;
}
.inst-info    { min-width: 0; flex: 1; }
.inst-name    { font-size: 13px; font-weight: 800; color: var(--navy); line-height: 1.3; margin-bottom: 3px; }
.inst-country { font-size: 11px; color: var(--text-muted); margin-bottom: 6px; }
.inst-tags    { display: flex; flex-wrap: wrap; gap: 5px; }
.inst-tag {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 10px; font-weight: 600; color: var(--text-mid);
    background: #f4f5f7; border: 1px solid #e8edf2;
    padding: 2px 8px; border-radius: 50px;
}
.inst-tag i { color: var(--gold-text); font-size: 9px; }
.inst-metrics {
    display: flex; align-items: center; justify-content: space-around;
    background: #f9fafc; border-radius: 10px; padding: .7rem .5rem;
}
@media (max-width: 991px) {
    .inst-layout { grid-template-columns: 1fr; }
    .inst-grid   { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
}
@media (max-width: 576px) {
    .inst-grid { grid-template-columns: 1fr; }
}

.papers-layout {
    display: grid;
    grid-template-columns: 240px 1fr;
    align-items: start;
    min-width: 0;
}
.papers-layout > * { min-width: 0; }

/* Sidebar */
.papers-sidebar {
    padding: 1.6rem 1.4rem;
    border-right: 1px solid #e8edf2;
    position: sticky; top: 0;
    max-height: 100vh; overflow-y: auto;
}

/* Main */
.papers-main { padding: 1.6rem 1.6rem 2.5rem; }

/* Toolbar */
.papers-toolbar {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 1.2rem; padding-bottom: .8rem;
    border-bottom: 1px solid #e8edf2;
}
.papers-count { font-size: 13px; font-weight: 700; color: var(--navy); }
.papers-count em { font-style: normal; color: var(--gold-text); }

/* Paper card */
.paper-card {
    display: flex; align-items: flex-start; gap: 14px;
    background: #fff; border: 1px solid #e8edf2;
    border-radius: 16px; padding: 1.2rem 1.4rem;
    margin-bottom: 10px;
    transition: box-shadow .2s, transform .2s;
}
.paper-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,.07); transform: translateY(-2px); }

.pc-num {
    width: 30px; height: 30px; border-radius: 8px;
    background: var(--navy); color: var(--gold);
    font-size: 12px; font-weight: 900;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; margin-top: 2px;
}
.pc-body  { flex: 1; min-width: 0; }
.pc-title { font-size: 14px; font-weight: 800; color: var(--navy); line-height: 1.45; margin-bottom: 5px; }
.pc-authors { font-size: 12px; color: var(--text-mid); margin-bottom: 7px; }
.pc-meta {
    display: flex; flex-wrap: wrap; gap: 4px 14px;
    font-size: 11px; color: var(--text-muted); margin-bottom: 8px;
}
.pc-meta i  { color: var(--text-faint); }
.pc-journal { color: var(--gold-text); text-decoration: none; font-weight: 600; }
.pc-journal:hover { color: var(--navy); }
.pc-doi { color: var(--text-muted); text-decoration: none; }
.pc-doi:hover { color: var(--gold-text); }
.pc-oa  { color: #0f6e56; font-weight: 700; }
.pc-abstract { font-size: 12px; color: var(--text-muted); line-height: 1.65; }

.pc-cites { text-align: center; flex-shrink: 0; min-width: 64px; }
.pc-cites-num   { display: block; font-size: 24px; font-weight: 900; color: var(--navy); letter-spacing: -1.5px; }
.pc-cites-label { font-size: 10px; color: var(--text-muted); text-transform: uppercase; }

/* Responsive */
@media (max-width: 991px) {
    .papers-layout { grid-template-columns: 1fr; }
    .papers-sidebar { position: static; max-height: none; border-right: none; border-bottom: 1px solid #e8edf2; }
}
@media (max-width: 576px) {
    .paper-card { flex-wrap: wrap; }
    .pc-cites { min-width: auto; text-align: left; }
}

.rnk-hero { background: var(--navy) url('/ams/assets/img/59699.jpg') center center / cover no-repeat; padding: 48px 0 0; }
.rnk-hero .page-hero-inner { display: flex; justify-content: space-between; align-items: flex-start; gap: 32px; margin-bottom: 32px; }
.rnk-hero .page-hero-title { color: #fff; font-size: 32px; font-weight: 700; margin: 8px 0; }
.rnk-hero .page-hero-sub   { color: rgba(255,255,255,.65); font-size: 14px; margin: 0; }
.rnk-hero .page-breadcrumb a { color: rgba(255,255,255,.5); }
.rnk-hero .page-breadcrumb span { color: rgba(255,255,255,.8); }
.rnk-hero .page-breadcrumb .fa-chevron-right { color: rgba(255,255,255,.3); }

.page-hero-stats { display: flex; gap: 24px; flex-shrink: 0; }
.phs-item { text-align: center; }
.phs-num  { display: block; font-size: 28px; font-weight: 700; color: var(--gold); line-height: 1; }
.phs-label { display: block; font-size: 11px; color: rgba(255,255,255,.55); margin-top: 4px; }

/* Tabs inside hero */
.rnk-tabs { display: flex; gap: 4px; }
.rnk-tab  { display: flex; align-items: center; gap: 7px; padding: 12px 20px; font-size: 13px; font-weight: 500;
             color: rgba(255,255,255,.6); border-bottom: 3px solid transparent; text-decoration: none;
             transition: color .18s, border-color .18s; }
.rnk-tab:hover  { color: #fff; }
.rnk-tab.active { color: var(--gold); border-bottom-color: var(--gold); }
.rnk-tab i { font-size: 12px; }

/* Body */
.rnk-body { padding: 36px 0 60px; }

/* Layout */
.rnk-layout { display: grid; grid-template-columns: 1fr 260px; gap: 28px; align-items: start; }

/* Section head */
.rnk-section-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.rnk-section-label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--gold); }
.rnk-section-title { font-size: 22px; font-weight: 700; color: var(--navy); margin: 4px 0 0; }
.rnk-legend { display: flex; gap: 6px; }
.rnk-legend-item { padding: 3px 10px; border-radius: 12px; font-size: 11px; font-weight: 700; }

/* Table */
.rnk-table-wrap { overflow-x: auto; border-radius: 10px; box-shadow: 0 1px 4px rgba(0,0,0,.07); }
.rnk-table { width: 100%; border-collapse: collapse; background: #fff; font-size: 13px; }
.rnk-table thead tr { background: var(--bg-light); border-bottom: 2px solid var(--border-light); }
.rnk-table th { padding: 11px 14px; text-align: left; font-size: 11px; font-weight: 700; color: var(--text-muted);
                text-transform: uppercase; letter-spacing: .05em; white-space: nowrap; }
.rnk-th-rank   { width: 52px; }
.rnk-th-center { text-align: center; }
.rnk-row { border-bottom: 1px solid var(--border-light); cursor: pointer; transition: background .12s; }
.rnk-row:hover { background: #f6f9fc; }
.rnk-row:last-child { border-bottom: none; }
.rnk-table td { padding: 12px 14px; vertical-align: middle; }
.rnk-td-center { text-align: center; }

/* Rank position */
.rnk-pos { width: 28px; height: 28px; display: flex; align-items: center; justify-content: center;
           font-size: 13px; font-weight: 700; color: var(--text-muted); }
.rnk-pos-top { font-size: 18px; }

/* Journal cell */
.rnk-journal-cell { display: flex; align-items: center; gap: 12px; }
.rnk-logo { width: 40px; height: 40px; border-radius: 8px; background: var(--navy);
            color: var(--gold); font-size: 10px; font-weight: 800; letter-spacing: .04em;
            display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.rnk-logo-sm { width: 32px; height: 32px; font-size: 8px; }
.rnk-name { font-size: 13px; font-weight: 600; color: var(--navy); line-height: 1.3; }
.rnk-issn { font-size: 11px; color: var(--text-muted); margin-top: 2px; }

/* Score bar */
.rnk-score-cell { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 80px; }
.rnk-score-num  { font-size: 18px; font-weight: 700; color: var(--navy); line-height: 1; }
.rnk-score-bar-bg { width: 100%; height: 4px; background: #e8eef4; border-radius: 2px; }
.rnk-score-bar    { height: 100%; background: var(--gold); border-radius: 2px; transition: width .4s; }

/* Metric */
.rnk-metric { font-size: 13px; font-weight: 600; color: var(--navy); }

/* Field tag */
.rnk-field-tag { padding: 3px 8px; background: var(--bg-light); border-radius: 10px;
                 font-size: 11px; color: var(--text-muted); white-space: nowrap; }

/* Q badge */
.rnk-q-badge { padding: 3px 10px; border-radius: 12px; font-size: 11px; font-weight: 700; }

/* OA / locked */
.rnk-oa-badge { font-size: 11px; color: var(--teal-mid); }
.rnk-locked   { font-size: 11px; color: var(--text-faint); }

/* ORCID */
.rnk-orcid { font-size: 11px; color: var(--text-muted); }

/* Author cell */
.rnk-author-cell   { display: flex; align-items: center; gap: 10px; }
.rnk-author-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--navy);
                     color: #fff; font-size: 14px; font-weight: 700;
                     display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

/* Country cell */
.rnk-country-cell { display: flex; align-items: center; gap: 10px; }
.rnk-country-flag { font-size: 22px; }

/* ── Quartile tab ── */
.rnk-quartile-overview { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; margin-bottom: 36px; }
.rnk-q-summary-card { background: #fff; border-radius: 12px; padding: 20px 20px 18px;
                       box-shadow: 0 1px 4px rgba(0,0,0,.07); }
.rnk-q-label   { font-size: 13px; font-weight: 800; margin-bottom: 8px; }
.rnk-q-count   { font-size: 32px; font-weight: 700; color: var(--navy); line-height: 1; margin-bottom: 12px; }
.rnk-q-count span { font-size: 13px; font-weight: 500; color: var(--text-muted); }
.rnk-q-stats   { display: flex; gap: 10px; flex-wrap: wrap; }
.rnk-q-stats > div { font-size: 11px; color: var(--text-muted); }
.rnk-q-stats > div span { display: block; font-size: 15px; font-weight: 700; color: var(--navy); }

.rnk-q-section { margin-bottom: 36px; }
.rnk-q-section-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.rnk-q-section-head h3 { font-size: 16px; font-weight: 600; color: var(--navy); margin: 0; }
.rnk-q-pill { padding: 4px 14px; border-radius: 14px; font-size: 12px; font-weight: 700; }
.rnk-q-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px; }
.rnk-q-card { display: flex; align-items: center; gap: 10px; padding: 12px 14px;
              background: #fff; border-radius: 10px; box-shadow: 0 1px 3px rgba(0,0,0,.06);
              text-decoration: none; transition: box-shadow .15s, transform .15s; }
.rnk-q-card:hover { box-shadow: 0 4px 14px rgba(0,0,0,.12); transform: translateY(-1px); }
.rnk-q-card-num  { width: 22px; font-size: 11px; font-weight: 700; color: var(--text-faint); text-align: right; flex-shrink: 0; }
.rnk-q-card-body { flex: 1; min-width: 0; }
.rnk-q-card-body .rnk-name { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rnk-q-card-score { text-align: center; flex-shrink: 0; }
.rnk-q-card .rnk-oa-badge { margin-left: auto; }

/* ── Rising stars ── */
.rnk-star-row { display: flex; align-items: center; gap: 14px; padding: 16px 18px;
                background: #fff; border-radius: 10px; margin-bottom: 8px;
                box-shadow: 0 1px 3px rgba(0,0,0,.06); text-decoration: none;
                transition: box-shadow .15s; }
.rnk-star-row:hover { box-shadow: 0 4px 14px rgba(0,0,0,.1); }
.rnk-star-body { flex: 1; min-width: 0; }
.rnk-star-scores { display: flex; gap: 16px; flex-shrink: 0; }
.rnk-star-score-item { display: flex; align-items: center; gap: 5px; font-size: 13px; flex-direction: column; text-align: center; }
.rnk-star-old   { color: var(--text-muted); font-weight: 600; }
.rnk-star-new   { color: var(--navy); font-weight: 700; font-size: 15px; }
.rnk-star-label { font-size: 10px; color: var(--text-faint); }
.rnk-star-jump  { font-size: 22px; font-weight: 800; color: var(--teal-mid); flex-shrink: 0; text-align: center; }
.rnk-star-jump-label { display: block; font-size: 10px; color: var(--text-muted); font-weight: 500; }

.rnk-empty { text-align: center; padding: 60px 20px; color: var(--text-muted); }
.rnk-empty i { font-size: 36px; margin-bottom: 12px; color: var(--border-mid); display: block; }

/* ── Country podium ── */
.rnk-podium { display: flex; justify-content: center; align-items: flex-end; gap: 0; margin-bottom: 32px; }
.rnk-podium-item { flex: 1; max-width: 160px; text-align: center; padding: 20px 12px 0; border-radius: 12px 12px 0 0; }
.rnk-podium-gold   { background: linear-gradient(135deg,#fffbeb,#fef3c7); border: 2px solid #c9a84c; order: 2; min-height: 140px; }
.rnk-podium-silver { background: linear-gradient(135deg,#f8fafc,#e8eef4); border: 2px solid #9ba8b0; order: 1; min-height: 110px; }
.rnk-podium-bronze { background: linear-gradient(135deg,#fff7f4,#fde8e0); border: 2px solid #b87333; order: 3; min-height: 90px; }
.rnk-podium-flag  { font-size: 36px; line-height: 1; margin-bottom: 6px; }
.rnk-podium-name  { font-size: 13px; font-weight: 700; color: var(--navy); margin-bottom: 4px; }
.rnk-podium-count { font-size: 28px; font-weight: 800; color: var(--navy); line-height: 1; }
.rnk-podium-label { font-size: 11px; color: var(--text-muted); }
.rnk-podium-base  { margin-top: 8px; font-size: 12px; color: var(--text-muted); padding: 6px 0; }

/* ── Rankings Sidebar ── */
.rnk-sidebar { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 80px; }
.rnk-side-card { background: #fff; border-radius: 12px; padding: 18px 18px 16px;
                 box-shadow: 0 1px 4px rgba(0,0,0,.07); }
.rnk-side-title { font-size: 13px; font-weight: 700; color: var(--navy); margin-bottom: 10px;
                  display: flex; align-items: center; gap: 7px; }
.rnk-side-title i { color: var(--gold); }
.rnk-side-text  { font-size: 12px; color: var(--text-muted); line-height: 1.6; margin: 0 0 10px; }
.rnk-side-meta  { font-size: 11px; color: var(--text-faint); display: flex; flex-direction: column; gap: 4px; }
.rnk-side-meta i { color: var(--gold); margin-right: 5px; }

.rnk-side-q-links { display: flex; flex-direction: column; gap: 6px; }
.rnk-side-q-link  { display: flex; align-items: center; gap: 10px; padding: 8px 10px;
                    border-radius: 6px; background: var(--bg-light); text-decoration: none;
                    transition: background .14s; }
.rnk-side-q-link:hover { background: var(--bg-mid); }
.rnk-side-q-label { font-size: 13px; font-weight: 800; width: 22px; }
.rnk-side-q-desc  { font-size: 11px; color: var(--text-muted); }

.rnk-side-field-row { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.rnk-side-field-name { font-size: 11px; color: var(--text-body); flex: 1; }
.rnk-side-field-cnt  { font-size: 12px; font-weight: 700; color: var(--navy); }
.rnk-side-field-row .rnk-score-bar-bg { width: 100%; flex-basis: 100%; margin-top: 0; }

.rnk-side-cta { text-align: center; }
.rnk-side-cta-icon { font-size: 28px; color: var(--gold); margin-bottom: 8px; display: block; }
.rnk-side-cta .rnk-side-title { justify-content: center; }
.rnk-side-cta-btn { display: block; margin-top: 12px; padding: 10px; background: var(--navy);
                    color: #fff; text-decoration: none; border-radius: 8px; font-size: 13px; font-weight: 600;
                    transition: background .15s; }
.rnk-side-cta-btn:hover { background: var(--navy-dark); }

@media (max-width: 1024px) {
    .rnk-layout          { grid-template-columns: 1fr; }
    .rnk-sidebar         { position: static; }
    .rnk-quartile-overview { grid-template-columns: repeat(2,1fr); }
    .page-hero-stats     { flex-wrap: wrap; }
}
@media (max-width: 640px) {
    .rnk-tabs            { overflow-x: auto; padding-bottom: 2px; }
    .rnk-tab             { padding: 10px 14px; white-space: nowrap; }
    .rnk-quartile-overview { grid-template-columns: 1fr 1fr; }
    .rnk-hero .page-hero-inner { flex-direction: column; }
}

/* ============================================================
   SUBMIT PAGE
   ============================================================ */

.sub-hero { background: var(--navy) url('/ams/assets/img/59699.jpg') center center / cover no-repeat; padding: 44px 0 40px; }
.sub-hero .page-hero-title { color: #fff; font-size: 30px; font-weight: 700; margin: 8px 0; }
.sub-hero .page-hero-sub   { color: rgba(255,255,255,.65); font-size: 14px; max-width: 560px; margin: 0; }
.sub-hero .page-breadcrumb a     { color: rgba(255,255,255,.5); }
.sub-hero .page-breadcrumb span  { color: rgba(255,255,255,.8); }
.sub-hero .page-breadcrumb .fa-chevron-right { color: rgba(255,255,255,.3); }

.sub-trust-row  { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 20px; }
.sub-trust-item { display: flex; align-items: center; gap: 7px; font-size: 12px; color: rgba(255,255,255,.7); }
.sub-trust-item i { color: var(--gold); font-size: 13px; }

/* Body */
.sub-body { padding: 36px 0 60px; }

/* Layout */
.sub-layout { display: grid; grid-template-columns: 1fr 300px; gap: 28px; align-items: start; }

/* Steps indicator */
.sub-steps { display: flex; align-items: center; margin-bottom: 28px; }
.sub-step  { display: flex; flex-direction: column; align-items: center; gap: 5px; }
.sub-step-num { width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--border-mid);
                display: flex; align-items: center; justify-content: center;
                font-size: 13px; font-weight: 700; color: var(--text-muted);
                transition: background .2s, color .2s, border-color .2s; }
.sub-step-label { font-size: 11px; color: var(--text-muted); white-space: nowrap; font-weight: 500; }
.sub-step.active .sub-step-num    { background: var(--navy); border-color: var(--navy); color: #fff; }
.sub-step.active .sub-step-label  { color: var(--navy); font-weight: 700; }
.sub-step.completed .sub-step-num { background: var(--teal-mid); border-color: var(--teal-mid); color: #fff; }
.sub-step-line { flex: 1; height: 2px; background: var(--border-light); margin: 0 8px 18px; }

/* Card */
.sub-card { background: #fff; border-radius: 14px; padding: 28px; box-shadow: 0 1px 6px rgba(0,0,0,.07); }
.sub-pane { display: none; }
.sub-pane.active { display: block; }

.sub-card-head { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; padding-bottom: 18px;
                 border-bottom: 1px solid var(--border-light); }
.sub-card-head > i { font-size: 22px; color: var(--gold); }
.sub-card-label { font-size: 11px; color: var(--text-faint); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }
.sub-card-title { font-size: 18px; font-weight: 700; color: var(--navy); margin-top: 2px; }

/* Form grid */
.sub-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.sub-field-full { grid-column: 1/-1; }
.sub-field { display: flex; flex-direction: column; gap: 5px; }
.sub-label { font-size: 12px; font-weight: 700; color: var(--navy); }
.sub-req   { color: #e53935; }
.sub-hint  { font-size: 11px; color: var(--text-faint); }
.sub-error { font-size: 11px; color: #d32f2f; display: none; }
.sub-input { padding: 10px 13px; border: 1.5px solid var(--border-mid); border-radius: 8px;
             font-family: 'Cairo', sans-serif; font-size: 13px; color: var(--navy);
             background: #fff; transition: border-color .15s, box-shadow .15s; outline: none; }
.sub-input:focus    { border-color: var(--navy); box-shadow: 0 0 0 3px rgba(26,46,74,.1); }
.sub-input-err      { border-color: #d32f2f !important; }
.sub-select         { cursor: pointer; }
.sub-textarea       { resize: vertical; min-height: 80px; }

/* Pane footer */
.sub-pane-footer { display: flex; justify-content: space-between; align-items: center; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border-light); }
.sub-next-btn { padding: 11px 24px; background: var(--navy); color: #fff; border: none; border-radius: 8px;
                font-family: 'Cairo', sans-serif; font-size: 13px; font-weight: 700; cursor: pointer;
                display: flex; align-items: center; gap: 8px; transition: background .15s; }
.sub-next-btn:hover { background: var(--navy-dark); }
.sub-back-btn { padding: 10px 18px; background: transparent; border: 1.5px solid var(--border-mid);
                color: var(--text-muted); border-radius: 8px; font-family: 'Cairo', sans-serif;
                font-size: 13px; font-weight: 600; cursor: pointer; display: flex; align-items: center; gap: 7px;
                transition: border-color .15s, color .15s; }
.sub-back-btn:hover { border-color: var(--navy); color: var(--navy); }

/* Packages */
.sub-pkg-grid    { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.sub-pkg-card    { border: 2px solid var(--border-light); border-radius: 12px; padding: 20px;
                   cursor: pointer; transition: border-color .15s, box-shadow .15s; position: relative; }
.sub-pkg-card:hover     { border-color: var(--navy-light); box-shadow: 0 4px 14px rgba(0,0,0,.09); }
.sub-pkg-card.sub-pkg-selected { border-color: var(--navy); box-shadow: 0 0 0 3px rgba(26,46,74,.12); }
.sub-pkg-featured        { border-color: var(--gold); }
.sub-pkg-featured:hover  { border-color: var(--gold); }
.sub-pkg-selected.sub-pkg-featured { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(201,168,76,.2); }

.sub-pkg-badge  { position: absolute; top: -11px; left: 50%; transform: translateX(-50%);
                  background: var(--gold); color: #fff; font-size: 10px; font-weight: 700;
                  padding: 3px 12px; border-radius: 10px; white-space: nowrap; }
.sub-pkg-name   { font-size: 15px; font-weight: 800; color: var(--navy); margin-bottom: 8px; }
.sub-pkg-price  { margin-bottom: 16px; }
.sub-pkg-currency { font-size: 12px; font-weight: 700; color: var(--text-muted); vertical-align: super; }
.sub-pkg-amount   { font-size: 34px; font-weight: 800; color: var(--navy); }
.sub-pkg-period   { font-size: 11px; color: var(--text-faint); }
.sub-pkg-features { list-style: none; padding: 0; margin: 0 0 16px; display: flex; flex-direction: column; gap: 7px; }
.sub-pkg-features li { font-size: 12px; color: var(--text-body); display: flex; align-items: flex-start; gap: 7px; }
.sub-pkg-features li i { color: var(--teal-mid); font-size: 10px; margin-top: 2px; flex-shrink: 0; }
.sub-pkg-select-btn { text-align: center; padding: 8px; border-radius: 7px; font-size: 12px; font-weight: 700;
                      color: var(--navy); border: 1.5px solid var(--navy); transition: background .15s, color .15s; }
.sub-pkg-card.sub-pkg-selected .sub-pkg-select-btn { background: var(--navy); color: #fff; }
.sub-pkg-error { font-size: 12px; color: #d32f2f; }

/* Review */
.sub-review-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 20px; }
.sub-review-row  { display: flex; flex-direction: column; gap: 3px; }
.sub-review-label { font-size: 11px; font-weight: 700; color: var(--text-faint); text-transform: uppercase; letter-spacing: .05em; }
.sub-review-val   { font-size: 13px; color: var(--navy); font-weight: 500; }

.sub-order-row  { display: flex; justify-content: space-between; align-items: center;
                  padding: 16px 18px; background: var(--bg-light); border-radius: 10px; margin-bottom: 20px; }
.sub-order-label { font-size: 14px; font-weight: 700; color: var(--navy); }
.sub-order-total { font-size: 24px; font-weight: 800; color: var(--navy); }

.sub-stripe-note { display: flex; align-items: flex-start; gap: 14px; padding: 14px 16px;
                   background: #f0f7ff; border: 1px solid #d0e7ff; border-radius: 10px; margin-bottom: 16px; }
.sub-stripe-icon { font-size: 28px; color: #635bff; flex-shrink: 0; }
.sub-stripe-note strong { font-size: 13px; color: var(--navy); }
.sub-stripe-note p { font-size: 12px; color: var(--text-muted); margin: 4px 0 0; }

.sub-dev-notice { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px;
                  background: #fffbeb; border: 1px solid #fcd34d; border-radius: 8px;
                  font-size: 12px; color: #78350f; margin-bottom: 14px; }
.sub-dev-notice i { color: #d97706; flex-shrink: 0; margin-top: 2px; }
.sub-dev-notice code { background: rgba(0,0,0,.07); padding: 1px 5px; border-radius: 4px; }

.sub-server-error { display: flex; align-items: center; gap: 8px; padding: 12px 14px;
                    background: #fff0f0; border: 1px solid #fca5a5; border-radius: 8px;
                    font-size: 12px; color: #7f1d1d; margin-bottom: 14px; }

.sub-pay-btn { padding: 13px 28px; background: var(--gold); color: var(--navy); border: none; border-radius: 8px;
               font-family: 'Cairo', sans-serif; font-size: 15px; font-weight: 800; cursor: pointer;
               display: flex; align-items: center; gap: 9px; transition: background .15s, opacity .15s; }
.sub-pay-btn:hover    { background: #b8963f; }
.sub-pay-btn:disabled { opacity: .6; cursor: not-allowed; }

/* Sidebar */
.sub-sidebar    { display: flex; flex-direction: column; gap: 18px; position: sticky; top: 80px; }
.sub-side-card  { background: #fff; border-radius: 12px; padding: 20px 20px 18px; box-shadow: 0 1px 4px rgba(0,0,0,.07); }
.sub-side-title { font-size: 14px; font-weight: 700; color: var(--navy); margin-bottom: 14px; }

.sub-why-list   { display: flex; flex-direction: column; gap: 14px; }
.sub-why-item   { display: flex; gap: 12px; }
.sub-why-icon   { font-size: 18px; flex-shrink: 0; margin-top: 2px; }
.sub-why-item strong { display: block; font-size: 13px; color: var(--navy); margin-bottom: 3px; }
.sub-why-item p      { font-size: 12px; color: var(--text-muted); margin: 0; line-height: 1.5; }

/* Timeline */
.sub-timeline   { display: flex; flex-direction: column; }
.sub-tl-item    { display: flex; gap: 12px; padding-bottom: 14px; position: relative; }
.sub-tl-item:not(:last-child)::before { content:''; position: absolute; left: 7px; top: 16px;
    width: 2px; height: calc(100% - 4px); background: var(--border-light); }
.sub-tl-dot     { width: 16px; height: 16px; border-radius: 50%; background: var(--gold);
                  border: 3px solid #fff; box-shadow: 0 0 0 2px var(--gold);
                  flex-shrink: 0; margin-top: 1px; }
.sub-tl-item strong { font-size: 13px; color: var(--navy); display: block; margin-bottom: 2px; }
.sub-tl-item p      { font-size: 12px; color: var(--text-muted); margin: 0; }

.sub-contact-link { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--navy);
                    font-weight: 600; text-decoration: none; }
.sub-contact-link:hover { color: var(--gold); }

/* Success / cancelled */
.sub-success-card { max-width: 600px; margin: 0 auto 40px; background: #fff; border-radius: 16px;
                    padding: 48px 36px; text-align: center; box-shadow: 0 2px 20px rgba(0,0,0,.08); }
.sub-success-icon { font-size: 64px; color: var(--teal-mid); margin-bottom: 16px; }
.sub-success-card h2 { font-size: 26px; color: var(--navy); margin: 0 0 12px; }
.sub-success-card p  { font-size: 14px; color: var(--text-muted); max-width: 400px; margin: 0 auto 28px; }

.sub-success-steps { display: flex; align-items: center; justify-content: center; gap: 8px;
                     flex-wrap: wrap; margin-bottom: 28px; }
.sub-suc-step  { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--navy); font-weight: 600; }
.sub-suc-num   { width: 22px; height: 22px; border-radius: 50%; background: var(--navy); color: #fff;
                 font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.sub-suc-arrow { color: var(--text-faint); font-size: 11px; }
.sub-success-btn { display: inline-block; padding: 12px 28px; background: var(--navy); color: #fff;
                   border-radius: 8px; text-decoration: none; font-size: 14px; font-weight: 700; }

.sub-cancelled-card { max-width: 440px; margin: 0 auto 40px; background: #fff; border-radius: 14px;
                      padding: 36px; text-align: center; box-shadow: 0 2px 12px rgba(0,0,0,.07); }
.sub-cancelled-icon { font-size: 48px; color: #e53935; margin-bottom: 12px; display: block; }
.sub-cancelled-card h3 { font-size: 20px; color: var(--navy); margin: 0 0 10px; }
.sub-cancelled-card p  { font-size: 13px; color: var(--text-muted); margin: 0; }

@media (max-width: 1024px) {
    .sub-layout    { grid-template-columns: 1fr; }
    .sub-sidebar   { position: static; }
    .sub-pkg-grid  { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
    .sub-form-grid { grid-template-columns: 1fr; }
    .sub-pkg-grid  { grid-template-columns: 1fr; }
    .sub-review-grid { grid-template-columns: 1fr; }
    .sub-steps     { overflow-x: auto; }
    .sub-step-label { display: none; }
}

/* Submit success confirmation details */
.sub-conf-details { background: var(--bg-light); border-radius: 10px; padding: 16px 20px;
                    margin-bottom: 24px; text-align: left; }
.sub-conf-row     { display: flex; justify-content: space-between; align-items: center;
                    padding: 8px 0; border-bottom: 1px solid var(--border-light); }
.sub-conf-row:last-child { border-bottom: none; }
.sub-conf-label   { font-size: 12px; color: var(--text-muted); font-weight: 600; }
.sub-conf-val     { font-size: 13px; color: var(--navy); font-weight: 600; }
.sub-conf-paid    { color: var(--teal-mid) !important; display: flex; align-items: center; gap: 5px; }

/* Submit — ISSN lookup step */
.sub-intro-text { font-size: 13px; color: var(--text-muted); line-height: 1.7; margin: 0 0 24px; }

.sub-issn-lookup-row  { margin-bottom: 16px; }
.sub-issn-input-wrap  { max-width: 420px; }
.sub-issn-bar         { display: flex; gap: 10px; margin: 6px 0 4px; }
.sub-issn-field       { flex: 1; font-size: 18px; letter-spacing: .08em; font-weight: 700; }
.sub-issn-btn         { padding: 10px 20px; background: var(--navy); color: #fff; border: none; border-radius: 8px;
                        font-family: 'Cairo', sans-serif; font-size: 13px; font-weight: 700; cursor: pointer;
                        white-space: nowrap; transition: background .15s; }
.sub-issn-btn:hover   { background: var(--navy-dark); }
.sub-issn-btn:disabled { opacity: .6; cursor: not-allowed; }

.sub-issn-status      { padding: 12px 16px; border-radius: 8px; font-size: 13px; margin-top: 12px; }
.sub-issn-success     { background: #e8f5ee; border: 1px solid #a3d9b8; color: #0a5c35; }
.sub-issn-error       { background: #fef2f2; border: 1px solid #fca5a5; color: #7f1d1d; }
.sub-issn-warn        { background: #fffbeb; border: 1px solid #fcd34d; color: #78350f; }

.sub-source-badge     { display: flex; align-items: center; gap: 9px; padding: 10px 14px;
                        background: #e8f5ee; border: 1px solid #a3d9b8; border-radius: 8px;
                        font-size: 12px; color: #0a5c35; margin-bottom: 20px; }
.sub-source-badge i   { flex-shrink: 0; }

/* 5-step indicator override */
.sub-steps { gap: 0; }
.sub-step-label { font-size: 10px; }

/* ISSN found preview card */
.sub-issn-preview    { margin-top: 16px; border: 1.5px solid #a3d9b8; border-radius: 10px; overflow: hidden; }
.sub-preview-head    { display: flex; align-items: center; gap: 9px; padding: 11px 16px;
                       background: #e8f5ee; font-size: 13px; font-weight: 600; color: #0a5c35; }
.sub-preview-check   { color: #0a5c35; font-size: 15px; }
.sub-preview-grid    { padding: 4px 0; }
.sub-preview-row     { display: flex; align-items: baseline; gap: 12px;
                       padding: 9px 16px; border-bottom: 1px solid #e8f5ee; }
.sub-preview-row:last-child { border-bottom: none; }
.sub-preview-label   { font-size: 11px; font-weight: 700; color: var(--text-muted);
                       text-transform: uppercase; letter-spacing: .04em; min-width: 100px; flex-shrink: 0; }
.sub-preview-val     { font-size: 13px; color: var(--navy); font-weight: 500; }
.sub-preview-source  { padding: 8px 16px; background: #f6fdf9; font-size: 11px; color: var(--text-faint);
                       border-top: 1px solid #e8f5ee; }

/* ============================================================
   AUTHORS LISTING PAGE
   ============================================================ */
/* ══════════════════════════════════════════════════════════
   AUTHORS PAGE
══════════════════════════════════════════════════════════ */

/* Layout */
.authors-layout {
    display: grid;
    grid-template-columns: 240px 1fr;
    align-items: start;
    min-width: 0;
}
.authors-layout > * { min-width: 0; }
.authors-sidebar {
    padding: 1.6rem 1.4rem;
    border-right: 1px solid #e8edf2;
    position: sticky; top: 0;
    max-height: 100vh; overflow-y: auto;
}
.authors-main { padding: 1.6rem 1.6rem 2.5rem; }

/* Toolbar */
.au-toolbar {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 1.4rem; padding-bottom: .8rem;
    border-bottom: 1px solid #e8edf2;
}
.au-count { font-size: 13px; font-weight: 700; color: var(--navy); }
.au-count em { font-style: normal; color: var(--gold-text); }
.au-clear-all {
    display: inline-flex; align-items: center; gap: 5px;
    font-size: 12px; color: var(--text-muted); text-decoration: none;
    background: #f0f4f8; padding: 5px 12px; border-radius: 50px;
    transition: background .2s, color .2s;
}
.au-clear-all:hover { background: #e0e6ee; color: var(--navy); }

/* Author grid */
.au-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 12px;
}

/* Author card */
.au-card {
    background: #fff; border: 1px solid #e8edf2;
    border-radius: 16px; padding: 1.2rem;
    text-decoration: none; color: inherit;
    display: flex; flex-direction: column; gap: .9rem;
    transition: box-shadow .2s, transform .2s, border-color .2s;
}
.au-card:hover { box-shadow: 0 6px 24px rgba(0,0,0,.09); transform: translateY(-3px); border-color: var(--gold-text); color: inherit; }
.au-card--paper { border-style: dashed; }
.au-card--paper:hover { border-style: solid; }

.au-card-top { display: flex; align-items: flex-start; gap: 10px; }
.au-rank {
    font-size: 11px; font-weight: 900; color: rgba(255,255,255,.7);
    background: var(--navy); border-radius: 6px;
    width: 26px; height: 26px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
}
.au-avatar {
    width: 44px; height: 44px; border-radius: 50%; flex-shrink: 0;
    background: linear-gradient(135deg, var(--navy), #1a3a5c);
    color: var(--gold); font-size: 14px; font-weight: 900;
    display: flex; align-items: center; justify-content: center;
}
.au-card-info { min-width: 0; flex: 1; }
.au-name  { font-size: 13px; font-weight: 800; color: var(--navy); line-height: 1.3; margin-bottom: 3px; }
.au-affil { font-size: 11px; color: var(--text-muted); margin-bottom: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.au-field-tag {
    display: inline-block; font-size: 10px; font-weight: 700;
    background: #f0f4f8; border: 1px solid #e8edf2;
    color: var(--navy); padding: 2px 9px; border-radius: 50px;
}
.au-field-tag--muted { background: #faf6ec; border-color: #f0e4b0; color: var(--gold-text); }

/* Metrics row */
.au-card-metrics {
    display: flex; align-items: center; justify-content: space-around;
    background: #f9fafc; border-radius: 10px; padding: .7rem .5rem;
}
.au-metric { text-align: center; }
.au-metric-val   { display: block; font-size: 17px; font-weight: 900; color: var(--navy); letter-spacing: -.5px; }
.au-metric-h     { color: #6c47d1; }
.au-metric-label { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .3px; }
.au-metric-divider { width: 1px; height: 28px; background: #e8edf2; }

/* ORCID row */
.au-orcid { font-size: 10px; color: var(--text-muted); display: flex; align-items: center; gap: 5px; }
.au-orcid i { color: #a6ce39; }

/* Shared sidebar filter components (reused on papers, authors, journals) */
.filter-search-wrap {
    display: flex; align-items: center; gap: 8px;
    background: #f4f5f7; border: 1px solid #e8edf2;
    border-radius: 50px; padding: 9px 16px;
    margin-bottom: 1.2rem;
    transition: border-color .2s, box-shadow .2s;
}
.filter-search-wrap:focus-within { border-color: var(--gold-text); box-shadow: 0 0 0 3px rgba(180,130,40,.1); }
.filter-search-wrap i { color: var(--text-faint); font-size: 13px; flex-shrink: 0; }
.filter-search-wrap input { flex: 1; background: transparent; border: none; outline: none; font-size: 13px; font-family: "Cairo",sans-serif; color: var(--navy); }
.filter-search-wrap input::placeholder { color: var(--text-muted); }
.filter-clear-icon { color: var(--text-faint); font-size: 13px; text-decoration: none; transition: color .15s; }
.filter-clear-icon:hover { color: var(--navy); }

.filter-section { margin-bottom: 1.4rem; }
.filter-section-title {
    font-size: 10px; font-weight: 800; color: var(--text-faint);
    text-transform: uppercase; letter-spacing: 1px;
    margin-bottom: .6rem;
}
.filter-sort-opt {
    display: flex; align-items: center; gap: 8px;
    font-size: 13px; color: var(--text-mid); text-decoration: none;
    padding: 5px 0; transition: color .15s;
}
.filter-sort-opt i { font-size: 11px; color: var(--text-faint); }
.filter-sort-opt.active { color: var(--navy); font-weight: 700; }
.filter-sort-opt.active i { color: var(--gold-text); }

.filter-opt {
    display: flex; align-items: center; justify-content: space-between;
    font-size: 12px; color: var(--text-mid); text-decoration: none;
    padding: 5px 8px; border-radius: 8px; transition: background .15s, color .15s;
}
.filter-opt:hover { background: #f4f5f7; color: var(--navy); }
.filter-opt.active { background: #f0f4f8; color: var(--navy); font-weight: 700; }
.filter-opt-cnt {
    font-size: 11px; color: var(--text-faint);
    background: #e8edf2; padding: 1px 7px; border-radius: 50px;
}

.filter-check-row {
    display: flex; align-items: center; gap: 8px;
    font-size: 12px; color: var(--text-mid); padding: 4px 0; cursor: pointer;
}
.filter-check-row input { accent-color: var(--gold-text); width: 14px; height: 14px; }

.filter-apply-btn {
    width: 100%; background: var(--navy); color: #fff;
    border: none; padding: 11px; border-radius: 50px;
    font-size: 13px; font-weight: 700; cursor: pointer;
    font-family: "Cairo",sans-serif; margin-top: .5rem;
    transition: background .2s;
}
.filter-apply-btn:hover { background: var(--gold-text); }
.filter-clear-btn {
    display: block; text-align: center;
    font-size: 12px; color: #e85d2f; text-decoration: none;
    margin-top: .6rem; padding: 8px;
    border: 1px solid #f0b8a0; background: #fdf0ec; border-radius: 50px;
    transition: background .2s;
}
.filter-clear-btn:hover { background: #f5d9d0; }

/* Responsive */
@media (max-width: 991px) {
    .authors-layout { grid-template-columns: 1fr; }
    .authors-sidebar { position: static; max-height: none; border-right: none; border-bottom: 1px solid #e8edf2; }
    .au-grid { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
}
@media (max-width: 576px) {
    .au-grid { grid-template-columns: 1fr; }
}


/* ── NEWS MAGAZINE LAYOUT ─────────────────────────────────────── */
.news-featured-row { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px; }
.news-featured-row > * { min-width:0; }
.news-right-stack { display:flex; flex-direction:column; gap:20px; }
.news-card-featured { position:relative; border-radius:16px; overflow:hidden; min-height:420px; display:flex; flex-direction:column; justify-content:flex-end; cursor:pointer; text-decoration:none; }
.news-card-featured img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.news-card-featured-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(5,15,40,.85) 40%, rgba(5,15,40,.1) 100%); }
.news-card-featured-body { position:relative; z-index:2; padding:1.8rem; }
.news-card-featured-cat { display:inline-block; background:rgba(255,255,255,.18); backdrop-filter:blur(4px); color:#fff; font-size:10px; font-weight:800; letter-spacing:.8px; text-transform:uppercase; padding:4px 12px; border-radius:50px; margin-bottom:.8rem; }
.news-card-featured-title { color:#fff; font-size:1.4rem; font-weight:800; line-height:1.3; margin:0 0 .6rem; }
.news-card-featured-meta { color:rgba(255,255,255,.7); font-size:12px; }
.news-card-featured-meta strong { color:rgba(255,255,255,.9); }
.news-card-featured--nophoto { background:var(--navy); }
.news-card-sm { border-radius:14px; overflow:hidden; background:#fff; box-shadow:0 2px 12px rgba(10,30,70,.07); text-decoration:none; display:flex; flex-direction:column; flex:1; cursor:pointer; transition:box-shadow .2s; }
.news-card-sm:hover { box-shadow:0 6px 28px rgba(10,30,70,.13); }
.news-card-sm-img { height:190px; overflow:hidden; background:#e8edf5; flex-shrink:0; }
.news-card-sm-img img { width:100%; height:100%; object-fit:cover; }
.news-card-sm-img-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:2rem; opacity:.25; }
.news-card-sm-body { padding:1rem 1.2rem 1.2rem; display:flex; flex-direction:column; flex:1; }
.news-card-sm-cat { font-size:10px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; color:var(--gold-text); margin-bottom:.5rem; }
.news-card-sm-title { font-size:1rem; font-weight:800; color:var(--navy); line-height:1.35; margin:0 0 .6rem; }
.news-card-sm-meta { font-size:12px; color:var(--text-muted); margin-top:auto; }
.news-card-sm-meta strong { color:var(--text-mid); font-weight:700; }
.news-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.news-grid > * { min-width:0; }
.news-detail-image { width:100%; max-height:480px; object-fit:cover; border-radius:16px; display:block; margin-bottom:2rem; }
.news-detail-body { font-size:1.05rem; line-height:1.8; color:var(--text-mid); }
.news-detail-body h2,.news-detail-body h3 { color:var(--navy); margin-top:1.8rem; }
.news-detail-body p { margin-bottom:1.2rem; }
@media(max-width:900px){
  .news-featured-row { grid-template-columns:1fr; }
  .news-right-stack { flex-direction:row; }
  .news-grid { grid-template-columns:1fr 1fr; }
}
@media(max-width:600px){
  .news-right-stack { flex-direction:column; }
  .news-grid { grid-template-columns:1fr; }
}
