/* ==========================================================================
   THEMES (4 Variations)
   ========================================================================== */
:root {
    /* Base settings updated dynamically via JS */
    --fr-article-font: 'Sahel', 'Bidad', 'Shabnam', sans-serif;
    --fr-article-size: 18px;
    --fr-article-align: justify;
}

/* 1. Light - Classic (Default) */
html[data-theme="light-1"] {
    --fr-bg: #ffffff;
    --fr-surface: #f8fafc;
    --fr-border: #e2e8f0;
    --fr-text: #1e293b;
    --fr-muted: #64748b;
    --fr-accent: #0C4DED;
    --fr-tooltip-bg: #1e293b;
    --fr-tooltip-text: #ffffff;
    --fr-surface-rgb: 248, 250, 252;
}
/* 2. Light - Warm/Sepia */
html[data-theme="light-2"] {
    --fr-bg: #fdf6e3;
    --fr-surface: #eee8d5;
    --fr-border: #dcdad1;
    --fr-text: #3c3b37;
    --fr-muted: #837a67;
    --fr-accent: #b58900;
    --fr-tooltip-bg: #3c3b37;
    --fr-tooltip-text: #fdf6e3;
    --fr-surface-rgb: 238, 232, 213;
}
/* 3. Dark - Modern Slate */
html[data-theme="dark-1"] {
    --fr-bg: #0f172a;
    --fr-surface: #1e293b;
    --fr-border: #334155;
    --fr-text: #dbe3ee;
    --fr-muted: #94a3b8;
    --fr-accent: #60a5fa;
    --fr-tooltip-bg: #f1f5f9;
    --fr-tooltip-text: #0f172a;
    --fr-surface-rgb: 30, 41, 59;
}
/* 4. Dark - OLED Minimal */
html[data-theme="dark-2"] {
    --fr-bg: #000000;
    --fr-surface: #111111;
    --fr-border: #222222;
    --fr-text: #e5e5e5;
    --fr-muted: #888888;
    --fr-accent: #ffffff;
    --fr-tooltip-bg: #e5e5e5;
    --fr-tooltip-text: #000000;
    --fr-surface-rgb: 17, 17, 17;
}


/* ==========================================================================
   LOCAL FONTS
   Put Bidad files in: /wp-content/themes/hello-elementor-child/assets/fonts/
   Expected names: Bidad-Regular.woff2/.woff, Bidad-SemiBold.woff2/.woff,
   Bidad-ExtraBold.woff2/.woff. Add more weights with the same pattern if needed.
   ========================================================================== */
@font-face {
    font-family: 'Bidad';
    src: url('fonts/Bidad-Regular.woff2') format('woff2'), url('fonts/Bidad-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Bidad';
    src: url('fonts/Bidad-SemiBold.woff2') format('woff2'), url('fonts/Bidad-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Bidad';
    src: url('fonts/Bidad-ExtraBold.woff2') format('woff2'), url('fonts/Bidad-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Sahel';
    src: url('fonts/Sahel.woff2') format('woff2'), url('fonts/Sahel.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Sahel';
    src: url('fonts/Sahel-SemiBold.woff2') format('woff2'), url('fonts/Sahel-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Sahel';
    src: url('fonts/Sahel-Bold.woff2') format('woff2'), url('fonts/Sahel-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Shabnam';
    src: url('fonts/Shabnam.woff2') format('woff2'), url('fonts/Shabnam.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Shabnam';
    src: url('fonts/Shabnam-Medium.woff2') format('woff2'), url('fonts/Shabnam-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Shabnam';
    src: url('fonts/Shabnam-Bold.woff2') format('woff2'), url('fonts/Shabnam-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* ==========================================================================
   BASE STYLES & HEADER
   ========================================================================== */
body.frontiers-article-template {
    background-color: var(--fr-bg);
    color: var(--fr-text);
    font-family: var(--fr-article-font) !important;
    transition: background-color 0.3s, color 0.3s;
}

/* Header Cleanup (Slim, polished, frosted glass) */
body.frontiers-article-template header {
    height: 56px !important;
    min-height: 56px !important;
    padding: 0 1rem !important;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--fr-border) !important;
    background: rgba(var(--fr-surface-rgb, 255, 255, 255), 0.8) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 100;
}
body.frontiers-article-template header > div.elementor-container > div:nth-child(n+2),
body.frontiers-article-template header section:nth-child(n+2) {
    display: none !important; /* Hides duplicate sub-bars */
}

/* Override existing page TOCs from Elementor to prevent duplication */
body.frontiers-article-template .elementor-widget-table-of-contents {
    display: none !important;
}

/* ==========================================================================
   TYPOGRAPHY
   ========================================================================== */
.fr-article-body {
    font-size: var(--fr-article-size);
    text-align: var(--fr-article-align);
    line-height: 1.9;
}
.fr-article-body, .fr-article-body p, .fr-article-body li, .fr-article-body span:not(.fr-label) {
    font-weight: 400 !important;
}
.fr-article-body strong, .fr-article-body b {
    font-weight: 700 !important;
}
.fr-article-body h1, .fr-article-body h2, .fr-article-body h3 {
    font-weight: 700 !important;
    color: var(--fr-text);
    margin-top: 2.5em;
    margin-bottom: 1em;
    scroll-margin-top: 80px;
}
.fr-article-body a {
    color: var(--fr-accent) !important;
    text-decoration: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}
.fr-article-body a:hover {
    color: var(--fr-accent) !important;
    text-decoration: none !important;
    border-bottom: none !important;
}

/* ==========================================================================
   LAYOUT GRID (RTL)
   ========================================================================== */
/* In RTL, column 1 is Right (TOC), column 2 is Center, column 3 is Left (Controls) */
.fr-layout-container {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr) 240px;
    gap: 2.5rem;
    max-width: 1500px;
    margin: 2rem auto;
    padding: 0 2rem;
    align-items: start;
}
.fr-sidebar-right,
.fr-sidebar-left {
    align-self: start;
    position: sticky;
    top: 80px;
    height: fit-content;
}
.fr-sticky-block {
    position: static;
    top: auto;
}

/* ==========================================================================
   RIGHT SIDEBAR (TOC)
   ========================================================================== */
.fr-sidebar-title {
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    border-bottom: 1px solid var(--fr-border);
    padding-bottom: 0.75rem;
    margin-bottom: 1rem;
    margin-top: 0 !important;
}
.fr-sidebar-title svg { width: 20px; color: var(--fr-accent); }
.fr-toc-scroll-area {
    max-height: calc(100vh - 150px);
    overflow-y: auto;
    padding-left: 10px; /* Space for scrollbar in RTL */
}
/* Custom Scrollbar for TOC */
.fr-toc-scroll-area::-webkit-scrollbar { width: 4px; }
.fr-toc-scroll-area::-webkit-scrollbar-track { background: transparent; }
.fr-toc-scroll-area::-webkit-scrollbar-thumb { background: var(--fr-border); border-radius: 4px; }

.fr-toc-nav { display: flex; flex-direction: column; gap: 0.5rem; }
.fr-toc-nav a {
    color: var(--fr-muted) !important;
    text-decoration: none !important;
    border: none !important;
    font-size: 0.9rem;
    padding: 0.4rem 0.75rem 0.4rem 0;
    border-right: 2px solid transparent !important;
    transition: all 0.2s;
    line-height: 1.5;
}
.fr-toc-nav a:hover { color: var(--fr-text) !important; }
.fr-toc-nav a.active {
    font-weight: 700 !important;
    color: var(--fr-accent) !important;
    border-right-color: var(--fr-accent) !important;
    background: linear-gradient(90deg, transparent, rgba(12,77,237,0.03));
}

/* ==========================================================================
   CENTER CONTENT (INFO CARD & TABLES)
   ========================================================================== */
.fr-info-card {
    background: var(--fr-surface);
    border: 1px solid var(--fr-border);
    border-radius: 12px;
    padding: 1.5rem;
    margin: 2rem 0;
}
.fr-info-grid { display: flex; flex-wrap: wrap; gap: 1.5rem; }
.fr-info-item { font-size: 0.9rem; }
.fr-label { font-weight: 500 !important; color: var(--fr-muted); }
.fr-value { color: var(--fr-text); }

/* Elegant Tables */
.fr-table-wrapper {
    overflow-x: auto;
    border: 1px solid var(--fr-border);
    border-radius: 8px;
    margin: 2rem 0;
    background: var(--fr-surface);
}
.fr-table-wrapper table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
    margin: 0 !important;
}
.fr-table-wrapper th, .fr-table-wrapper td {
    padding: 1rem;
    text-align: right;
    border-bottom: 1px solid var(--fr-border);
}
.fr-table-wrapper th {
    background-color: rgba(0,0,0,0.02);
    font-weight: 700 !important;
    color: var(--fr-text);
}
html[data-theme^="dark"] .fr-table-wrapper th { background-color: rgba(255,255,255,0.02); }
.fr-table-wrapper tr:last-child td { border-bottom: none; }
.fr-table-wrapper tbody tr:hover { background-color: rgba(12, 77, 237, 0.03); }
html[data-theme^="dark"] .fr-table-wrapper tbody tr:hover { background-color: rgba(255, 255, 255, 0.03); }

/* ==========================================================================
   LEFT SIDEBAR (CONTROLS & SETTINGS)
   ========================================================================== */
.fr-pdf-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 1rem;
    background: var(--fr-accent);
    color: #fff !important;
    border-radius: 8px;
    text-decoration: none !important;
    font-weight: 500 !important;
    margin-bottom: 1.5rem;
    transition: opacity 0.2s;
    border: none !important;
}
.fr-pdf-btn:hover { opacity: 0.9; }
.fr-pdf-btn svg { width: 20px; }

.fr-settings-card {
    background: var(--fr-surface);
    border: 1px solid var(--fr-border);
    border-radius: 12px;
    padding: 1.5rem;
}
.fr-settings-title {
    font-size: 1rem;
    margin-bottom: 1.5rem;
    margin-top: 0;
    color: var(--fr-text);
}
.fr-setting-group { margin-bottom: 1.2rem; }
.fr-setting-group:last-child { margin-bottom: 0; }
.fr-setting-group label {
    display: block;
    font-size: 0.8rem;
    color: var(--fr-muted);
    margin-bottom: 0.5rem;
}

/* Theme Swatches */
.fr-theme-swatches { display: flex; gap: 0.5rem; }
.fr-swatch {
    width: 28px; height: 28px;
    border-radius: 50%;
    border: 2px solid;
    cursor: pointer;
    transition: transform 0.2s;
}
.fr-swatch.active { transform: scale(1.15); box-shadow: 0 0 0 2px var(--fr-accent); }

/* Select & Buttons */
.fr-select {
    width: 100%;
    padding: 0.5rem;
    background: var(--fr-bg);
    color: var(--fr-text);
    border: 1px solid var(--fr-border);
    border-radius: 6px;
    font-family: inherit;
    font-size: 0.9rem;
}
.fr-stepper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--fr-bg);
    border: 1px solid var(--fr-border);
    border-radius: 6px;
    padding: 0.2rem;
}
.fr-stepper button {
    background: none; border: none;
    color: var(--fr-text);
    font-size: 1.2rem; cursor: pointer;
    width: 30px; height: 30px;
    border-radius: 4px;
}
.fr-stepper button:hover { background: var(--fr-surface); }
#fr-size-display { font-size: 0.9rem; font-weight: 500; }

.fr-align-toggles {
    display: flex; gap: 0.5rem;
}
.fr-align-btn {
    flex: 1; padding: 0.5rem;
    background: var(--fr-bg);
    border: 1px solid var(--fr-border);
    border-radius: 6px; color: var(--fr-text);
    cursor: pointer; display: flex; justify-content: center;
}
.fr-align-btn.active { background: var(--fr-surface); border-color: var(--fr-accent); color: var(--fr-accent); }
.fr-align-btn svg { width: 18px; }

/* ==========================================================================
   PROGRESS & TOOLTIPS
   ========================================================================== */
.fr-progress-bar {
    position: fixed; top: 0; left: 0; width: 100%; height: 3px;
    background: transparent; z-index: 9999;
}
.fr-progress-fill {
    height: 100%; width: 0%;
    background: var(--fr-accent); box-shadow: 0 0 8px var(--fr-accent);
}

.fr-tooltip {
    position: absolute; z-index: 10000;
    background: var(--fr-tooltip-bg); color: var(--fr-tooltip-text);
    padding: 6px 10px; border-radius: 6px;
    font-size: 0.8rem; max-width: 250px;
    pointer-events: none; opacity: 0;
    transform: translateY(10px); transition: 0.2s all;
}
.fr-tooltip.visible { opacity: 1; transform: translateY(0); }
[data-tooltip] { cursor: pointer; text-decoration: none !important; text-underline-offset: 0; border-bottom: none !important;}
a.fr-pdf-btn[data-tooltip], button[data-tooltip] { text-decoration: none !important; border-bottom: none !important; } /* Override underline for buttons */

/* ==========================================================================
   MOBILE overrides
   ========================================================================== */
.hidden-desktop,
.fr-sheet-overlay,
.fr-bottom-sheet { display: none !important; }

@media (min-width: 1025px) {
    .fr-sidebar-right, .fr-sidebar-left { display: block; }
}

@media (max-width: 1024px) {
    .hidden-mobile { display: none !important; }
    .hidden-desktop { display: flex !important; }
    .fr-layout-container { grid-template-columns: 1fr; padding: 1rem; }
    
    .fr-fab {
        position: fixed; bottom: 24px; left: 24px;
        width: 56px; height: 56px;
        border-radius: 50%; background: var(--fr-accent); color: #fff;
        border: none; box-shadow: 0 8px 16px rgba(0,0,0,0.2);
        z-index: 9000; align-items: center; justify-content: center; cursor: pointer;
    }
    .fr-fab svg { width: 28px; }

    .fr-sheet-overlay {
        display: block !important;
        position: fixed; inset: 0; background: rgba(0,0,0,0.5);
        z-index: 9998; opacity: 0; pointer-events: none; transition: 0.3s;
    }
    .fr-sheet-overlay.active { opacity: 1; pointer-events: auto; }
    
    .fr-bottom-sheet {
        display: flex !important;
        position: fixed; bottom: 0; left: 0; right: 0;
        background: var(--fr-surface); z-index: 9999;
        border-radius: 20px 20px 0 0; padding: 0;
        transform: translateY(100%); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        max-height: 85vh; display: flex; flex-direction: column;
    }
    .fr-bottom-sheet.active { transform: translateY(0); }
    
    .fr-sheet-header {
        display: flex; justify-content: space-between; align-items: center;
        border-bottom: 1px solid var(--fr-border); padding: 1rem 1.5rem;
    }
    .fr-sheet-tabs { display: flex; gap: 1rem; }
    .fr-tab-btn {
        background: none; border: none; color: var(--fr-muted); font-size: 1rem;
        padding: 0.5rem 0; cursor: pointer; border-bottom: 2px solid transparent;
    }
    .fr-tab-btn.active { color: var(--fr-accent); border-color: var(--fr-accent); font-weight: 700; }
    #fr-close-sheet { background: none; border: none; color: var(--fr-muted); padding: 0; }
    #fr-close-sheet svg { width: 24px; }
    
    .fr-sheet-content { padding: 1.5rem; overflow-y: auto; }
    .fr-tab-panel { display: none; }
    .fr-tab-panel.active { display: block; }
    
    .fr-pdf-btn-mobile {
        display: block; width: 100%; text-align: center; padding: 1rem;
        background: var(--fr-accent); color: #fff !important; border-radius: 8px;
        text-decoration: none; margin-bottom: 1.5rem; font-weight: 500;
    }
}

/* ==========================================================================
   FINAL SCOPED OVERRIDES / DARK-MODE HARDENING
   ========================================================================== */
html[data-theme] body.frontiers-article-template,
body.frontiers-article-template .fr-layout-container,
body.frontiers-article-template .fr-main-content,
body.frontiers-article-template .fr-article,
body.frontiers-article-template .site-main,
body.frontiers-article-template #content,
body.frontiers-article-template .page-content,
body.frontiers-article-template .entry-content,
body.frontiers-article-template .elementor,
body.frontiers-article-template .elementor-section,
body.frontiers-article-template .elementor-container,
body.frontiers-article-template .elementor-column,
body.frontiers-article-template .elementor-widget-wrap {
    background-color: var(--fr-bg) !important;
    color: var(--fr-text) !important;
}
body.frontiers-article-template .fr-article-title,
body.frontiers-article-template .fr-sidebar-title,
body.frontiers-article-template .fr-article-body,
body.frontiers-article-template .fr-article-body p,
body.frontiers-article-template .fr-article-body li,
body.frontiers-article-template .fr-article-body span,
body.frontiers-article-template .fr-article-body div,
body.frontiers-article-template .fr-article-body h1,
body.frontiers-article-template .fr-article-body h2,
body.frontiers-article-template .fr-article-body h3,
body.frontiers-article-template .fr-article-body h4,
body.frontiers-article-template .fr-article-body h5,
body.frontiers-article-template .fr-article-body h6,
body.frontiers-article-template .fr-table-wrapper td {
    color: var(--fr-text) !important;
}
body.frontiers-article-template header,
body.frontiers-article-template footer,
body.frontiers-article-template .site-header,
body.frontiers-article-template .site-footer {
    background-color: rgba(var(--fr-surface-rgb), 0.92) !important;
    color: var(--fr-text) !important;
    border-color: var(--fr-border) !important;
}
body.frontiers-article-template input,
body.frontiers-article-template select,
body.frontiers-article-template textarea,
body.frontiers-article-template button {
    font-family: var(--fr-article-font) !important;
}
body.frontiers-article-template a,
body.frontiers-article-template a:hover,
body.frontiers-article-template a:focus {
    text-decoration: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}
html[data-theme="dark-2"] .fr-pdf-btn { color: #000 !important; }


/* ==========================================================================
   REFINEMENTS 1.3.0: contrast, sticky header, typography, TOC hierarchy,
   and redesigned reading settings panel
   ========================================================================== */
body.frontiers-article-template {
    font-weight: 400 !important;
}
body.frontiers-article-template .fr-layout-container,
body.frontiers-article-template .fr-article,
body.frontiers-article-template .fr-article-body,
body.frontiers-article-template .fr-settings-card,
body.frontiers-article-template .fr-toc-nav,
body.frontiers-article-template .fr-pdf-btn {
    font-family: var(--fr-article-font) !important;
}
body.frontiers-article-template .fr-article-body,
body.frontiers-article-template .fr-article-body *:not(svg):not(path) {
    font-family: var(--fr-article-font) !important;
}
body.frontiers-article-template .fr-article-body,
body.frontiers-article-template .fr-article-body p,
body.frontiers-article-template .fr-article-body li,
body.frontiers-article-template .fr-article-body span:not(.fr-label),
body.frontiers-article-template .fr-article-body div {
    font-weight: 400 !important;
}
body.frontiers-article-template .fr-article-body h1,
body.frontiers-article-template .fr-article-body h2,
body.frontiers-article-template .fr-article-body h3,
body.frontiers-article-template .fr-article-body h4,
body.frontiers-article-template .fr-article-title {
    font-weight: 600 !important;
}
body.frontiers-article-template .fr-article-body strong,
body.frontiers-article-template .fr-article-body b {
    font-weight: 600 !important;
}

/* Header: sticky, compact on scroll, with explicit readable colors. */
body.frontiers-article-template header,
body.frontiers-article-template .site-header {
    position: sticky !important;
    top: 0 !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    background-color: rgba(var(--fr-surface-rgb), 0.96) !important;
    color: var(--fr-text) !important;
    border-color: var(--fr-border) !important;
    z-index: 9990 !important;
    transition: height .22s ease, min-height .22s ease, max-height .22s ease, background-color .22s ease, box-shadow .22s ease !important;
}
body.frontiers-article-template.fr-header-compact header,
body.frontiers-article-template.fr-header-compact .site-header {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .08) !important;
}
html[data-theme^="dark"] body.frontiers-article-template.fr-header-compact header,
html[data-theme^="dark"] body.frontiers-article-template.fr-header-compact .site-header {
    box-shadow: 0 8px 24px rgba(0, 0, 0, .38) !important;
}
body.frontiers-article-template header *,
body.frontiers-article-template .site-header *,
body.frontiers-article-template header a,
body.frontiers-article-template .site-header a,
body.frontiers-article-template header button,
body.frontiers-article-template .site-header button {
    color: var(--fr-text) !important;
    fill: currentColor !important;
}
body.frontiers-article-template header a:hover,
body.frontiers-article-template .site-header a:hover {
    color: var(--fr-accent) !important;
}
body.frontiers-article-template .fr-sidebar-right,
body.frontiers-article-template .fr-sidebar-left {
    top: 68px;
    transition: top .22s ease;
}
body.frontiers-article-template.fr-header-compact .fr-sidebar-right,
body.frontiers-article-template.fr-header-compact .fr-sidebar-left {
    top: 56px;
}
body.frontiers-article-template .fr-article-body h1,
body.frontiers-article-template .fr-article-body h2,
body.frontiers-article-template .fr-article-body h3,
body.frontiers-article-template .fr-article-body h4 {
    scroll-margin-top: 72px;
}

/* PDF button contrast: generic tooltip rules must never recolor button text. */
body.frontiers-article-template .fr-pdf-btn,
body.frontiers-article-template .fr-pdf-btn[data-tooltip],
body.frontiers-article-template .fr-pdf-btn span,
body.frontiers-article-template .fr-pdf-btn svg {
    color: #fff !important;
    stroke: currentColor !important;
}
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn,
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn[data-tooltip],
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn span,
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn svg {
    color: #050505 !important;
}
body.frontiers-article-template .fr-pdf-btn {
    border-radius: 999px;
    font-weight: 600 !important;
    box-shadow: 0 10px 24px rgba(12, 77, 237, .16);
}
html[data-theme^="dark"] body.frontiers-article-template .fr-pdf-btn {
    box-shadow: 0 10px 24px rgba(0, 0, 0, .35);
}

/* TOC hierarchy: h2/main entries are stronger, h3/subentries are lighter. */
body.frontiers-article-template .fr-toc-nav {
    gap: .35rem;
}
body.frontiers-article-template .fr-toc-nav a.fr-toc-h2 {
    font-size: .94rem;
    font-weight: 600 !important;
    color: var(--fr-text) !important;
    padding-top: .48rem;
    padding-bottom: .48rem;
}
body.frontiers-article-template .fr-toc-nav a.fr-toc-h3 {
    font-size: .84rem;
    font-weight: 400 !important;
    color: var(--fr-muted) !important;
    padding-right: 1.45rem !important;
    opacity: .92;
}
body.frontiers-article-template .fr-toc-nav a.active {
    font-weight: 700 !important;
    color: var(--fr-accent) !important;
    background: linear-gradient(90deg, transparent, rgba(12,77,237,0.06));
}
html[data-theme^="dark"] body.frontiers-article-template .fr-toc-nav a.active {
    background: linear-gradient(90deg, transparent, rgba(96,165,250,0.10));
}

/* Modern minimalist reading settings redesign. */
body.frontiers-article-template .fr-settings-card {
    position: relative;
    overflow: hidden;
    background: color-mix(in srgb, var(--fr-surface) 74%, var(--fr-bg)) !important;
    border: 1px solid color-mix(in srgb, var(--fr-border) 72%, transparent) !important;
    border-radius: 22px !important;
    padding: 1rem !important;
    box-shadow: 0 18px 44px rgba(15, 23, 42, .06);
}
html[data-theme^="dark"] body.frontiers-article-template .fr-settings-card {
    box-shadow: 0 18px 44px rgba(0, 0, 0, .28);
}
body.frontiers-article-template .fr-settings-card::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--fr-accent), transparent);
    opacity: .5;
}
body.frontiers-article-template .fr-settings-title {
    margin: .15rem 0 1rem !important;
    padding: 0 .25rem .8rem !important;
    border-bottom: 1px solid var(--fr-border);
    color: var(--fr-text) !important;
    font-size: .92rem !important;
    font-weight: 600 !important;
    letter-spacing: -.01em;
}
body.frontiers-article-template .fr-setting-group {
    margin: 0 0 .72rem !important;
    padding: .78rem !important;
    background: color-mix(in srgb, var(--fr-bg) 72%, var(--fr-surface)) !important;
    border: 1px solid color-mix(in srgb, var(--fr-border) 70%, transparent) !important;
    border-radius: 16px !important;
}
body.frontiers-article-template .fr-setting-group:last-child {
    margin-bottom: 0 !important;
}
body.frontiers-article-template .fr-setting-group label {
    margin: 0 0 .55rem !important;
    color: var(--fr-muted) !important;
    font-size: .72rem !important;
    font-weight: 500 !important;
}
body.frontiers-article-template .fr-theme-swatches {
    justify-content: space-between;
    gap: .45rem;
}
body.frontiers-article-template .fr-swatch {
    width: 30px !important;
    height: 30px !important;
    border-width: 1px !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.16);
}
body.frontiers-article-template .fr-swatch.active {
    transform: none !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--fr-accent) 30%, transparent), inset 0 0 0 1px rgba(255,255,255,.3) !important;
}
body.frontiers-article-template .fr-select,
body.frontiers-article-template .fr-stepper,
body.frontiers-article-template .fr-align-btn {
    background: var(--fr-surface) !important;
    color: var(--fr-text) !important;
    border: 1px solid var(--fr-border) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}
body.frontiers-article-template .fr-select {
    min-height: 40px;
    padding: .45rem .7rem !important;
    font-weight: 400 !important;
}
body.frontiers-article-template .fr-stepper {
    height: 40px;
    padding: .2rem !important;
}
body.frontiers-article-template .fr-stepper button,
body.frontiers-article-template .fr-align-btn {
    color: var(--fr-text) !important;
    transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}
body.frontiers-article-template .fr-stepper button:hover,
body.frontiers-article-template .fr-align-btn:hover,
body.frontiers-article-template .fr-align-btn.active {
    background: color-mix(in srgb, var(--fr-accent) 10%, var(--fr-surface)) !important;
    color: var(--fr-accent) !important;
    border-color: color-mix(in srgb, var(--fr-accent) 44%, var(--fr-border)) !important;
}
body.frontiers-article-template #fr-size-display {
    color: var(--fr-text) !important;
    font-weight: 500 !important;
}


/* ==========================================================================
   REFINEMENTS 1.4.0: immediate scroll indicators, reliable fixed header,
   Shortcodes Ultimate tooltip compatibility, TOC autoscroll polish
   ========================================================================== */

/* Less stark text in the bluish dark mode. */
html[data-theme="dark-1"] {
    --fr-text: #dbe3ee;
}

/* Progress bar: update via transform, not width, for smoother non-laggy scroll. */
body.frontiers-article-template .fr-progress-bar {
    top: var(--fr-fixed-header-offset, 0px);
    height: 3px;
}
body.frontiers-article-template .fr-progress-fill {
    width: 100% !important;
    transform: scaleX(0);
    transform-origin: left center;
    transition: none !important;
    will-change: transform;
}

/* TOC active state should respond immediately, not animate after the scroll. */
body.frontiers-article-template .fr-toc-nav a {
    transition: none !important;
}
body.frontiers-article-template .fr-toc-nav a.fr-toc-h2 {
    font-weight: 500 !important;
}
body.frontiers-article-template .fr-toc-nav a.fr-toc-h3 {
    font-weight: 400 !important;
    opacity: .96;
}
body.frontiers-article-template .fr-toc-nav a.active {
    font-weight: 600 !important;
}

/* Do not style plugin tooltip triggers/icons globally. Shortcodes Ultimate often
   uses data attributes and icon spans inside content; our tooltip system is now
   limited in JS, and these rules undo the old generic CSS damage in article text. */
body.frontiers-article-template .fr-article-body [data-tooltip]:not(.fr-pdf-btn):not(.fr-align-btn),
body.frontiers-article-template .fr-article-body .su-tooltip,
body.frontiers-article-template .fr-article-body .su-tooltip * {
    cursor: revert !important;
    text-decoration: revert !important;
    text-underline-offset: revert !important;
    border-bottom: revert !important;
    box-shadow: revert !important;
}
body.frontiers-article-template .fr-article-body [class^="su-"],
body.frontiers-article-template .fr-article-body [class*=" su-"],
body.frontiers-article-template .fr-article-body [class^="su-"] *,
body.frontiers-article-template .fr-article-body [class*=" su-"] * {
    font-family: revert !important;
}
body.frontiers-article-template .fr-pdf-btn[data-tooltip],
body.frontiers-article-template .fr-align-btn[data-tooltip] {
    cursor: pointer;
    text-decoration: none !important;
    border-bottom: none !important;
}

/* Reliable header: use fixed positioning because Elementor/parent wrappers often
   break position: sticky with overflow/transform. Visually it behaves as the
   requested sticky compact header. */
body.frontiers-article-template {
    --fr-header-height: 56px;
    --fr-fixed-header-offset: 0px;
    padding-top: var(--fr-header-height) !important;
}
body.admin-bar.frontiers-article-template {
    --fr-fixed-header-offset: 32px;
}
@media (max-width: 782px) {
    body.admin-bar.frontiers-article-template {
        --fr-fixed-header-offset: 46px;
    }
}
body.frontiers-article-template.fr-header-compact {
    --fr-header-height: 44px;
}
body.frontiers-article-template header,
body.frontiers-article-template #site-header,
body.frontiers-article-template .site-header,
body.frontiers-article-template .elementor-location-header {
    position: fixed !important;
    top: var(--fr-fixed-header-offset) !important;
    right: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: var(--fr-header-height) !important;
    min-height: var(--fr-header-height) !important;
    max-height: var(--fr-header-height) !important;
    overflow: hidden !important;
    background: var(--fr-surface) !important;
    background-color: var(--fr-surface) !important;
    color: var(--fr-text) !important;
    border-bottom: 1px solid var(--fr-border) !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 100000 !important;
    transform: translateZ(0);
    transition: height .16s ease, min-height .16s ease, max-height .16s ease, box-shadow .16s ease !important;
}
body.frontiers-article-template.fr-header-compact header,
body.frontiers-article-template.fr-header-compact #site-header,
body.frontiers-article-template.fr-header-compact .site-header,
body.frontiers-article-template.fr-header-compact .elementor-location-header {
    box-shadow: 0 8px 22px rgba(15, 23, 42, .10) !important;
}
html[data-theme^="dark"] body.frontiers-article-template.fr-header-compact header,
html[data-theme^="dark"] body.frontiers-article-template.fr-header-compact #site-header,
html[data-theme^="dark"] body.frontiers-article-template.fr-header-compact .site-header,
html[data-theme^="dark"] body.frontiers-article-template.fr-header-compact .elementor-location-header {
    box-shadow: 0 8px 22px rgba(0, 0, 0, .36) !important;
}
body.frontiers-article-template .elementor-location-header .elementor-section,
body.frontiers-article-template .elementor-location-header .elementor-container,
body.frontiers-article-template .elementor-location-header .elementor-column,
body.frontiers-article-template .elementor-location-header .elementor-widget-wrap,
body.frontiers-article-template header .elementor-section,
body.frontiers-article-template header .elementor-container,
body.frontiers-article-template header .elementor-column,
body.frontiers-article-template header .elementor-widget-wrap {
    background: transparent !important;
    background-color: transparent !important;
    color: var(--fr-text) !important;
    height: 100% !important;
    min-height: 0 !important;
}
body.frontiers-article-template header *,
body.frontiers-article-template #site-header *,
body.frontiers-article-template .site-header *,
body.frontiers-article-template .elementor-location-header *,
body.frontiers-article-template header a,
body.frontiers-article-template #site-header a,
body.frontiers-article-template .site-header a,
body.frontiers-article-template .elementor-location-header a {
    color: var(--fr-text) !important;
    opacity: 1 !important;
    visibility: visible !important;
}
body.frontiers-article-template header svg,
body.frontiers-article-template #site-header svg,
body.frontiers-article-template .site-header svg,
body.frontiers-article-template .elementor-location-header svg {
    fill: currentColor !important;
    stroke: currentColor;
}
body.frontiers-article-template header img,
body.frontiers-article-template #site-header img,
body.frontiers-article-template .site-header img,
body.frontiers-article-template .elementor-location-header img {
    opacity: 1 !important;
    visibility: visible !important;
    max-height: calc(var(--fr-header-height) - 10px) !important;
    width: auto !important;
}
body.frontiers-article-template .fr-sidebar-right,
body.frontiers-article-template .fr-sidebar-left {
    top: calc(var(--fr-fixed-header-offset) + var(--fr-header-height) + 12px) !important;
}
body.frontiers-article-template .fr-article-body h1,
body.frontiers-article-template .fr-article-body h2,
body.frontiers-article-template .fr-article-body h3,
body.frontiers-article-template .fr-article-body h4 {
    scroll-margin-top: calc(var(--fr-fixed-header-offset) + var(--fr-header-height) + 22px) !important;
}

/* Keep PDF contrast explicit after all header/generic link rules. */
body.frontiers-article-template .fr-pdf-btn,
body.frontiers-article-template .fr-pdf-btn[data-tooltip],
body.frontiers-article-template .fr-pdf-btn *,
body.frontiers-article-template .fr-pdf-btn:hover,
body.frontiers-article-template .fr-pdf-btn:focus {
    color: #fff !important;
    border-bottom: none !important;
    text-decoration: none !important;
}
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn,
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn[data-tooltip],
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn *,
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn:hover,
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn:focus {
    color: #050505 !important;
}


/* Keep progress indicator visible above the fixed header. */
body.frontiers-article-template .fr-progress-bar {
    z-index: 100002 !important;
}

/* ==========================================================================
   REFINEMENTS 1.5.0: careful sticky header, SU icons, custom tooltips,
   settings collapse, mobile drawer rebuild
   ========================================================================== */

/* Optional lighter Bidad weight for the article body. Put these files beside the
   other Bidad files if your purchased package includes them. */
@font-face {
    font-family: 'Bidad';
    src: url('fonts/Bidad-Light.woff2') format('woff2'), url('fonts/Bidad-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

/* Lighter article body. */
body.frontiers-article-template .fr-article-body,
body.frontiers-article-template .fr-article-body p,
body.frontiers-article-template .fr-article-body li,
body.frontiers-article-template .fr-article-body span:not(.fr-label):not(.fr-inline-tooltip),
body.frontiers-article-template .fr-article-body div {
    font-weight: 300 !important;
}
body.frontiers-article-template .fr-article-body strong,
body.frontiers-article-template .fr-article-body b {
    font-weight: 500 !important;
}

/* Header: undo the previous fixed-header experiment. Keep the header in normal
   document flow at first, then sticky at the top; compact only after scroll. */
body.frontiers-article-template {
    --fr-header-normal: 72px;
    --fr-header-compact: 52px;
    --fr-header-current: var(--fr-header-normal);
    --fr-fixed-header-offset: 0px;
    padding-top: 0 !important;
}
body.admin-bar.frontiers-article-template {
    --fr-fixed-header-offset: 32px;
}
@media (max-width: 782px) {
    body.admin-bar.frontiers-article-template { --fr-fixed-header-offset: 46px; }
}
body.frontiers-article-template.fr-header-compact {
    --fr-header-current: var(--fr-header-compact);
}
body.frontiers-article-template header,
body.frontiers-article-template #site-header,
body.frontiers-article-template .site-header,
body.frontiers-article-template .elementor-location-header {
    position: sticky !important;
    top: var(--fr-fixed-header-offset) !important;
    right: auto !important;
    left: auto !important;
    width: 100% !important;
    height: var(--fr-header-current) !important;
    min-height: var(--fr-header-current) !important;
    max-height: var(--fr-header-current) !important;
    overflow: visible !important;
    display: flex !important;
    align-items: center !important;
    background: var(--fr-surface) !important;
    background-color: var(--fr-surface) !important;
    color: var(--fr-text) !important;
    border-bottom: 1px solid var(--fr-border) !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    z-index: 10000 !important;
    transition: height .18s ease, min-height .18s ease, max-height .18s ease, box-shadow .18s ease, background-color .18s ease !important;
}
body.frontiers-article-template.fr-header-compact header,
body.frontiers-article-template.fr-header-compact #site-header,
body.frontiers-article-template.fr-header-compact .site-header,
body.frontiers-article-template.fr-header-compact .elementor-location-header {
    box-shadow: 0 10px 24px rgba(15, 23, 42, .10) !important;
}
html[data-theme^="dark"] body.frontiers-article-template.fr-header-compact header,
html[data-theme^="dark"] body.frontiers-article-template.fr-header-compact #site-header,
html[data-theme^="dark"] body.frontiers-article-template.fr-header-compact .site-header,
html[data-theme^="dark"] body.frontiers-article-template.fr-header-compact .elementor-location-header {
    box-shadow: 0 10px 24px rgba(0, 0, 0, .34) !important;
}
body.frontiers-article-template header .elementor-section,
body.frontiers-article-template header .elementor-container,
body.frontiers-article-template header .elementor-column,
body.frontiers-article-template header .elementor-widget-wrap,
body.frontiers-article-template .elementor-location-header .elementor-section,
body.frontiers-article-template .elementor-location-header .elementor-container,
body.frontiers-article-template .elementor-location-header .elementor-column,
body.frontiers-article-template .elementor-location-header .elementor-widget-wrap {
    background: transparent !important;
    background-color: transparent !important;
    color: var(--fr-text) !important;
    min-height: 0 !important;
}
body.frontiers-article-template header *,
body.frontiers-article-template #site-header *,
body.frontiers-article-template .site-header *,
body.frontiers-article-template .elementor-location-header * {
    color: var(--fr-text) !important;
    opacity: 1 !important;
    visibility: visible !important;
}
body.frontiers-article-template header a:hover,
body.frontiers-article-template #site-header a:hover,
body.frontiers-article-template .site-header a:hover,
body.frontiers-article-template .elementor-location-header a:hover {
    color: var(--fr-accent) !important;
}
body.frontiers-article-template header img,
body.frontiers-article-template #site-header img,
body.frontiers-article-template .site-header img,
body.frontiers-article-template .elementor-location-header img {
    max-height: calc(var(--fr-header-current) - 14px) !important;
    width: auto !important;
}
body.frontiers-article-template .fr-sidebar-right,
body.frontiers-article-template .fr-sidebar-left {
    top: calc(var(--fr-fixed-header-offset) + var(--fr-header-current) + 16px) !important;
}
body.frontiers-article-template .fr-progress-bar {
    top: var(--fr-fixed-header-offset) !important;
    z-index: 10002 !important;
}
body.frontiers-article-template .fr-article-body h1,
body.frontiers-article-template .fr-article-body h2,
body.frontiers-article-template .fr-article-body h3,
body.frontiers-article-template .fr-article-body h4 {
    scroll-margin-top: calc(var(--fr-fixed-header-offset) + var(--fr-header-current) + 22px) !important;
}

/* Shortcodes Ultimate icon protection. The earlier broad article font rule can
   break icon fonts and cause the “No Glyph” box. These selectors restore common
   SU / Font Awesome icon families only for icon elements. */
body.frontiers-article-template .fr-article-body .sui,
body.frontiers-article-template .fr-article-body [class^="sui-"],
body.frontiers-article-template .fr-article-body [class*=" sui-"],
body.frontiers-article-template .fr-article-body .su-icon,
body.frontiers-article-template .fr-article-body .su-tooltip .su-icon,
body.frontiers-article-template .fr-article-body i[class^="fa"],
body.frontiers-article-template .fr-article-body i[class*=" fa"],
body.frontiers-article-template .fr-article-body span[class^="fa"],
body.frontiers-article-template .fr-article-body span[class*=" fa"] {
    font-family: 'sui', 'Font Awesome 6 Free', 'Font Awesome 5 Free', 'FontAwesome' !important;
    font-weight: 900 !important;
    font-style: normal !important;
    line-height: 1 !important;
}
body.frontiers-article-template .fr-article-body .su-tooltip,
body.frontiers-article-template .fr-article-body .su-tooltip span:not([class*="sui"]):not([class*="fa"]),
body.frontiers-article-template .fr-article-body .su-tooltip a {
    font-family: var(--fr-article-font) !important;
}

/* Modern inline tooltip introduced by [متن][[tooltip]]. */
body.frontiers-article-template .fr-inline-tooltip {
    display: inline-flex;
    align-items: center;
    gap: .25em;
    color: var(--fr-accent) !important;
    font-weight: 400 !important;
    cursor: help;
    border-bottom: 1px dotted color-mix(in srgb, var(--fr-accent) 55%, transparent) !important;
    text-decoration: none !important;
}
body.frontiers-article-template .fr-inline-tooltip::after {
    content: '؟';
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.05em;
    height: 1.05em;
    border-radius: 999px;
    font-size: .72em;
    line-height: 1;
    color: var(--fr-bg);
    background: var(--fr-accent);
    transform: translateY(-.06em);
}
body.frontiers-article-template .fr-tooltip {
    border: 1px solid color-mix(in srgb, var(--fr-border) 72%, transparent);
    box-shadow: 0 16px 42px rgba(15, 23, 42, .16);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
html[data-theme^="dark"] body.frontiers-article-template .fr-tooltip {
    box-shadow: 0 16px 42px rgba(0,0,0,.36);
}

/* Redesigned settings card + collapse. */
body.frontiers-article-template .fr-settings-card {
    background: linear-gradient(180deg, color-mix(in srgb, var(--fr-surface) 86%, var(--fr-bg)), var(--fr-surface)) !important;
    border: 1px solid color-mix(in srgb, var(--fr-border) 72%, transparent) !important;
    border-radius: 24px !important;
    padding: 1rem !important;
    box-shadow: 0 18px 48px rgba(15,23,42,.075) !important;
}
html[data-theme^="dark"] body.frontiers-article-template .fr-settings-card {
    box-shadow: 0 18px 48px rgba(0,0,0,.30) !important;
}
body.frontiers-article-template .fr-settings-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .85rem;
    padding: .25rem .15rem .95rem;
}
body.frontiers-article-template .fr-settings-title {
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: .98rem !important;
    font-weight: 600 !important;
}
body.frontiers-article-template .fr-settings-subtitle {
    margin: .25rem 0 0 !important;
    color: var(--fr-muted) !important;
    font-size: .72rem !important;
    line-height: 1.5;
}
body.frontiers-article-template .fr-settings-glyph {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 14px;
    color: var(--fr-accent);
    background: color-mix(in srgb, var(--fr-accent) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--fr-accent) 18%, var(--fr-border));
    font-weight: 600;
    direction: ltr;
}
body.frontiers-article-template .fr-settings-content {
    display: grid;
    gap: .72rem;
}
body.frontiers-article-template .fr-settings-card[data-collapsed="true"] .fr-settings-content {
    display: none;
}
body.frontiers-article-template .fr-settings-card[data-collapsed="true"] .fr-settings-subtitle {
    display: none;
}
body.frontiers-article-template .fr-setting-group {
    margin: 0 !important;
    padding: .82rem !important;
    border-radius: 18px !important;
    background: color-mix(in srgb, var(--fr-bg) 58%, var(--fr-surface)) !important;
}
body.frontiers-article-template .fr-settings-collapse {
    width: 100%;
    margin-top: .85rem;
    padding: .72rem .85rem;
    border: 1px solid var(--fr-border) !important;
    border-radius: 16px;
    background: color-mix(in srgb, var(--fr-bg) 70%, var(--fr-surface)) !important;
    color: var(--fr-muted) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    cursor: pointer;
    font-size: .82rem;
}
body.frontiers-article-template .fr-settings-collapse svg {
    width: 17px;
    transition: transform .18s ease;
}
body.frontiers-article-template .fr-settings-card[data-collapsed="true"] .fr-settings-collapse svg {
    transform: rotate(180deg);
}
body.frontiers-article-template .fr-settings-card[data-collapsed="true"] .fr-collapse-open,
body.frontiers-article-template .fr-settings-card[data-collapsed="false"] .fr-collapse-closed {
    display: none;
}

/* PDF button: make the OLED/last dark theme calmer than pure white. */
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn,
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn[data-tooltip],
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn:hover,
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn:focus {
    background: #2a2a2a !important;
    color: #f1f1f1 !important;
    border: 1px solid #3b3b3b !important;
    box-shadow: none !important;
}
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn * {
    color: #f1f1f1 !important;
}

/* Mobile: tabbed left-bottom launcher -> polished sheet with TOC / PDF / settings. */
@media (max-width: 1024px) {
    body.frontiers-article-template .fr-fab {
        left: 18px !important;
        bottom: 18px !important;
        width: 58px !important;
        height: 58px !important;
        background: var(--fr-accent) !important;
        color: var(--fr-bg) !important;
        box-shadow: 0 16px 36px rgba(15,23,42,.22) !important;
    }
    body.frontiers-article-template .fr-sheet-overlay {
        background: rgba(15,23,42,.48) !important;
        backdrop-filter: blur(4px);
        -webkit-backdrop-filter: blur(4px);
    }
    body.frontiers-article-template .fr-bottom-sheet {
        left: 10px !important;
        right: 10px !important;
        bottom: 10px !important;
        max-height: min(82vh, 720px) !important;
        border-radius: 26px !important;
        background: var(--fr-surface) !important;
        border: 1px solid var(--fr-border) !important;
        box-shadow: 0 24px 70px rgba(0,0,0,.28) !important;
        overflow: hidden;
    }
    body.frontiers-article-template .fr-sheet-header {
        padding: 1rem 1rem .65rem !important;
        border-bottom: none !important;
    }
    body.frontiers-article-template .fr-sheet-title {
        font-weight: 600;
        color: var(--fr-text);
    }
    body.frontiers-article-template .fr-sheet-tabs {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr);
        gap: .35rem !important;
        padding: 0 1rem .85rem;
        border-bottom: 1px solid var(--fr-border);
    }
    body.frontiers-article-template .fr-tab-btn {
        border: 1px solid var(--fr-border) !important;
        border-radius: 999px !important;
        padding: .62rem .4rem !important;
        background: color-mix(in srgb, var(--fr-bg) 65%, var(--fr-surface)) !important;
    }
    body.frontiers-article-template .fr-tab-btn.active {
        background: color-mix(in srgb, var(--fr-accent) 13%, var(--fr-surface)) !important;
        color: var(--fr-accent) !important;
        border-color: color-mix(in srgb, var(--fr-accent) 35%, var(--fr-border)) !important;
    }
    body.frontiers-article-template .fr-sheet-content {
        padding: 1rem !important;
        min-height: 42vh;
    }
    body.frontiers-article-template #fr-tab-toc .fr-toc-nav {
        max-height: 58vh;
        overflow-y: auto;
    }
    body.frontiers-article-template .fr-pdf-btn-mobile {
        margin: 0 !important;
        justify-content: center;
    }
    body.frontiers-article-template .fr-mobile-empty {
        color: var(--fr-muted);
        text-align: center;
        margin: 2rem 0;
    }
}

/* Do not hide parts of the real site header. Earlier cleanup rules were too
   aggressive for Elementor headers with multiple columns/sections. */
body.frontiers-article-template header > div.elementor-container > div:nth-child(n+2) {
    display: flex !important;
}
body.frontiers-article-template header section:nth-child(n+2),
body.frontiers-article-template .elementor-location-header section:nth-child(n+2) {
    display: block !important;
}

/* ==========================================================================
   REFINEMENTS 1.6.0: stable header, desktop header layout, tooltip polish,
   progress direction, PDF color, mobile rescue
   ========================================================================== */

/* Header: one consistent sticky height; no smaller scrolled state. */
body.frontiers-article-template,
body.frontiers-article-template.fr-header-compact {
    --fr-header-normal: 60px;
    --fr-header-compact: 60px;
    --fr-header-current: 60px;
    padding-top: 0 !important;
}
body.frontiers-article-template header,
body.frontiers-article-template #site-header,
body.frontiers-article-template .site-header,
body.frontiers-article-template .elementor-location-header,
body.frontiers-article-template.fr-header-compact header,
body.frontiers-article-template.fr-header-compact #site-header,
body.frontiers-article-template.fr-header-compact .site-header,
body.frontiers-article-template.fr-header-compact .elementor-location-header {
    position: sticky !important;
    top: var(--fr-fixed-header-offset, 0px) !important;
    height: 60px !important;
    min-height: 60px !important;
    max-height: 60px !important;
    overflow: visible !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .08) !important;
}
html[data-theme^="dark"] body.frontiers-article-template header,
html[data-theme^="dark"] body.frontiers-article-template #site-header,
html[data-theme^="dark"] body.frontiers-article-template .site-header,
html[data-theme^="dark"] body.frontiers-article-template .elementor-location-header {
    box-shadow: 0 8px 22px rgba(0,0,0,.28) !important;
}

/* Desktop header layout: menu centered; logo/search kept nearby at sides. */
@media (min-width: 1025px) {
    body.frontiers-article-template header .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-container,
    body.frontiers-article-template header .elementor-section > .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-section > .elementor-container {
        width: min(1180px, calc(100vw - 48px)) !important;
        max-width: min(1180px, calc(100vw - 48px)) !important;
        margin-inline: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 1.6rem !important;
        height: 60px !important;
    }
    body.frontiers-article-template header .elementor-column,
    body.frontiers-article-template .elementor-location-header .elementor-column,
    body.frontiers-article-template header .elementor-widget-wrap,
    body.frontiers-article-template .elementor-location-header .elementor-widget-wrap {
        align-items: center !important;
        align-content: center !important;
        justify-content: center !important;
        height: 60px !important;
    }
    body.frontiers-article-template header nav,
    body.frontiers-article-template .elementor-location-header nav,
    body.frontiers-article-template header .elementor-nav-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
    }
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"] {
        width: 360px !important;
        min-width: 320px !important;
        max-width: 420px !important;
    }
    body.frontiers-article-template header input[type="search"],
    body.frontiers-article-template .elementor-location-header input[type="search"] {
        min-width: 300px !important;
    }
}

/* Logo: align with the menu row, slightly smaller, and invert on light themes
   because the source logo is white. */
body.frontiers-article-template header .custom-logo-link,
body.frontiers-article-template header .elementor-widget-theme-site-logo a,
body.frontiers-article-template .elementor-location-header .custom-logo-link,
body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    transform: translateY(2px);
}
body.frontiers-article-template header .custom-logo,
body.frontiers-article-template header .custom-logo-link img,
body.frontiers-article-template header .elementor-widget-theme-site-logo img,
body.frontiers-article-template .elementor-location-header .custom-logo,
body.frontiers-article-template .elementor-location-header .custom-logo-link img,
body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo img {
    max-height: 38px !important;
    width: auto !important;
    object-fit: contain !important;
}
html[data-theme="light-1"] body.frontiers-article-template header .custom-logo,
html[data-theme="light-1"] body.frontiers-article-template header .custom-logo-link img,
html[data-theme="light-1"] body.frontiers-article-template header .elementor-widget-theme-site-logo img,
html[data-theme="light-2"] body.frontiers-article-template header .custom-logo,
html[data-theme="light-2"] body.frontiers-article-template header .custom-logo-link img,
html[data-theme="light-2"] body.frontiers-article-template header .elementor-widget-theme-site-logo img,
html[data-theme="light-1"] body.frontiers-article-template .elementor-location-header .custom-logo,
html[data-theme="light-1"] body.frontiers-article-template .elementor-location-header .custom-logo-link img,
html[data-theme="light-1"] body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo img,
html[data-theme="light-2"] body.frontiers-article-template .elementor-location-header .custom-logo,
html[data-theme="light-2"] body.frontiers-article-template .elementor-location-header .custom-logo-link img,
html[data-theme="light-2"] body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo img {
    filter: invert(1) hue-rotate(180deg) contrast(1.08) !important;
}
html[data-theme^="dark"] body.frontiers-article-template header img,
html[data-theme^="dark"] body.frontiers-article-template .elementor-location-header img {
    filter: none !important;
}

/* Progress should fill from right to left in the RTL reading experience. */
body.frontiers-article-template .fr-progress-fill {
    transform-origin: right center !important;
}

/* Custom tooltip trigger: keep only the subtle underline; remove inline icon. */
body.frontiers-article-template .fr-inline-tooltip::after {
    content: none !important;
    display: none !important;
}
body.frontiers-article-template .fr-inline-tooltip {
    border-bottom: 1px dotted color-mix(in srgb, var(--fr-accent) 58%, transparent) !important;
    padding-bottom: .03em;
}

/* More polished tooltip bubble. */
body.frontiers-article-template .fr-tooltip {
    background: color-mix(in srgb, var(--fr-surface) 88%, var(--fr-bg)) !important;
    color: var(--fr-text) !important;
    border: 1px solid color-mix(in srgb, var(--fr-border) 74%, transparent) !important;
    border-radius: 14px !important;
    padding: .7rem .85rem !important;
    line-height: 1.75 !important;
    font-size: .88rem !important;
    box-shadow: 0 18px 50px rgba(15,23,42,.18) !important;
}
html[data-theme^="dark"] body.frontiers-article-template .fr-tooltip {
    box-shadow: 0 18px 50px rgba(0,0,0,.42) !important;
}

/* Backward compatibility: make Shortcodes Ultimate / tooltipster / qTip popups
   visually match our modern tooltip as much as possible. */
body.frontiers-article-template .su-tooltip,
body.frontiers-article-template .fr-article-body .su-tooltip {
    border-bottom: 1px dotted color-mix(in srgb, var(--fr-accent) 58%, transparent) !important;
    color: var(--fr-accent) !important;
    cursor: help !important;
}
body.frontiers-article-template .su-qtip,
body.frontiers-article-template .qtip,
body.frontiers-article-template .qtip-default,
body.frontiers-article-template .tooltipster-base,
body.frontiers-article-template .su-tooltipster,
body.frontiers-article-template .su-tooltip-content {
    background: color-mix(in srgb, var(--fr-surface) 88%, var(--fr-bg)) !important;
    color: var(--fr-text) !important;
    border: 1px solid color-mix(in srgb, var(--fr-border) 74%, transparent) !important;
    border-radius: 14px !important;
    box-shadow: 0 18px 50px rgba(15,23,42,.18) !important;
    font-family: var(--fr-article-font) !important;
    line-height: 1.75 !important;
}
body.frontiers-article-template .qtip-content,
body.frontiers-article-template .tooltipster-content,
body.frontiers-article-template .su-tooltip-content {
    padding: .7rem .85rem !important;
    color: var(--fr-text) !important;
    font-size: .88rem !important;
    font-family: var(--fr-article-font) !important;
}

/* Settings glyph: SVG control icon, not a language-specific Aa. */
body.frontiers-article-template .fr-settings-glyph svg {
    width: 21px;
    height: 21px;
}

/* Darkest mode PDF button: brighter than gray, but not painful pure white. */
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn,
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn[data-tooltip],
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn:hover,
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn:focus {
    background: #d7d7d7 !important;
    color: #080808 !important;
    border: 1px solid #eeeeee !important;
    box-shadow: 0 12px 28px rgba(255,255,255,.08) !important;
}
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn * {
    color: #080808 !important;
}

/* Mobile rescue: prevent halved header / zoomed-out layout and make the tool
   launcher unmistakably available. */
@media (max-width: 767px) {
    html, body {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }
    body.frontiers-article-template {
        --fr-header-current: auto;
        --fr-header-normal: auto;
        --fr-header-compact: auto;
    }
    body.frontiers-article-template header,
    body.frontiers-article-template #site-header,
    body.frontiers-article-template .site-header,
    body.frontiers-article-template .elementor-location-header,
    body.frontiers-article-template.fr-header-compact header,
    body.frontiers-article-template.fr-header-compact #site-header,
    body.frontiers-article-template.fr-header-compact .site-header,
    body.frontiers-article-template.fr-header-compact .elementor-location-header {
        height: auto !important;
        min-height: 58px !important;
        max-height: none !important;
        overflow: visible !important;
        padding: .35rem .75rem !important;
        display: flex !important;
        align-items: center !important;
        position: sticky !important;
    }
    body.frontiers-article-template header .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-container,
    body.frontiers-article-template header .elementor-widget-wrap,
    body.frontiers-article-template .elementor-location-header .elementor-widget-wrap {
        min-height: 48px !important;
        height: auto !important;
        align-items: center !important;
        align-content: center !important;
        overflow: visible !important;
    }
    body.frontiers-article-template header img,
    body.frontiers-article-template .elementor-location-header img {
        max-height: 34px !important;
    }
    body.frontiers-article-template .fr-layout-container {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 1rem auto !important;
        padding: 0 1rem !important;
    }
    body.frontiers-article-template .fr-main-content,
    body.frontiers-article-template .fr-article {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    body.frontiers-article-template .fr-article-title {
        font-size: 1.7rem !important;
        line-height: 1.45 !important;
    }
    body.frontiers-article-template .fr-article-body {
        font-size: 17px !important;
        line-height: 1.95 !important;
    }
    body.frontiers-article-template .fr-info-card {
        padding: 1rem !important;
    }
    body.frontiers-article-template .fr-fab.hidden-desktop,
    body.frontiers-article-template .fr-fab {
        display: flex !important;
        position: fixed !important;
        left: 16px !important;
        bottom: 16px !important;
        z-index: 100000 !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
    body.frontiers-article-template .fr-bottom-sheet {
        z-index: 100001 !important;
    }
    body.frontiers-article-template .fr-sheet-overlay {
        z-index: 100000 !important;
    }
}

/* ==========================================================================
   REFINEMENTS 1.7.0: revert SU tooltip restyling, front-matter PDF fix,
   mobile scroll isolation, minimal controls, header alignment
   ========================================================================== */

/* Revert the attempt to restyle old Shortcodes Ultimate tooltip popups. Let the
   plugin own its legacy tooltip bubble again. */
body.frontiers-article-template .su-qtip,
body.frontiers-article-template .qtip,
body.frontiers-article-template .qtip-default,
body.frontiers-article-template .tooltipster-base,
body.frontiers-article-template .su-tooltipster,
body.frontiers-article-template .su-tooltip-content,
body.frontiers-article-template .qtip-content,
body.frontiers-article-template .tooltipster-content {
    background: revert !important;
    color: revert !important;
    border: revert !important;
    border-radius: revert !important;
    box-shadow: revert !important;
    font-family: revert !important;
    line-height: revert !important;
    padding: revert !important;
    font-size: revert !important;
}
body.frontiers-article-template .su-tooltip,
body.frontiers-article-template .fr-article-body .su-tooltip {
    color: inherit !important;
    border-bottom: revert !important;
}

/* New tooltip words: accent color + subtle underline, never bold. */
body.frontiers-article-template .fr-inline-tooltip,
body.frontiers-article-template .fr-article-body .fr-inline-tooltip {
    color: var(--fr-accent) !important;
    font-weight: 300 !important;
    border-bottom: 1px dotted color-mix(in srgb, var(--fr-accent) 62%, transparent) !important;
    text-decoration: none !important;
}
body.frontiers-article-template .fr-tooltip {
    opacity: 0;
    transition: opacity .10s ease, transform .10s ease !important;
}
body.frontiers-article-template .fr-tooltip.visible {
    opacity: 1;
}

/* Collapse arrows swapped: open state points up for “collapse”; closed state
   points down for “open”. */
body.frontiers-article-template .fr-settings-collapse svg {
    transform: rotate(180deg) !important;
}
body.frontiers-article-template .fr-settings-card[data-collapsed="true"] .fr-settings-collapse svg {
    transform: rotate(0deg) !important;
}

/* More minimal font-size changer. */
body.frontiers-article-template .fr-stepper {
    height: 34px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    border: 1px solid color-mix(in srgb, var(--fr-border) 75%, transparent) !important;
    overflow: hidden;
}
body.frontiers-article-template .fr-stepper button {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    border-radius: 0 !important;
    font-size: 1rem !important;
    line-height: 1 !important;
    background: transparent !important;
    color: var(--fr-muted) !important;
}
body.frontiers-article-template .fr-stepper button:hover {
    background: color-mix(in srgb, var(--fr-accent) 9%, transparent) !important;
    color: var(--fr-accent) !important;
}
body.frontiers-article-template #fr-size-display {
    flex: 1;
    min-width: 58px;
    text-align: center;
    font-size: .78rem !important;
    font-weight: 400 !important;
    color: var(--fr-text) !important;
}

/* Header alignment: center all items vertically and give bottom breathing room
   equal to the top. */
body.frontiers-article-template header,
body.frontiers-article-template #site-header,
body.frontiers-article-template .site-header,
body.frontiers-article-template .elementor-location-header {
    box-sizing: border-box !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    align-items: center !important;
}
body.frontiers-article-template header *,
body.frontiers-article-template #site-header *,
body.frontiers-article-template .site-header *,
body.frontiers-article-template .elementor-location-header * {
    vertical-align: middle !important;
}
body.frontiers-article-template header .elementor-container,
body.frontiers-article-template .elementor-location-header .elementor-container,
body.frontiers-article-template header .elementor-section > .elementor-container,
body.frontiers-article-template .elementor-location-header .elementor-section > .elementor-container,
body.frontiers-article-template header .elementor-widget-wrap,
body.frontiers-article-template .elementor-location-header .elementor-widget-wrap {
    align-items: center !important;
    align-content: center !important;
    justify-content: center !important;
    text-align: center !important;
}
body.frontiers-article-template header .elementor-widget,
body.frontiers-article-template .elementor-location-header .elementor-widget {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
@media (min-width: 1025px) {
    body.frontiers-article-template header .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-container {
        gap: 1.25rem !important;
    }
}

/* Invert all header images in light themes: the actual logo may not use the
   custom-logo classes. */
html[data-theme="light-1"] body.frontiers-article-template header img,
html[data-theme="light-1"] body.frontiers-article-template .elementor-location-header img,
html[data-theme="light-2"] body.frontiers-article-template header img,
html[data-theme="light-2"] body.frontiers-article-template .elementor-location-header img {
    filter: invert(1) brightness(.9) contrast(1.15) !important;
}

/* Mobile sheet: isolate its scroll from the article behind it. */
body.frontiers-article-template .fr-bottom-sheet,
body.frontiers-article-template .fr-sheet-content,
body.frontiers-article-template .fr-tab-panel,
body.frontiers-article-template .fr-toc-nav {
    overscroll-behavior: contain !important;
}
body.frontiers-article-template .fr-bottom-sheet.active {
    touch-action: pan-y !important;
}

/* Mobile font-size control must use the JS variable, not a fixed override. */
@media (max-width: 767px) {
    body.frontiers-article-template .fr-article-body {
        font-size: var(--fr-article-size) !important;
    }
    body.frontiers-article-template .fr-bottom-sheet.active {
        display: flex !important;
    }
    body.frontiers-article-template .fr-sheet-content {
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
    }
}

/* ==========================================================================
   REFINEMENTS 1.8.0: desktop/mobile header rebuild and ultra-minimal size control
   ========================================================================== */

/* Header height: 50% larger than the previous 60px, with equal top/bottom space. */
body.frontiers-article-template,
body.frontiers-article-template.fr-header-compact {
    --fr-header-current: 90px;
    --fr-header-normal: 90px;
    --fr-header-compact: 90px;
}
body.frontiers-article-template header,
body.frontiers-article-template #site-header,
body.frontiers-article-template .site-header,
body.frontiers-article-template .elementor-location-header,
body.frontiers-article-template.fr-header-compact header,
body.frontiers-article-template.fr-header-compact #site-header,
body.frontiers-article-template.fr-header-compact .site-header,
body.frontiers-article-template.fr-header-compact .elementor-location-header {
    height: 90px !important;
    min-height: 90px !important;
    max-height: 90px !important;
    padding-block: 14px !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    overflow: visible !important;
}

/* Desktop: the navigation is pinned to the exact visual center. Logo and search
   are placed on the two sides of that center, so the menu remains centered even
   if the search form is wider. */
@media (min-width: 1025px) {
    body.frontiers-article-template header,
    body.frontiers-article-template #site-header,
    body.frontiers-article-template .site-header,
    body.frontiers-article-template .elementor-location-header {
        position: sticky !important;
    }
    body.frontiers-article-template header .elementor-section,
    body.frontiers-article-template .elementor-location-header .elementor-section,
    body.frontiers-article-template header .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-container {
        position: relative !important;
        width: min(1240px, calc(100vw - 48px)) !important;
        max-width: min(1240px, calc(100vw - 48px)) !important;
        height: 62px !important;
        min-height: 62px !important;
        margin-inline: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: visible !important;
    }
    body.frontiers-article-template header .elementor-column,
    body.frontiers-article-template .elementor-location-header .elementor-column,
    body.frontiers-article-template header .elementor-widget-wrap,
    body.frontiers-article-template .elementor-location-header .elementor-widget-wrap,
    body.frontiers-article-template header .elementor-widget,
    body.frontiers-article-template .elementor-location-header .elementor-widget {
        min-height: 0 !important;
        height: auto !important;
        display: flex !important;
        align-items: center !important;
        align-content: center !important;
        justify-content: center !important;
        margin-block: 0 !important;
        padding-block: 0 !important;
    }

    /* Center menu exactly. */
    body.frontiers-article-template header .elementor-widget-nav-menu,
    body.frontiers-article-template .elementor-location-header .elementor-widget-nav-menu,
    body.frontiers-article-template header nav,
    body.frontiers-article-template .elementor-location-header nav,
    body.frontiers-article-template header .elementor-nav-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu {
        position: absolute !important;
        left: 50% !important;
        right: auto !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        z-index: 3 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        white-space: nowrap !important;
        margin: 0 !important;
    }

    /* Logo side. */
    body.frontiers-article-template header .elementor-widget-theme-site-logo,
    body.frontiers-article-template header .elementor-widget-image,
    body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo,
    body.frontiers-article-template .elementor-location-header .elementor-widget-image {
        position: absolute !important;
        right: clamp(18px, calc(50% + 255px), 900px) !important;
        left: auto !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 2 !important;
    }

    /* Search side: wide, but constrained inside the header. */
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form {
        position: absolute !important;
        left: clamp(18px, calc(50% + 255px), 900px) !important;
        right: auto !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        width: clamp(280px, 28vw, 420px) !important;
        min-width: 280px !important;
        max-width: 420px !important;
        z-index: 2 !important;
        margin: 0 !important;
    }
    body.frontiers-article-template header input[type="search"],
    body.frontiers-article-template .elementor-location-header input[type="search"] {
        width: 100% !important;
        min-width: 0 !important;
        height: 40px !important;
        box-sizing: border-box !important;
    }
    body.frontiers-article-template header img,
    body.frontiers-article-template .elementor-location-header img {
        max-height: 44px !important;
    }
}

/* If viewport is not wide enough for side elements + centered menu, keep the menu
   centered and let side elements move toward the edges rather than overlap. */
@media (min-width: 1025px) and (max-width: 1180px) {
    body.frontiers-article-template header .elementor-widget-theme-site-logo,
    body.frontiers-article-template header .elementor-widget-image,
    body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo,
    body.frontiers-article-template .elementor-location-header .elementor-widget-image {
        right: 18px !important;
    }
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form {
        left: 18px !important;
        width: 280px !important;
        min-width: 240px !important;
    }
}

/* Ultra-minimal font-size control: just quiet controls, no heavy pill/chrome. */
body.frontiers-article-template .fr-stepper {
    height: 30px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    display: grid !important;
    grid-template-columns: 30px 1fr 30px;
    align-items: center !important;
    column-gap: .35rem;
    overflow: visible !important;
}
body.frontiers-article-template .fr-stepper button {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--fr-muted) !important;
    font-size: 1.05rem !important;
    font-weight: 400 !important;
}
body.frontiers-article-template .fr-stepper button:hover,
body.frontiers-article-template .fr-stepper button:focus-visible {
    background: color-mix(in srgb, var(--fr-accent) 10%, transparent) !important;
    color: var(--fr-accent) !important;
    outline: none !important;
}
body.frontiers-article-template #fr-size-display {
    min-width: 0 !important;
    padding: 0 .25rem;
    font-size: .76rem !important;
    font-weight: 400 !important;
    color: var(--fr-muted) !important;
    text-align: center !important;
}
body.frontiers-article-template .fr-setting-group:has(.fr-stepper) {
    padding-bottom: .65rem !important;
}

/* Mobile header: clean app-bar style. Logo + hamburger are centered vertically;
   the search form is hidden to avoid the broken/halved header layout on phones. */
@media (max-width: 767px) {
    body.frontiers-article-template,
    body.frontiers-article-template.fr-header-compact {
        --fr-header-current: 66px;
        --fr-header-normal: 66px;
        --fr-header-compact: 66px;
    }
    body.frontiers-article-template header,
    body.frontiers-article-template #site-header,
    body.frontiers-article-template .site-header,
    body.frontiers-article-template .elementor-location-header,
    body.frontiers-article-template.fr-header-compact header,
    body.frontiers-article-template.fr-header-compact #site-header,
    body.frontiers-article-template.fr-header-compact .site-header,
    body.frontiers-article-template.fr-header-compact .elementor-location-header {
        min-height: 66px !important;
        height: 66px !important;
        max-height: 66px !important;
        padding: 10px 14px !important;
        overflow: visible !important;
        display: flex !important;
        align-items: center !important;
    }
    body.frontiers-article-template header .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-container,
    body.frontiers-article-template header .elementor-section > .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-section > .elementor-container {
        width: 100% !important;
        height: 46px !important;
        min-height: 46px !important;
        display: flex !important;
        flex-flow: row nowrap !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: .75rem !important;
        overflow: visible !important;
    }
    body.frontiers-article-template header .elementor-column,
    body.frontiers-article-template .elementor-location-header .elementor-column,
    body.frontiers-article-template header .elementor-widget-wrap,
    body.frontiers-article-template .elementor-location-header .elementor-widget-wrap {
        width: auto !important;
        min-width: 0 !important;
        flex: 0 1 auto !important;
        height: 46px !important;
        min-height: 46px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: visible !important;
    }
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form {
        display: none !important;
    }
    body.frontiers-article-template header .elementor-widget-theme-site-logo,
    body.frontiers-article-template header .elementor-widget-image,
    body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo,
    body.frontiers-article-template .elementor-location-header .elementor-widget-image {
        position: static !important;
        transform: none !important;
        display: flex !important;
        align-items: center !important;
    }
    body.frontiers-article-template header img,
    body.frontiers-article-template .elementor-location-header img {
        max-height: 36px !important;
        width: auto !important;
    }
    body.frontiers-article-template header .elementor-menu-toggle,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 42px !important;
        height: 42px !important;
        border-radius: 12px !important;
        margin: 0 !important;
        z-index: 100004 !important;
        background: color-mix(in srgb, var(--fr-accent) 10%, transparent) !important;
        color: var(--fr-text) !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown {
        position: fixed !important;
        top: calc(var(--fr-fixed-header-offset, 0px) + 66px) !important;
        right: 12px !important;
        left: 12px !important;
        width: auto !important;
        max-height: calc(100vh - var(--fr-fixed-header-offset, 0px) - 82px) !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        border: 1px solid var(--fr-border) !important;
        border-radius: 18px !important;
        background: var(--fr-surface) !important;
        box-shadow: 0 22px 60px rgba(0,0,0,.26) !important;
        padding: .65rem !important;
        z-index: 100003 !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--dropdown a,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown a {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: .85rem 1rem !important;
        border-radius: 12px !important;
        text-align: right !important;
    }
    body.frontiers-article-template header .sub-menu,
    body.frontiers-article-template .elementor-location-header .sub-menu {
        transition: max-height .18s ease, opacity .18s ease !important;
    }
}

@media (max-width: 767px) {
    body.frontiers-article-template header .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown,
    body.frontiers-article-template header .elementor-menu-toggle,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle {
        -webkit-user-select: none !important;
        user-select: none !important;
        -webkit-tap-highlight-color: transparent;
    }
}

/* ==========================================================================
   REFINEMENTS 1.9.0: horizontal centered desktop header + mobile search and
   slide-in hamburger drawer
   ========================================================================== */

/* Desktop header: keep the inner items in one horizontal row. The *whole group*
   (logo + menu + search) is centered; no vertical/absolute stacking. */
@media (min-width: 1025px) {
    body.frontiers-article-template header .elementor-section,
    body.frontiers-article-template .elementor-location-header .elementor-section,
    body.frontiers-article-template header .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-container,
    body.frontiers-article-template header .elementor-section > .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-section > .elementor-container {
        position: relative !important;
        width: auto !important;
        max-width: calc(100vw - 64px) !important;
        margin-inline: auto !important;
        height: 62px !important;
        min-height: 62px !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 1.15rem !important;
        overflow: visible !important;
    }
    body.frontiers-article-template header .elementor-column,
    body.frontiers-article-template .elementor-location-header .elementor-column,
    body.frontiers-article-template header .elementor-widget-wrap,
    body.frontiers-article-template .elementor-location-header .elementor-widget-wrap,
    body.frontiers-article-template header .elementor-widget,
    body.frontiers-article-template .elementor-location-header .elementor-widget,
    body.frontiers-article-template header .elementor-widget-nav-menu,
    body.frontiers-article-template .elementor-location-header .elementor-widget-nav-menu,
    body.frontiers-article-template header nav,
    body.frontiers-article-template .elementor-location-header nav,
    body.frontiers-article-template header .elementor-nav-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu,
    body.frontiers-article-template header .elementor-widget-theme-site-logo,
    body.frontiers-article-template header .elementor-widget-image,
    body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo,
    body.frontiers-article-template .elementor-location-header .elementor-widget-image,
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form {
        position: static !important;
        inset: auto !important;
        transform: none !important;
        z-index: auto !important;
        margin: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        height: auto !important;
    }
    body.frontiers-article-template header .elementor-nav-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu {
        gap: .15rem !important;
        white-space: nowrap !important;
    }
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form {
        width: clamp(300px, 25vw, 420px) !important;
        flex: 0 0 clamp(300px, 25vw, 420px) !important;
    }
    body.frontiers-article-template header input[type="search"],
    body.frontiers-article-template .elementor-location-header input[type="search"] {
        width: 100% !important;
        min-width: 0 !important;
        height: 40px !important;
    }
    body.frontiers-article-template header img,
    body.frontiers-article-template .elementor-location-header img {
        max-height: 42px !important;
    }
}

/* Mobile header: two-row polished app bar. Top row has a larger logo and a
   hamburger with breathing room; second row keeps a usable search bar. */
@media (max-width: 767px) {
    body.frontiers-article-template,
    body.frontiers-article-template.fr-header-compact {
        --fr-header-current: 132px;
        --fr-header-normal: 132px;
        --fr-header-compact: 132px;
    }
    body.frontiers-article-template header,
    body.frontiers-article-template #site-header,
    body.frontiers-article-template .site-header,
    body.frontiers-article-template .elementor-location-header,
    body.frontiers-article-template.fr-header-compact header,
    body.frontiers-article-template.fr-header-compact #site-header,
    body.frontiers-article-template.fr-header-compact .site-header,
    body.frontiers-article-template.fr-header-compact .elementor-location-header {
        height: 132px !important;
        min-height: 132px !important;
        max-height: 132px !important;
        padding: 12px 18px 14px !important;
        display: flex !important;
        align-items: center !important;
        overflow: visible !important;
    }
    body.frontiers-article-template header .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-container,
    body.frontiers-article-template header .elementor-section > .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-section > .elementor-container {
        width: 100% !important;
        height: 106px !important;
        min-height: 106px !important;
        display: grid !important;
        grid-template-columns: 56px 1fr 56px !important;
        grid-template-rows: 62px 40px !important;
        align-items: center !important;
        justify-items: center !important;
        gap: 4px 10px !important;
        overflow: visible !important;
    }
    body.frontiers-article-template header .elementor-column,
    body.frontiers-article-template .elementor-location-header .elementor-column,
    body.frontiers-article-template header .elementor-widget-wrap,
    body.frontiers-article-template .elementor-location-header .elementor-widget-wrap,
    body.frontiers-article-template header .elementor-widget,
    body.frontiers-article-template .elementor-location-header .elementor-widget {
        width: auto !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        display: contents !important;
    }
    body.frontiers-article-template header .elementor-widget-theme-site-logo,
    body.frontiers-article-template header .elementor-widget-image,
    body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo,
    body.frontiers-article-template .elementor-location-header .elementor-widget-image {
        grid-column: 2 !important;
        grid-row: 1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: static !important;
        transform: none !important;
    }
    body.frontiers-article-template header img,
    body.frontiers-article-template .elementor-location-header img {
        max-height: 64px !important;
        width: auto !important;
    }
    body.frontiers-article-template header .elementor-menu-toggle,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle {
        grid-column: 3 !important;
        grid-row: 1 !important;
        justify-self: center !important;
        align-self: center !important;
        width: 46px !important;
        height: 46px !important;
        border-radius: 15px !important;
        margin: 0 !important;
        position: static !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: color-mix(in srgb, var(--fr-accent) 10%, transparent) !important;
        color: var(--fr-text) !important;
        z-index: 100006 !important;
    }
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        display: flex !important;
        width: min(100%, 420px) !important;
        min-width: 0 !important;
        height: 40px !important;
        margin: 0 auto !important;
        position: static !important;
        transform: none !important;
    }
    body.frontiers-article-template header input[type="search"],
    body.frontiers-article-template .elementor-location-header input[type="search"] {
        width: 100% !important;
        height: 40px !important;
        min-width: 0 !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
    }

    /* Slide-in hamburger menu/drawer. */
    body.frontiers-article-template header .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown {
        position: fixed !important;
        top: 0 !important;
        bottom: 0 !important;
        right: 0 !important;
        left: auto !important;
        width: min(86vw, 380px) !important;
        height: 100vh !important;
        max-height: 100vh !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        border-radius: 28px 0 0 28px !important;
        border: 1px solid color-mix(in srgb, var(--fr-border) 74%, transparent) !important;
        border-right: 0 !important;
        background: color-mix(in srgb, var(--fr-surface) 94%, var(--fr-bg)) !important;
        box-shadow: -24px 0 70px rgba(0,0,0,.28) !important;
        padding: calc(var(--fr-fixed-header-offset, 0px) + 22px) 14px 22px !important;
        z-index: 100005 !important;
        animation: frDrawerSlideIn .22s cubic-bezier(.2,.8,.2,1) both;
    }
    body.frontiers-article-template header .elementor-nav-menu--dropdown::before,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown::before {
        content: 'منو';
        display: block;
        color: var(--fr-text);
        font-weight: 600;
        font-size: 1.05rem;
        padding: .25rem .6rem 1rem;
        border-bottom: 1px solid var(--fr-border);
        margin-bottom: .55rem;
    }
    body.frontiers-article-template header .elementor-nav-menu--dropdown a,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown a {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        min-height: 44px !important;
        padding: .85rem .9rem !important;
        margin: .16rem 0 !important;
        border-radius: 14px !important;
        color: var(--fr-text) !important;
        text-align: right !important;
        transition: background-color .16s ease, color .16s ease !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--dropdown a:hover,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown a:hover {
        background: color-mix(in srgb, var(--fr-accent) 10%, transparent) !important;
        color: var(--fr-accent) !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--dropdown .sub-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown .sub-menu {
        margin: .1rem .65rem .35rem 0 !important;
        padding-right: .55rem !important;
        border-right: 1px solid var(--fr-border) !important;
    }
}

@keyframes frDrawerSlideIn {
    from { transform: translateX(105%); opacity: .7; }
    to { transform: translateX(0); opacity: 1; }
}

/* ==========================================================================
   REFINEMENTS 2.0.0: final desktop centering + robust mobile drawer defaults
   ========================================================================== */

/* DESKTOP HEADER — true centered horizontal group. Elementor columns often keep
   percentage widths; these rules neutralize that so logo + menu + search become
   one centered row instead of three stretched columns. */
@media (min-width: 1025px) {
    body.frontiers-article-template header,
    body.frontiers-article-template #site-header,
    body.frontiers-article-template .site-header,
    body.frontiers-article-template .elementor-location-header {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    body.frontiers-article-template header .elementor-section,
    body.frontiers-article-template .elementor-location-header .elementor-section,
    body.frontiers-article-template header .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-container,
    body.frontiers-article-template header .elementor-section > .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-section > .elementor-container {
        width: auto !important;
        max-width: calc(100vw - 64px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        display: inline-flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 1.15rem !important;
        flex: 0 0 auto !important;
    }
    body.frontiers-article-template header .elementor-column,
    body.frontiers-article-template .elementor-location-header .elementor-column,
    body.frontiers-article-template header .elementor-widget-wrap,
    body.frontiers-article-template .elementor-location-header .elementor-widget-wrap {
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
        display: inline-flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 1.15rem !important;
    }
    body.frontiers-article-template header .elementor-widget,
    body.frontiers-article-template .elementor-location-header .elementor-widget {
        width: auto !important;
        max-width: none !important;
        flex: 0 0 auto !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 !important;
    }
    body.frontiers-article-template header .elementor-widget-nav-menu,
    body.frontiers-article-template .elementor-location-header .elementor-widget-nav-menu {
        order: 2 !important;
    }
    body.frontiers-article-template header .elementor-widget-theme-site-logo,
    body.frontiers-article-template header .elementor-widget-image,
    body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo,
    body.frontiers-article-template .elementor-location-header .elementor-widget-image {
        order: 1 !important;
    }
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form {
        order: 3 !important;
    }
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form {
        width: 360px !important;
        max-width: 28vw !important;
        flex: 0 0 min(360px, 28vw) !important;
    }
}

/* MOBILE DRAWER CLOSED STATE — the previous drawer CSS styled the dropdown even
   while Elementor considered it closed. Hide it by default and show it only when
   the hamburger/toggle is active. */
@media (max-width: 767px) {
    body.frontiers-article-template header .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown {
        transform: translateX(108%) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transition: transform .24s cubic-bezier(.2,.8,.2,1), opacity .18s ease, visibility 0s linear .24s !important;
        animation: none !important;
    }
    body.frontiers-article-template.fr-mobile-menu-open header .elementor-nav-menu--dropdown,
    body.frontiers-article-template.fr-mobile-menu-open .elementor-location-header .elementor-nav-menu--dropdown,
    body.frontiers-article-template header .elementor-menu-toggle.elementor-active ~ .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle.elementor-active ~ .elementor-nav-menu--dropdown,
    body.frontiers-article-template header .elementor-nav-menu--dropdown[aria-hidden="false"],
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown[aria-hidden="false"] {
        transform: translateX(0) !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transition: transform .24s cubic-bezier(.2,.8,.2,1), opacity .18s ease !important;
    }
    body.frontiers-article-template header .elementor-menu-toggle,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle {
        justify-self: end !important;
        margin-inline-end: 6px !important;
    }
    .fr-mobile-submenu-layer {
        position: fixed;
        inset: 0 auto 0 0;
        right: 0;
        width: min(86vw, 380px);
        background: color-mix(in srgb, var(--fr-surface) 94%, var(--fr-bg));
        border-radius: 28px 0 0 28px;
        box-shadow: -24px 0 70px rgba(0,0,0,.28);
        z-index: 100007;
        transform: translateX(105%);
        transition: transform .22s cubic-bezier(.2,.8,.2,1);
        padding: calc(var(--fr-fixed-header-offset, 0px) + 18px) 14px 22px;
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    .fr-mobile-submenu-layer.active { transform: translateX(0); }
    .fr-submenu-back {
        display: flex;
        align-items: center;
        gap: .45rem;
        width: 100%;
        border: 0;
        background: transparent;
        color: var(--fr-accent) !important;
        padding: .85rem .65rem 1rem;
        border-bottom: 1px solid var(--fr-border);
        margin-bottom: .55rem;
        font: inherit;
        cursor: pointer;
    }
    .fr-mobile-submenu-layer a {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 44px;
        padding: .85rem .9rem;
        margin: .16rem 0;
        border-radius: 14px;
        color: var(--fr-text) !important;
        text-decoration: none !important;
    }
    .fr-has-submenu-indicator::after {
        content: '‹';
        opacity: .75;
        color: var(--fr-muted);
        font-size: 1.2em;
        margin-inline-start: .5rem;
    }
}

/* ==========================================================================
   REFINEMENTS 2.1.0: mobile tap-selection fix, icon-only submenu back,
   no edge shadow, revised mobile header placement, desktop search alignment
   ========================================================================== */

/* Desktop search: keep it exactly on the same vertical axis as the menu. */
@media (min-width: 1025px) {
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form {
        align-self: center !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin-block: 0 !important;
        padding-block: 0 !important;
        line-height: 1 !important;
    }
    body.frontiers-article-template header input[type="search"],
    body.frontiers-article-template .elementor-location-header input[type="search"],
    body.frontiers-article-template header .elementor-search-form__input,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__input {
        margin: 0 !important;
        line-height: 40px !important;
        display: block !important;
        transform: translateY(0) !important;
    }
}

@media (max-width: 767px) {
    /* Stop the strange instant word-selection behaviour on touch devices. */
    body.frontiers-article-template,
    body.frontiers-article-template .fr-article-body,
    body.frontiers-article-template .fr-article-body *:not(input):not(textarea) {
        -webkit-user-select: none !important;
        user-select: none !important;
        -webkit-touch-callout: none !important;
    }
    body.frontiers-article-template input,
    body.frontiers-article-template textarea {
        -webkit-user-select: text !important;
        user-select: text !important;
    }

    /* Mobile header placement: hamburger on the opposite side, logo where the
       hamburger was, compact search between them. */
    body.frontiers-article-template,
    body.frontiers-article-template.fr-header-compact {
        --fr-header-current: 78px;
        --fr-header-normal: 78px;
        --fr-header-compact: 78px;
    }
    body.frontiers-article-template header,
    body.frontiers-article-template #site-header,
    body.frontiers-article-template .site-header,
    body.frontiers-article-template .elementor-location-header,
    body.frontiers-article-template.fr-header-compact header,
    body.frontiers-article-template.fr-header-compact #site-header,
    body.frontiers-article-template.fr-header-compact .site-header,
    body.frontiers-article-template.fr-header-compact .elementor-location-header {
        height: 78px !important;
        min-height: 78px !important;
        max-height: 78px !important;
        padding: 10px 14px !important;
        overflow: visible !important;
    }
    body.frontiers-article-template header .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-container,
    body.frontiers-article-template header .elementor-section > .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-section > .elementor-container {
        width: 100% !important;
        height: 58px !important;
        min-height: 58px !important;
        display: grid !important;
        grid-template-columns: 52px minmax(120px, 1fr) 72px !important;
        grid-template-rows: 58px !important;
        align-items: center !important;
        justify-items: center !important;
        gap: 8px !important;
    }
    body.frontiers-article-template header .elementor-menu-toggle,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle {
        grid-column: 1 !important;
        grid-row: 1 !important;
        justify-self: center !important;
        align-self: center !important;
        width: 44px !important;
        height: 44px !important;
        margin: 0 !important;
        border-radius: 14px !important;
    }
    body.frontiers-article-template header .elementor-widget-theme-site-logo,
    body.frontiers-article-template header .elementor-widget-image,
    body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo,
    body.frontiers-article-template .elementor-location-header .elementor-widget-image {
        grid-column: 3 !important;
        grid-row: 1 !important;
        justify-self: center !important;
        align-self: center !important;
    }
    body.frontiers-article-template header img,
    body.frontiers-article-template .elementor-location-header img {
        max-height: 58px !important;
        width: auto !important;
    }
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form {
        grid-column: 2 !important;
        grid-row: 1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        max-width: 210px !important;
        height: 38px !important;
        margin: 0 !important;
        position: relative !important;
    }
    body.frontiers-article-template header .elementor-widget-search-form::before,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form::before,
    body.frontiers-article-template header form[role="search"]::before,
    body.frontiers-article-template .elementor-location-header form[role="search"]::before,
    body.frontiers-article-template header .search-form::before,
    body.frontiers-article-template .elementor-location-header .search-form::before {
        content: '⌕';
        position: absolute;
        right: 13px;
        top: 50%;
        transform: translateY(-50%);
        color: var(--fr-muted);
        z-index: 2;
        pointer-events: none;
        font-size: 1rem;
    }
    body.frontiers-article-template header input[type="search"],
    body.frontiers-article-template .elementor-location-header input[type="search"],
    body.frontiers-article-template header .elementor-search-form__input,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__input {
        width: 100% !important;
        height: 38px !important;
        border-radius: 999px !important;
        padding-right: 2.1rem !important;
        padding-left: .8rem !important;
        font-size: 0 !important;
        line-height: 38px !important;
    }
    body.frontiers-article-template header input[type="search"]::placeholder,
    body.frontiers-article-template .elementor-location-header input[type="search"]::placeholder,
    body.frontiers-article-template header .elementor-search-form__input::placeholder,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__input::placeholder {
        color: transparent !important;
        opacity: 0 !important;
    }
    body.frontiers-article-template header input[type="search"]:focus,
    body.frontiers-article-template .elementor-location-header input[type="search"]:focus,
    body.frontiers-article-template header .elementor-search-form__input:focus,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__input:focus {
        font-size: .9rem !important;
    }

    /* Drawer now slides from the hamburger side (left). Remove edge shadows. */
    body.frontiers-article-template header .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown {
        left: 0 !important;
        right: auto !important;
        border-radius: 0 28px 28px 0 !important;
        border-left: 0 !important;
        border-right: 1px solid color-mix(in srgb, var(--fr-border) 74%, transparent) !important;
        box-shadow: none !important;
        transform: translateX(-108%) !important;
    }
    body.frontiers-article-template.fr-mobile-menu-open header .elementor-nav-menu--dropdown,
    body.frontiers-article-template.fr-mobile-menu-open .elementor-location-header .elementor-nav-menu--dropdown,
    body.frontiers-article-template header .elementor-menu-toggle.elementor-active ~ .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle.elementor-active ~ .elementor-nav-menu--dropdown,
    body.frontiers-article-template header .elementor-nav-menu--dropdown[aria-hidden="false"],
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown[aria-hidden="false"] {
        transform: translateX(0) !important;
    }
    .fr-mobile-submenu-layer {
        left: 0 !important;
        right: auto !important;
        border-radius: 0 28px 28px 0 !important;
        box-shadow: none !important;
        transform: translateX(-105%) !important;
    }
    .fr-mobile-submenu-layer.active { transform: translateX(0) !important; }
    .fr-submenu-back {
        justify-content: flex-start !important;
        gap: .7rem !important;
    }
    .fr-submenu-back svg {
        width: 24px;
        height: 24px;
        flex: 0 0 auto;
    }
    .fr-submenu-back strong {
        font-weight: 500;
        color: var(--fr-text);
    }
}

/* ==========================================================================
   REFINEMENTS 2.2.0: restore normal selection, return mobile header/drawer side,
   clearer submenu back icon, desktop search vertical correction
   ========================================================================== */

/* Normal text selection must remain possible. The old issue was accidental touch
   selection; do not solve it by disabling selection globally. */
@media (max-width: 767px) {
    body.frontiers-article-template,
    body.frontiers-article-template .fr-article-body,
    body.frontiers-article-template .fr-article-body *:not(input):not(textarea),
    body.frontiers-article-template p,
    body.frontiers-article-template span,
    body.frontiers-article-template li,
    body.frontiers-article-template a {
        -webkit-user-select: text !important;
        user-select: text !important;
        -webkit-touch-callout: default !important;
    }
    body.frontiers-article-template header,
    body.frontiers-article-template .elementor-location-header,
    body.frontiers-article-template .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-menu-toggle,
    body.frontiers-article-template .fr-mobile-submenu-layer,
    body.frontiers-article-template .fr-mobile-submenu-layer * {
        -webkit-user-select: none !important;
        user-select: none !important;
        -webkit-touch-callout: none !important;
    }
}

/* Desktop search is still visually low in some Elementor search widgets: nudge
   the whole search control, including button/input wrappers, onto the menu axis. */
@media (min-width: 1025px) {
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form,
    body.frontiers-article-template header .elementor-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-search-form,
    body.frontiers-article-template header .elementor-search-form__container,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__container {
        transform: translateY(-4px) !important;
        align-items: center !important;
        align-self: center !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
    body.frontiers-article-template header .elementor-widget-search-form *,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form * {
        vertical-align: middle !important;
    }
}

/* Mobile header placement: hamburger back to the right, logo to the fully
   opposite side, compact search in the middle with the original placeholder. */
@media (max-width: 767px) {
    body.frontiers-article-template header .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-container,
    body.frontiers-article-template header .elementor-section > .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-section > .elementor-container {
        grid-template-columns: 72px minmax(120px, 1fr) 52px !important;
    }
    body.frontiers-article-template header .elementor-menu-toggle,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle {
        grid-column: 3 !important;
        grid-row: 1 !important;
        justify-self: center !important;
        margin: 0 !important;
    }
    body.frontiers-article-template header .elementor-widget-theme-site-logo,
    body.frontiers-article-template header .elementor-widget-image,
    body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo,
    body.frontiers-article-template .elementor-location-header .elementor-widget-image {
        grid-column: 1 !important;
        grid-row: 1 !important;
        justify-self: center !important;
    }
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form {
        grid-column: 2 !important;
        grid-row: 1 !important;
        width: 100% !important;
        max-width: none !important;
    }
    body.frontiers-article-template header input[type="search"],
    body.frontiers-article-template .elementor-location-header input[type="search"],
    body.frontiers-article-template header .elementor-search-form__input,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__input {
        font-size: .86rem !important;
        padding-right: 2.05rem !important;
        padding-left: .75rem !important;
    }
    body.frontiers-article-template header input[type="search"]::placeholder,
    body.frontiers-article-template .elementor-location-header input[type="search"]::placeholder,
    body.frontiers-article-template header .elementor-search-form__input::placeholder,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__input::placeholder {
        color: var(--fr-muted) !important;
        opacity: .85 !important;
    }

    /* Drawer returns to the original side: right edge, opening/closing from right. */
    body.frontiers-article-template header .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown {
        right: 0 !important;
        left: auto !important;
        border-radius: 28px 0 0 28px !important;
        border-right: 0 !important;
        border-left: 1px solid color-mix(in srgb, var(--fr-border) 74%, transparent) !important;
        box-shadow: none !important;
        transform: translateX(108%) !important;
    }
    body.frontiers-article-template.fr-mobile-menu-open header .elementor-nav-menu--dropdown,
    body.frontiers-article-template.fr-mobile-menu-open .elementor-location-header .elementor-nav-menu--dropdown,
    body.frontiers-article-template header .elementor-menu-toggle.elementor-active ~ .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle.elementor-active ~ .elementor-nav-menu--dropdown,
    body.frontiers-article-template header .elementor-nav-menu--dropdown[aria-hidden="false"],
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown[aria-hidden="false"] {
        transform: translateX(0) !important;
    }
    .fr-mobile-submenu-layer {
        right: 0 !important;
        left: auto !important;
        border-radius: 28px 0 0 28px !important;
        box-shadow: none !important;
        transform: translateX(105%) !important;
    }
    .fr-mobile-submenu-layer.active {
        transform: translateX(0) !important;
    }
    .fr-submenu-back {
        justify-content: flex-start !important;
        gap: .75rem !important;
    }
    .fr-submenu-back .fr-back-icon {
        width: 28px !important;
        height: 28px !important;
        padding: .25rem;
        border-radius: 999px;
        background: color-mix(in srgb, var(--fr-accent) 11%, transparent);
        color: var(--fr-accent) !important;
        box-sizing: content-box;
    }
}

/* ==========================================================================
   REFINEMENTS 2.3.0: mobile header swap + single search icon + vertical align
   ========================================================================== */
@media (max-width: 767px) {
    /* Swap positions: logo to the hamburger's previous side, hamburger to the
       opposite side. Search remains between them. */
    body.frontiers-article-template header .elementor-menu-toggle,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle {
        grid-column: 1 !important;
        grid-row: 1 !important;
        justify-self: center !important;
        align-self: center !important;
    }
    body.frontiers-article-template header .elementor-widget-theme-site-logo,
    body.frontiers-article-template header .elementor-widget-image,
    body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo,
    body.frontiers-article-template .elementor-location-header .elementor-widget-image {
        grid-column: 3 !important;
        grid-row: 1 !important;
        justify-self: center !important;
        align-self: center !important;
    }

    /* Remove the extra search icon I added; keep the theme/Elementor search icon. */
    body.frontiers-article-template header .elementor-widget-search-form::before,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form::before,
    body.frontiers-article-template header form[role="search"]::before,
    body.frontiers-article-template .elementor-location-header form[role="search"]::before,
    body.frontiers-article-template header .search-form::before,
    body.frontiers-article-template .elementor-location-header .search-form::before {
        content: none !important;
        display: none !important;
    }

    /* Vertically align search with logo and hamburger. */
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form,
    body.frontiers-article-template header .elementor-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-search-form,
    body.frontiers-article-template header .elementor-search-form__container,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__container {
        align-self: center !important;
        justify-self: stretch !important;
        display: flex !important;
        align-items: center !important;
        height: 40px !important;
        min-height: 40px !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        transform: translateY(2px) !important;
    }
    body.frontiers-article-template header input[type="search"],
    body.frontiers-article-template .elementor-location-header input[type="search"],
    body.frontiers-article-template header .elementor-search-form__input,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__input {
        height: 40px !important;
        line-height: 40px !important;
        margin: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
}

/* ==========================================================================
   REFINEMENTS 2.4.0: integrated menu navigation + refined mobile search/back
   ========================================================================== */
@media (max-width: 767px) {
    /* The submenu is now inside the same drawer, not a separate overlaid drawer.
       It covers the drawer content and slides as a panel within the same layer. */
    body.frontiers-article-template header .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown {
        overflow: hidden !important;
        position: fixed !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--dropdown > ul,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown > ul,
    body.frontiers-article-template header .elementor-nav-menu--dropdown > .elementor-nav-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown > .elementor-nav-menu {
        max-height: calc(100vh - var(--fr-fixed-header-offset, 0px) - 44px) !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
    }
    .fr-mobile-submenu-layer {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        max-height: none !important;
        border: 0 !important;
        border-radius: inherit !important;
        box-shadow: none !important;
        background: color-mix(in srgb, var(--fr-surface) 96%, var(--fr-bg)) !important;
        padding: calc(var(--fr-fixed-header-offset, 0px) + 18px) 14px 22px !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        transform: translateX(102%) !important;
        transition: transform .22s cubic-bezier(.2,.8,.2,1) !important;
        z-index: 5 !important;
    }
    .fr-mobile-submenu-layer.active {
        transform: translateX(0) !important;
    }
    .fr-submenu-back {
        position: sticky;
        top: 0;
        z-index: 2;
        background: color-mix(in srgb, var(--fr-surface) 96%, var(--fr-bg)) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: .75rem !important;
        width: 100% !important;
        border: 0 !important;
        border-bottom: 1px solid var(--fr-border) !important;
        color: var(--fr-accent) !important;
        padding: .65rem .35rem .9rem !important;
        margin: 0 0 .55rem !important;
        cursor: pointer;
    }
    .fr-submenu-back .fr-back-icon {
        width: 30px !important;
        height: 30px !important;
        padding: .3rem !important;
        border-radius: 999px !important;
        background: color-mix(in srgb, var(--fr-accent) 12%, transparent) !important;
        color: var(--fr-accent) !important;
        box-sizing: content-box !important;
    }
    .fr-submenu-back strong {
        font-weight: 500 !important;
        color: var(--fr-text) !important;
    }

    /* Mobile search should feel native to the theme: soft surface, subtle border,
       no duplicate pseudo icon, and vertically centered. */
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form,
    body.frontiers-article-template header .elementor-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-search-form,
    body.frontiers-article-template header .elementor-search-form__container,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__container {
        height: 38px !important;
        min-height: 38px !important;
        align-self: center !important;
        transform: translateY(2px) !important;
        background: color-mix(in srgb, var(--fr-bg) 62%, var(--fr-surface)) !important;
        border: 1px solid color-mix(in srgb, var(--fr-border) 78%, transparent) !important;
        border-radius: 999px !important;
        box-shadow: none !important;
        overflow: hidden !important;
    }
    body.frontiers-article-template header input[type="search"],
    body.frontiers-article-template .elementor-location-header input[type="search"],
    body.frontiers-article-template header .elementor-search-form__input,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__input {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        height: 38px !important;
        line-height: 38px !important;
        color: var(--fr-text) !important;
    }
    body.frontiers-article-template header .elementor-search-form__submit,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__submit,
    body.frontiers-article-template header button[type="submit"],
    body.frontiers-article-template .elementor-location-header button[type="submit"] {
        background: transparent !important;
        color: var(--fr-muted) !important;
        border: 0 !important;
        box-shadow: none !important;
    }
}


/* ==========================================================================
   REFINEMENTS 2.5.0: Sahel default, mobile search shape, menu color,
   submenu close-button cleanup, flipped back icon, OLED accent
   ========================================================================== */

/* Last/OLED dark theme: give the accent a very subtle warm brown/orange tint so
   links and tooltip words are distinguishable from normal near-white text. */
html[data-theme="dark-2"] {
    --fr-accent: #d9a76f;
}

@media (max-width: 767px) {
    /* Keep the blended search styling, but restore a more rectangular modern
       shape instead of the fully pill-shaped border. */
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form,
    body.frontiers-article-template header .elementor-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-search-form,
    body.frontiers-article-template header .elementor-search-form__container,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__container,
    body.frontiers-article-template header input[type="search"],
    body.frontiers-article-template .elementor-location-header input[type="search"],
    body.frontiers-article-template header .elementor-search-form__input,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__input {
        border-radius: 12px !important;
    }

    /* Default light mode hamburger color should be neutral, not purple/accent. */
    html[data-theme="light-1"] body.frontiers-article-template header .elementor-menu-toggle,
    html[data-theme="light-1"] body.frontiers-article-template .elementor-location-header .elementor-menu-toggle,
    html[data-theme="light-2"] body.frontiers-article-template header .elementor-menu-toggle,
    html[data-theme="light-2"] body.frontiers-article-template .elementor-location-header .elementor-menu-toggle {
        color: var(--fr-text) !important;
        background: color-mix(in srgb, var(--fr-text) 6%, transparent) !important;
        border: 1px solid color-mix(in srgb, var(--fr-text) 10%, transparent) !important;
    }
    html[data-theme="light-1"] body.frontiers-article-template header .elementor-menu-toggle *,
    html[data-theme="light-1"] body.frontiers-article-template .elementor-location-header .elementor-menu-toggle *,
    html[data-theme="light-2"] body.frontiers-article-template header .elementor-menu-toggle *,
    html[data-theme="light-2"] body.frontiers-article-template .elementor-location-header .elementor-menu-toggle * {
        color: var(--fr-text) !important;
        fill: currentColor !important;
        stroke: currentColor !important;
    }

    /* When navigating inside a submenu layer, hide Elementor's X/close toggle so
       it does not sit over the submenu back control. */
    body.frontiers-article-template.fr-submenu-active header .elementor-menu-toggle,
    body.frontiers-article-template.fr-submenu-active .elementor-location-header .elementor-menu-toggle {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    /* Flip the curved return icon vertically and keep it slimmer/cleaner. */
    .fr-submenu-back .fr-back-icon {
        transform: scaleY(-1) !important;
        stroke-width: 1.75 !important;
    }
}


/* ==========================================================================
   REFINEMENTS 2.6.0: mobile search border/header size/sticky, subtler OLED
   accent, smaller hamburger icon, mobile tooltip toggle support
   ========================================================================== */
html[data-theme="dark-2"] {
    --fr-accent: #c8b79d;
}

@media (max-width: 767px) {
    body.frontiers-article-template,
    body.frontiers-article-template.fr-header-compact {
        --fr-header-current: 62px;
        --fr-header-normal: 62px;
        --fr-header-compact: 62px;
    }
    body.frontiers-article-template header,
    body.frontiers-article-template #site-header,
    body.frontiers-article-template .site-header,
    body.frontiers-article-template .elementor-location-header,
    body.frontiers-article-template.fr-header-compact header,
    body.frontiers-article-template.fr-header-compact #site-header,
    body.frontiers-article-template.fr-header-compact .site-header,
    body.frontiers-article-template.fr-header-compact .elementor-location-header {
        position: sticky !important;
        top: var(--fr-fixed-header-offset, 0px) !important;
        height: 62px !important;
        min-height: 62px !important;
        max-height: 62px !important;
        padding: 7px 14px !important;
        z-index: 10000 !important;
    }
    body.frontiers-article-template header .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-container,
    body.frontiers-article-template header .elementor-section > .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-section > .elementor-container {
        height: 48px !important;
        min-height: 48px !important;
        grid-template-rows: 48px !important;
    }

    /* Remove the double-border: the outer search shell keeps the only border;
       inner Elementor/input wrappers are borderless. */
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form {
        border: 1px solid color-mix(in srgb, var(--fr-border) 78%, transparent) !important;
        background: color-mix(in srgb, var(--fr-bg) 62%, var(--fr-surface)) !important;
    }
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form,
    body.frontiers-article-template header .elementor-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-search-form,
    body.frontiers-article-template header .elementor-search-form__container,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__container,
    body.frontiers-article-template header input[type="search"],
    body.frontiers-article-template .elementor-location-header input[type="search"],
    body.frontiers-article-template header .elementor-search-form__input,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__input {
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
    }

    /* 15% smaller hamburger icon, while preserving the tappable button. */
    body.frontiers-article-template header .elementor-menu-toggle i,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle i,
    body.frontiers-article-template header .elementor-menu-toggle svg,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle svg,
    body.frontiers-article-template header .elementor-menu-toggle:before,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle:before {
        transform: scale(.85) !important;
        transform-origin: center !important;
    }
}

/* ==========================================================================
   REFINEMENTS 2.7.0: smaller hamburger, reliable mobile sticky/fixed header,
   hide inactive mobile sheet completely
   ========================================================================== */
@media (max-width: 767px) {
    /* Another 15% smaller than the previous 85% => about 72%. */
    body.frontiers-article-template header .elementor-menu-toggle i,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle i,
    body.frontiers-article-template header .elementor-menu-toggle svg,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle svg,
    body.frontiers-article-template header .elementor-menu-toggle:before,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle:before {
        transform: scale(.72) !important;
        transform-origin: center !important;
    }

    /* Reliable mobile stickiness: fixed positioning avoids Elementor ancestor
       overflow/transform issues that can break position: sticky on phones. */
    body.frontiers-article-template {
        padding-top: calc(var(--fr-fixed-header-offset, 0px) + 62px) !important;
    }
    body.frontiers-article-template header,
    body.frontiers-article-template #site-header,
    body.frontiers-article-template .site-header,
    body.frontiers-article-template .elementor-location-header,
    body.frontiers-article-template.fr-header-compact header,
    body.frontiers-article-template.fr-header-compact #site-header,
    body.frontiers-article-template.fr-header-compact .site-header,
    body.frontiers-article-template.fr-header-compact .elementor-location-header {
        position: fixed !important;
        top: var(--fr-fixed-header-offset, 0px) !important;
        right: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 62px !important;
        min-height: 62px !important;
        max-height: 62px !important;
        z-index: 100000 !important;
    }
    body.frontiers-article-template .fr-progress-bar {
        top: calc(var(--fr-fixed-header-offset, 0px) + 62px) !important;
    }

    /* Hidden mobile reading-tools sheet was leaving a visible sliver at the page
       bottom on some browsers. Make the inactive state truly non-rendered. */
    body.frontiers-article-template .fr-bottom-sheet:not(.active),
    body.frontiers-article-template .fr-sheet-overlay:not(.active) {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
    body.frontiers-article-template .fr-bottom-sheet.active {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        transform: translateY(0) !important;
    }
    body.frontiers-article-template .fr-sheet-overlay.active {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }
}


/* ==========================================================================
   REFINEMENTS 2.8.0: smaller hamburger, Sahel-first UI, ragged headings,
   modern article title
   ========================================================================== */

/* Article headings should never inherit justified alignment. */
body.frontiers-article-template .fr-article-title,
body.frontiers-article-template .fr-article-body h1,
body.frontiers-article-template .fr-article-body h2,
body.frontiers-article-template .fr-article-body h3,
body.frontiers-article-template .fr-article-body h4,
body.frontiers-article-template .fr-article-body h5,
body.frontiers-article-template .fr-article-body h6 {
    text-align: right !important;
    text-align-last: auto !important;
    text-wrap: balance;
    hyphens: none;
}

/* Modern, elegant page title treatment. */
body.frontiers-article-template .fr-article-title {
    position: relative;
    display: block;
    margin: clamp(1.2rem, 3vw, 2.6rem) 0 clamp(1.2rem, 2.5vw, 2rem) !important;
    padding: clamp(1rem, 2.4vw, 1.45rem) clamp(1rem, 2.6vw, 1.6rem) clamp(1rem, 2.4vw, 1.45rem) clamp(1rem, 2.6vw, 1.6rem) !important;
    border-radius: 26px;
    color: var(--fr-text) !important;
    font-family: var(--fr-article-font) !important;
    font-size: clamp(2rem, 4.2vw, 4.15rem) !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
    letter-spacing: -0.025em;
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--fr-accent) 15%, transparent), transparent 34%),
        linear-gradient(135deg, color-mix(in srgb, var(--fr-surface) 78%, var(--fr-bg)), var(--fr-bg));
    border: 1px solid color-mix(in srgb, var(--fr-border) 74%, transparent);
    box-shadow: 0 20px 55px rgba(15, 23, 42, .065);
    overflow: hidden;
}
body.frontiers-article-template .fr-article-title::before {
    content: '';
    position: absolute;
    inset-block: 18%;
    right: 0;
    width: 5px;
    border-radius: 999px 0 0 999px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--fr-accent) 35%, transparent), var(--fr-accent), color-mix(in srgb, var(--fr-accent) 35%, transparent));
}
body.frontiers-article-template .fr-article-title::after {
    content: '';
    position: absolute;
    left: -60px;
    bottom: -70px;
    width: 180px;
    height: 180px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--fr-accent) 7%, transparent);
    pointer-events: none;
}
html[data-theme^="dark"] body.frontiers-article-template .fr-article-title {
    box-shadow: 0 20px 55px rgba(0, 0, 0, .28);
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--fr-accent) 13%, transparent), transparent 34%),
        linear-gradient(135deg, color-mix(in srgb, var(--fr-surface) 80%, var(--fr-bg)), var(--fr-bg));
}

@media (max-width: 767px) {
    /* 20% smaller than previous .72 scale => .576. */
    body.frontiers-article-template header .elementor-menu-toggle i,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle i,
    body.frontiers-article-template header .elementor-menu-toggle svg,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle svg,
    body.frontiers-article-template header .elementor-menu-toggle:before,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle:before {
        transform: scale(.576) !important;
        transform-origin: center !important;
    }
    body.frontiers-article-template .fr-article-title {
        border-radius: 20px;
        font-size: clamp(1.85rem, 8vw, 2.65rem) !important;
        line-height: 1.45 !important;
        margin-top: 1rem !important;
        padding: 1rem 1.05rem 1.05rem !important;
        box-shadow: 0 14px 34px rgba(15,23,42,.06);
    }
    body.frontiers-article-template .fr-article-title::before {
        width: 4px;
        inset-block: 20%;
    }
}

/* ==========================================================================
   REFINEMENTS 2.9.0: lighter mobile headings, roomier heading lines,
   alternate elegant title design
   ========================================================================== */

/* Increase heading line spacing universally by roughly 20%. */
body.frontiers-article-template .fr-article-body h1,
body.frontiers-article-template .fr-article-body h2,
body.frontiers-article-template .fr-article-body h3,
body.frontiers-article-template .fr-article-body h4,
body.frontiers-article-template .fr-article-body h5,
body.frontiers-article-template .fr-article-body h6 {
    line-height: 1.68 !important;
}
body.frontiers-article-template .fr-article-title {
    line-height: 1.62 !important;
}

/* Mobile Bidad headings looked too heavy; make mobile headings one step lighter.
   This is intentionally scoped to mobile where the issue was visible. */
@media (max-width: 767px) {
    body.frontiers-article-template .fr-article-title,
    body.frontiers-article-template .fr-article-body h1,
    body.frontiers-article-template .fr-article-body h2,
    body.frontiers-article-template .fr-article-body h3,
    body.frontiers-article-template .fr-article-body h4,
    body.frontiers-article-template .fr-article-body h5,
    body.frontiers-article-template .fr-article-body h6 {
        font-weight: 500 !important;
        line-height: 1.74 !important;
    }
}

/* Alternate title design: more editorial/minimal than the previous card, with
   a soft top rule and quiet accent glow instead of a heavy boxed treatment. */
body.frontiers-article-template .fr-article-title {
    isolation: isolate;
    position: relative;
    display: block;
    margin: clamp(1.4rem, 3vw, 2.8rem) 0 clamp(1.4rem, 2.8vw, 2.2rem) !important;
    padding: clamp(1.15rem, 2.6vw, 1.75rem) 0 clamp(1.1rem, 2.4vw, 1.55rem) !important;
    border-radius: 0 !important;
    border: 0 !important;
    border-top: 1px solid color-mix(in srgb, var(--fr-border) 78%, transparent) !important;
    border-bottom: 1px solid color-mix(in srgb, var(--fr-border) 52%, transparent) !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--fr-text) !important;
    font-size: clamp(2.15rem, 4.4vw, 4.45rem) !important;
    font-weight: 600 !important;
    letter-spacing: -0.03em;
    text-shadow: none !important;
    overflow: visible !important;
}
body.frontiers-article-template .fr-article-title::before {
    content: '';
    position: absolute;
    right: 0;
    top: -2px;
    width: clamp(72px, 18vw, 180px);
    height: 3px;
    inset-block: auto !important;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--fr-accent), color-mix(in srgb, var(--fr-accent) 8%, transparent));
    z-index: 1;
}
body.frontiers-article-template .fr-article-title::after {
    content: '';
    position: absolute;
    right: -8%;
    top: 8%;
    width: min(360px, 55vw);
    height: min(180px, 26vw);
    border-radius: 999px;
    background: radial-gradient(circle, color-mix(in srgb, var(--fr-accent) 10%, transparent), transparent 68%);
    filter: blur(10px);
    opacity: .9;
    pointer-events: none;
    z-index: -1;
}
html[data-theme^="dark"] body.frontiers-article-template .fr-article-title {
    border-top-color: color-mix(in srgb, var(--fr-border) 90%, transparent) !important;
    border-bottom-color: color-mix(in srgb, var(--fr-border) 70%, transparent) !important;
}
html[data-theme^="dark"] body.frontiers-article-template .fr-article-title::after {
    opacity: .62;
}

@media (max-width: 767px) {
    body.frontiers-article-template .fr-article-title {
        font-size: clamp(1.9rem, 8.2vw, 2.75rem) !important;
        padding: 1rem 0 1.05rem !important;
        margin: 1.15rem 0 1.35rem !important;
        letter-spacing: -0.018em;
    }
    body.frontiers-article-template .fr-article-title::before {
        width: 92px;
        height: 2px;
    }
    body.frontiers-article-template .fr-article-title::after {
        right: -28%;
        top: 14%;
        width: 240px;
        height: 120px;
        opacity: .7;
    }
}

/* ==========================================================================
   REFINEMENTS 3.0.0: third article-title concept, slightly smaller type
   ========================================================================== */

/* Title concept 3: a quiet premium “document heading” style — smaller than the
   last attempt, with a soft inset panel, fine accent hairline, and no loud glow. */
body.frontiers-article-template .fr-article-title {
    position: relative;
    isolation: isolate;
    margin: clamp(1.25rem, 2.7vw, 2.45rem) 0 clamp(1.25rem, 2.4vw, 2rem) !important;
    padding: clamp(1.05rem, 2.2vw, 1.5rem) clamp(1.05rem, 2.5vw, 1.75rem) !important;
    border: 1px solid color-mix(in srgb, var(--fr-border) 70%, transparent) !important;
    border-radius: 22px !important;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--fr-surface) 46%, transparent), transparent),
        color-mix(in srgb, var(--fr-bg) 88%, var(--fr-surface)) !important;
    box-shadow:
        inset 0 1px 0 color-mix(in srgb, #fff 28%, transparent),
        0 14px 34px rgba(15, 23, 42, .045) !important;
    color: var(--fr-text) !important;
    font-size: clamp(1.9rem, 3.65vw, 3.7rem) !important;
    line-height: 1.58 !important;
    font-weight: 600 !important;
    letter-spacing: -0.022em;
    overflow: hidden !important;
}
body.frontiers-article-template .fr-article-title::before {
    content: '';
    position: absolute;
    inset-block: 16px;
    right: 0;
    width: 3px;
    height: auto;
    border-radius: 999px 0 0 999px;
    background: color-mix(in srgb, var(--fr-accent) 78%, var(--fr-text)) !important;
    z-index: 1;
}
body.frontiers-article-template .fr-article-title::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 0% 100%, color-mix(in srgb, var(--fr-accent) 6%, transparent), transparent 38%);
    opacity: .9;
    pointer-events: none;
    z-index: -1;
    filter: none;
}
html[data-theme^="dark"] body.frontiers-article-template .fr-article-title {
    box-shadow:
        inset 0 1px 0 color-mix(in srgb, #fff 7%, transparent),
        0 14px 34px rgba(0, 0, 0, .22) !important;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--fr-surface) 72%, transparent), transparent),
        color-mix(in srgb, var(--fr-bg) 84%, var(--fr-surface)) !important;
}

@media (max-width: 767px) {
    body.frontiers-article-template .fr-article-title {
        font-size: clamp(1.65rem, 7.1vw, 2.35rem) !important;
        line-height: 1.68 !important;
        font-weight: 500 !important;
        border-radius: 18px !important;
        padding: .95rem 1rem !important;
        margin: 1rem 0 1.25rem !important;
    }
    body.frontiers-article-template .fr-article-title::before {
        inset-block: 14px;
        width: 3px;
    }
}

/* ==========================================================================
   REFINEMENTS 3.1.0: symmetric desktop header grid, tighter heading-to-text
   spacing, mobile hamburger/search-icon visual match
   ========================================================================== */

/* Desktop header: symmetric 3-column grid.
   Column 1 = logo, Column 2 = menu exactly centered, Column 3 = search.
   Intermediate Elementor flex columns/wrappers are flattened so Elementor's
   injected flex-start / auto-margin rules cannot pull the menu off-center. */
@media (min-width: 1025px) {
    body.frontiers-article-template header,
    body.frontiers-article-template #site-header,
    body.frontiers-article-template .site-header,
    body.frontiers-article-template .elementor-location-header {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    body.frontiers-article-template header .elementor-section,
    body.frontiers-article-template .elementor-location-header .elementor-section,
    body.frontiers-article-template header .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-container,
    body.frontiers-article-template header .elementor-section > .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-section > .elementor-container {
        width: min(1180px, calc(100vw - 48px)) !important;
        max-width: min(1180px, calc(100vw - 48px)) !important;
        margin-inline: auto !important;
        display: grid !important;
        grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr) !important;
        column-gap: clamp(1rem, 2.2vw, 2rem) !important;
        align-items: center !important;
        justify-items: stretch !important;
        height: 62px !important;
        min-height: 62px !important;
        position: relative !important;
    }
    body.frontiers-article-template header .elementor-column,
    body.frontiers-article-template .elementor-location-header .elementor-column,
    body.frontiers-article-template header .elementor-widget-wrap,
    body.frontiers-article-template .elementor-location-header .elementor-widget-wrap {
        display: contents !important;
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        flex: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    body.frontiers-article-template header .elementor-widget,
    body.frontiers-article-template .elementor-location-header .elementor-widget {
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        margin: 0 !important;
        flex: none !important;
        align-self: center !important;
    }

    /* Logo sits in the left column, close to the centered menu. */
    body.frontiers-article-template header .elementor-widget-theme-site-logo,
    body.frontiers-article-template header .elementor-widget-image,
    body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo,
    body.frontiers-article-template .elementor-location-header .elementor-widget-image {
        grid-column: 1 !important;
        justify-self: end !important;
        align-self: center !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        position: static !important;
        transform: none !important;
        order: initial !important;
    }

    /* Menu is mathematically centered in the middle grid column. */
    body.frontiers-article-template header .elementor-widget-nav-menu,
    body.frontiers-article-template .elementor-location-header .elementor-widget-nav-menu,
    body.frontiers-article-template header nav,
    body.frontiers-article-template .elementor-location-header nav,
    body.frontiers-article-template header .elementor-nav-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu {
        grid-column: 2 !important;
        justify-self: center !important;
        align-self: center !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        margin: 0 !important;
        position: static !important;
        transform: none !important;
        inset: auto !important;
        order: initial !important;
        white-space: nowrap !important;
    }

    /* Search sits in the right column. Auto margins from Elementor are reset. */
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form,
    body.frontiers-article-template header .elementor-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-search-form,
    body.frontiers-article-template header .elementor-search-form__container,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__container {
        grid-column: 3 !important;
        justify-self: start !important;
        align-self: center !important;
        width: clamp(300px, 26vw, 390px) !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        margin-inline: 0 !important;
        position: static !important;
        transform: translateY(-2px) !important;
        order: initial !important;
        display: flex !important;
        align-items: center !important;
    }
}

/* Reduce vertical space between headings and the paragraph/content immediately
   following them by roughly 40%. */
body.frontiers-article-template .fr-article-body h1,
body.frontiers-article-template .fr-article-body h2,
body.frontiers-article-template .fr-article-body h3,
body.frontiers-article-template .fr-article-body h4,
body.frontiers-article-template .fr-article-body h5,
body.frontiers-article-template .fr-article-body h6 {
    margin-bottom: .6em !important;
}
body.frontiers-article-template .fr-article-body h1 + p,
body.frontiers-article-template .fr-article-body h2 + p,
body.frontiers-article-template .fr-article-body h3 + p,
body.frontiers-article-template .fr-article-body h4 + p,
body.frontiers-article-template .fr-article-body h5 + p,
body.frontiers-article-template .fr-article-body h6 + p,
body.frontiers-article-template .fr-article-body h1 + div,
body.frontiers-article-template .fr-article-body h2 + div,
body.frontiers-article-template .fr-article-body h3 + div,
body.frontiers-article-template .fr-article-body h4 + div,
body.frontiers-article-template .fr-article-body h5 + div,
body.frontiers-article-template .fr-article-body h6 + div,
body.frontiers-article-template .fr-article-body h1 + ul,
body.frontiers-article-template .fr-article-body h2 + ul,
body.frontiers-article-template .fr-article-body h3 + ul,
body.frontiers-article-template .fr-article-body h4 + ul,
body.frontiers-article-template .fr-article-body h5 + ul,
body.frontiers-article-template .fr-article-body h6 + ul,
body.frontiers-article-template .fr-article-body h1 + ol,
body.frontiers-article-template .fr-article-body h2 + ol,
body.frontiers-article-template .fr-article-body h3 + ol,
body.frontiers-article-template .fr-article-body h4 + ol,
body.frontiers-article-template .fr-article-body h5 + ol,
body.frontiers-article-template .fr-article-body h6 + ol {
    margin-top: 0 !important;
}

/* Mobile hamburger icon: fine tune down so its visible height matches the search
   icon. The button/tap target remains unchanged. */
@media (max-width: 767px) {
    body.frontiers-article-template header .elementor-menu-toggle i,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle i,
    body.frontiers-article-template header .elementor-menu-toggle svg,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle svg,
    body.frontiers-article-template header .elementor-menu-toggle:before,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle:before {
        transform: scale(.66) !important;
        transform-origin: center !important;
    }
}

/* ==========================================================================
   REFINEMENTS 3.2.0: restore shorter desktop search width + natural heading wrap
   ========================================================================== */

/* Desktop search: shorten it back from the wider symmetric-grid version. */
@media (min-width: 1025px) {
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form,
    body.frontiers-article-template header .elementor-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-search-form,
    body.frontiers-article-template header .elementor-search-form__container,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__container {
        width: 260px !important;
        flex-basis: 260px !important;
        max-width: 260px !important;
    }
}

/* Prevent unnecessary heading line breaks. The previous balanced wrapping can
   force Persian headings to break even when there is enough room. */
body.frontiers-article-template .fr-article-title,
body.frontiers-article-template .fr-article-body h1,
body.frontiers-article-template .fr-article-body h2,
body.frontiers-article-template .fr-article-body h3,
body.frontiers-article-template .fr-article-body h4,
body.frontiers-article-template .fr-article-body h5,
body.frontiers-article-template .fr-article-body h6 {
    text-wrap: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    white-space: normal !important;
    hyphens: none !important;
}

/* ==========================================================================
   REFINEMENTS 3.3.0: rich text formatting, shaded info boxes, TOC wheel lock,
   polished desktop menu, and coherent size control
   ========================================================================== */

/* Restore visible rich-text formatting inside article content. Earlier weight
   normalisation made bold/strong visually indistinguishable. */
body.frontiers-article-template .fr-article-body strong,
body.frontiers-article-template .fr-article-body b,
body.frontiers-article-template .fr-inline-tooltip strong,
body.frontiers-article-template .fr-inline-tooltip b {
    font-weight: 700 !important;
}
body.frontiers-article-template .fr-article-body em,
body.frontiers-article-template .fr-article-body i,
body.frontiers-article-template .fr-inline-tooltip em,
body.frontiers-article-template .fr-inline-tooltip i {
    font-style: italic !important;
}
body.frontiers-article-template .fr-article-body mark {
    background: color-mix(in srgb, var(--fr-accent) 18%, transparent) !important;
    color: var(--fr-text) !important;
    border-radius: .28em;
    padding: .05em .22em;
}
body.frontiers-article-template .fr-article-body u,
body.frontiers-article-template .fr-article-body ins {
    text-decoration: underline !important;
    text-decoration-thickness: .08em !important;
    text-underline-offset: .18em !important;
}
body.frontiers-article-template .fr-article-body del,
body.frontiers-article-template .fr-article-body s {
    text-decoration: line-through !important;
}
body.frontiers-article-template .fr-article-body code,
body.frontiers-article-template .fr-article-body kbd {
    direction: ltr;
    unicode-bidi: isolate;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
    font-size: .88em;
    background: color-mix(in srgb, var(--fr-surface) 82%, var(--fr-border)) !important;
    border: 1px solid var(--fr-border);
    border-radius: .4em;
    padding: .08em .35em;
}
body.frontiers-article-template .fr-article-body blockquote {
    margin: 1.6rem 0 !important;
    padding: 1rem 1.25rem !important;
    border-right: 3px solid var(--fr-accent) !important;
    border-left: 0 !important;
    background: color-mix(in srgb, var(--fr-surface) 62%, transparent) !important;
    border-radius: 14px !important;
    color: var(--fr-text) !important;
}

/* Tooltip trigger may contain inline formatting; keep accent underline while
   allowing strong/em inside it to remain visually meaningful. */
body.frontiers-article-template .fr-inline-tooltip {
    color: var(--fr-accent) !important;
    font-weight: inherit !important;
}
body.frontiers-article-template .fr-inline-tooltip strong,
body.frontiers-article-template .fr-inline-tooltip b {
    color: var(--fr-accent) !important;
    font-weight: 700 !important;
}

/* <shaded> ... </shaded> information box. Supports multiple paragraphs. */
body.frontiers-article-template .fr-shaded-box {
    position: relative;
    margin: 2rem 0 !important;
    padding: 1.15rem 1.35rem 1.15rem 1.2rem !important;
    border-radius: 20px;
    border: 1px solid color-mix(in srgb, var(--fr-accent) 24%, var(--fr-border)) !important;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--fr-accent) 9%, var(--fr-surface)), color-mix(in srgb, var(--fr-surface) 74%, var(--fr-bg))) !important;
    box-shadow: 0 16px 42px rgba(15, 23, 42, .055);
    overflow: hidden;
}
body.frontiers-article-template .fr-shaded-box::before {
    content: '';
    position: absolute;
    inset-block: 1rem;
    right: 0;
    width: 4px;
    border-radius: 999px 0 0 999px;
    background: color-mix(in srgb, var(--fr-accent) 78%, var(--fr-text));
}
body.frontiers-article-template .fr-shaded-box p:first-child { margin-top: 0 !important; }
body.frontiers-article-template .fr-shaded-box p:last-child { margin-bottom: 0 !important; }
html[data-theme^="dark"] body.frontiers-article-template .fr-shaded-box {
    box-shadow: 0 16px 42px rgba(0,0,0,.22);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--fr-accent) 8%, var(--fr-surface)), color-mix(in srgb, var(--fr-surface) 78%, var(--fr-bg))) !important;
}

/* TOC scroll isolation for desktop. CSS supports it; JS prevents wheel bubbling
   for older browsers/edge cases. */
body.frontiers-article-template .fr-toc-scroll-area {
    overscroll-behavior: contain !important;
    scroll-behavior: smooth;
}

/* Desktop menu redesign: neutral, modern, and theme-consistent; remove legacy
   green hover/active styles and polish dropdowns without creating duplicate menus. */
@media (min-width: 1025px) {
    body.frontiers-article-template header .elementor-nav-menu--main .elementor-item,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .elementor-item,
    body.frontiers-article-template header .elementor-nav-menu > li > a,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu > li > a {
        color: var(--fr-text) !important;
        background: transparent !important;
        border-radius: 999px !important;
        padding: .55rem .82rem !important;
        transition: background-color .16s ease, color .16s ease !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--main .elementor-item:hover,
    body.frontiers-article-template header .elementor-nav-menu--main .elementor-item.elementor-item-active,
    body.frontiers-article-template header .elementor-nav-menu--main .elementor-item.highlighted,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .elementor-item:hover,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .elementor-item.elementor-item-active,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .elementor-item.highlighted {
        color: var(--fr-accent) !important;
        background: color-mix(in srgb, var(--fr-accent) 9%, transparent) !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--dropdown,
    body.frontiers-article-template header .sub-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .sub-menu {
        background: color-mix(in srgb, var(--fr-surface) 96%, var(--fr-bg)) !important;
        border: 1px solid color-mix(in srgb, var(--fr-border) 82%, transparent) !important;
        border-radius: 18px !important;
        box-shadow: 0 18px 48px rgba(15,23,42,.14) !important;
        padding: .55rem !important;
        overflow: hidden;
    }
    html[data-theme^="dark"] body.frontiers-article-template header .elementor-nav-menu--dropdown,
    html[data-theme^="dark"] body.frontiers-article-template header .sub-menu,
    html[data-theme^="dark"] body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown,
    html[data-theme^="dark"] body.frontiers-article-template .elementor-location-header .sub-menu {
        box-shadow: 0 18px 48px rgba(0,0,0,.34) !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--dropdown a,
    body.frontiers-article-template header .sub-menu a,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown a,
    body.frontiers-article-template .elementor-location-header .sub-menu a {
        color: var(--fr-text) !important;
        background: transparent !important;
        border-radius: 12px !important;
        padding: .72rem .85rem !important;
        border: 0 !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--dropdown a:hover,
    body.frontiers-article-template header .sub-menu a:hover,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown a:hover,
    body.frontiers-article-template .elementor-location-header .sub-menu a:hover {
        color: var(--fr-accent) !important;
        background: color-mix(in srgb, var(--fr-accent) 10%, transparent) !important;
    }
}

/* Make the font-size setting match the rest of the settings controls again. */
body.frontiers-article-template .fr-stepper {
    height: 40px !important;
    padding: .2rem !important;
    background: var(--fr-surface) !important;
    color: var(--fr-text) !important;
    border: 1px solid var(--fr-border) !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
    overflow: hidden !important;
}
body.frontiers-article-template .fr-stepper button {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: var(--fr-text) !important;
    border: 0 !important;
    font-size: 1rem !important;
}
body.frontiers-article-template .fr-stepper button:hover,
body.frontiers-article-template .fr-stepper button:focus-visible {
    background: color-mix(in srgb, var(--fr-accent) 10%, var(--fr-surface)) !important;
    color: var(--fr-accent) !important;
}
body.frontiers-article-template #fr-size-display {
    color: var(--fr-text) !important;
    font-size: .86rem !important;
    font-weight: 500 !important;
    min-width: 62px !important;
    text-align: center !important;
}

/* ==========================================================================
   REFINEMENTS 3.4.0: no duplicate desktop menu, normal TOC scroll, refined
   scrollbar, TOC padding/font, size-label/controls consistency
   ========================================================================== */

/* Elementor outputs a separate mobile dropdown menu. On desktop, hide that
   dropdown copy completely to avoid the doubled menu; keep real desktop submenus. */
@media (min-width: 1025px) {
    body.frontiers-article-template header .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--dropdown {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--main .sub-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .sub-menu {
        display: block;
    }
}

/* TOC should follow the selected reading font. */
body.frontiers-article-template .fr-toc-nav,
body.frontiers-article-template .fr-toc-nav *,
body.frontiers-article-template .fr-sidebar-title {
    font-family: var(--fr-article-font) !important;
}

/* TOC scroll should feel normal, not artificially smooth/slow. */
body.frontiers-article-template .fr-toc-scroll-area {
    scroll-behavior: auto !important;
    padding-bottom: 1.35rem !important;
    scrollbar-width: thin;
    scrollbar-color: color-mix(in srgb, var(--fr-muted) 28%, transparent) transparent;
}
body.frontiers-article-template .fr-toc-nav {
    padding-bottom: 1.35rem !important;
}
body.frontiers-article-template .fr-toc-scroll-area::-webkit-scrollbar {
    width: 6px !important;
}
body.frontiers-article-template .fr-toc-scroll-area::-webkit-scrollbar-track {
    background: transparent !important;
}
body.frontiers-article-template .fr-toc-scroll-area::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--fr-muted) 22%, transparent) !important;
    border-radius: 999px !important;
    border: 2px solid transparent !important;
    background-clip: content-box !important;
}
body.frontiers-article-template .fr-toc-scroll-area:hover::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--fr-muted) 38%, transparent) !important;
    background-clip: content-box !important;
}

/* Ensure rich text formatting keeps winning over older normalization rules. */
body.frontiers-article-template .fr-article-body strong,
body.frontiers-article-template .fr-article-body b,
body.frontiers-article-template .fr-article-body p strong,
body.frontiers-article-template .fr-article-body li strong,
body.frontiers-article-template .fr-article-body span strong,
body.frontiers-article-template .fr-article-body p b,
body.frontiers-article-template .fr-article-body li b,
body.frontiers-article-template .fr-article-body span b {
    font-weight: 700 !important;
}
body.frontiers-article-template .fr-article-body em,
body.frontiers-article-template .fr-article-body i {
    font-style: italic !important;
}

/* Font-size control, now with swapped +/- placement, remains visually aligned
   with the other settings controls. */
body.frontiers-article-template .fr-stepper {
    direction: ltr;
}
body.frontiers-article-template .fr-stepper #fr-size-display {
    direction: rtl;
}

/* ==========================================================================
   REFINEMENTS 3.5.0: desktop menu repair, native TOC scroll, TOC spacer,
   more elegant shaded boxes, heavier TOC, corrected font-size control order
   ========================================================================== */

/* Desktop menu repair/polish. Do not create or reveal the mobile duplicate, but
   do allow the real desktop submenu to work cleanly. */
@media (min-width: 1025px) {
    body.frontiers-article-template header .elementor-menu-toggle,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle,
    body.frontiers-article-template header .elementor-menu-toggle + .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle + .elementor-nav-menu--dropdown {
        display: none !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--main,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: visible !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--main .elementor-nav-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .elementor-nav-menu {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: .25rem !important;
        overflow: visible !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--main .elementor-item::before,
    body.frontiers-article-template header .elementor-nav-menu--main .elementor-item::after,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .elementor-item::before,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .elementor-item::after {
        background: transparent !important;
        border: 0 !important;
        height: 0 !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--main > ul > li > a,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main > ul > li > a,
    body.frontiers-article-template header .elementor-nav-menu--main .elementor-item,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .elementor-item {
        color: var(--fr-text) !important;
        background: transparent !important;
        border-radius: 999px !important;
        padding: .58rem .86rem !important;
        line-height: 1.35 !important;
        transition: background-color .14s ease, color .14s ease, transform .14s ease !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--main > ul > li:hover > a,
    body.frontiers-article-template header .elementor-nav-menu--main .elementor-item:hover,
    body.frontiers-article-template header .elementor-nav-menu--main .elementor-item.highlighted,
    body.frontiers-article-template header .elementor-nav-menu--main .elementor-item.elementor-item-active,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main > ul > li:hover > a,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .elementor-item:hover,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .elementor-item.highlighted,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .elementor-item.elementor-item-active {
        color: var(--fr-accent) !important;
        background: color-mix(in srgb, var(--fr-accent) 10%, transparent) !important;
        transform: translateY(-1px);
    }
    body.frontiers-article-template header .elementor-nav-menu--main .sub-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .sub-menu {
        display: block !important;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(8px);
        transition: opacity .14s ease, transform .14s ease, visibility 0s linear .14s !important;
        background: color-mix(in srgb, var(--fr-surface) 96%, var(--fr-bg)) !important;
        border: 1px solid color-mix(in srgb, var(--fr-border) 82%, transparent) !important;
        border-radius: 18px !important;
        box-shadow: 0 18px 48px rgba(15,23,42,.14) !important;
        padding: .55rem !important;
        min-width: 210px !important;
        overflow: hidden !important;
        z-index: 10050 !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--main li:hover > .sub-menu,
    body.frontiers-article-template header .elementor-nav-menu--main li:focus-within > .sub-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main li:hover > .sub-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main li:focus-within > .sub-menu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0);
        transition-delay: 0s !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--main .sub-menu a,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .sub-menu a {
        color: var(--fr-text) !important;
        background: transparent !important;
        border-radius: 12px !important;
        padding: .72rem .85rem !important;
        line-height: 1.55 !important;
        white-space: nowrap !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--main .sub-menu a:hover,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .sub-menu a:hover {
        color: var(--fr-accent) !important;
        background: color-mix(in srgb, var(--fr-accent) 10%, transparent) !important;
    }
}

/* TOC: native scroll behavior, no artificial wheel handling; extra breathing room
   at the bottom only when scrolling is needed. */
body.frontiers-article-template .fr-toc-scroll-area {
    scroll-behavior: auto !important;
    overscroll-behavior: contain !important;
    padding-bottom: .65rem !important;
}
body.frontiers-article-template .fr-toc-nav::after {
    content: '';
    display: block;
    flex: 0 0 .9rem;
    height: .9rem;
}

/* TOC scrollbar: more subtle/modern. */
body.frontiers-article-template .fr-toc-scroll-area {
    scrollbar-width: thin;
    scrollbar-color: color-mix(in srgb, var(--fr-muted) 24%, transparent) transparent;
}
body.frontiers-article-template .fr-toc-scroll-area::-webkit-scrollbar { width: 5px !important; }
body.frontiers-article-template .fr-toc-scroll-area::-webkit-scrollbar-track { background: transparent !important; }
body.frontiers-article-template .fr-toc-scroll-area::-webkit-scrollbar-thumb {
    background-color: color-mix(in srgb, var(--fr-muted) 24%, transparent) !important;
    border-radius: 999px !important;
    border: 1px solid transparent !important;
    background-clip: padding-box !important;
}
body.frontiers-article-template .fr-toc-scroll-area:hover::-webkit-scrollbar-thumb {
    background-color: color-mix(in srgb, var(--fr-muted) 36%, transparent) !important;
}

/* TOC one step bolder, still preserving hierarchy. */
body.frontiers-article-template .fr-toc-nav a.fr-toc-h2 { font-weight: 600 !important; }
body.frontiers-article-template .fr-toc-nav a.fr-toc-h3 { font-weight: 500 !important; }
body.frontiers-article-template .fr-toc-nav a.active { font-weight: 700 !important; }

/* Shaded information box: calmer, more elegant chapter note design. */
body.frontiers-article-template .fr-shaded-box {
    position: relative;
    margin: 2.1rem 0 !important;
    padding: 1.25rem 1.35rem 1.2rem !important;
    border-radius: 22px !important;
    border: 1px solid color-mix(in srgb, var(--fr-border) 65%, var(--fr-accent)) !important;
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--fr-accent) 10%, transparent), transparent 38%),
        linear-gradient(180deg, color-mix(in srgb, var(--fr-surface) 86%, var(--fr-bg)), color-mix(in srgb, var(--fr-bg) 82%, var(--fr-surface))) !important;
    box-shadow: 0 18px 48px rgba(15,23,42,.06) !important;
    overflow: hidden;
}
body.frontiers-article-template .fr-shaded-box::before {
    content: '';
    position: absolute;
    top: 0;
    right: 1.15rem;
    left: 1.15rem;
    width: auto;
    height: 3px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--fr-accent) 76%, var(--fr-text)), transparent) !important;
}
body.frontiers-article-template .fr-shaded-box::after {
    content: 'i';
    position: absolute;
    top: 1rem;
    left: 1rem;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    font: 600 14px/1 ui-serif, Georgia, serif;
    color: var(--fr-accent);
    background: color-mix(in srgb, var(--fr-accent) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--fr-accent) 20%, var(--fr-border));
}
body.frontiers-article-template .fr-shaded-box p,
body.frontiers-article-template .fr-shaded-box li {
    color: var(--fr-text) !important;
}
html[data-theme^="dark"] body.frontiers-article-template .fr-shaded-box {
    box-shadow: 0 18px 48px rgba(0,0,0,.26) !important;
}

/* Force +/- visual order regardless of RTL/flex quirks: minus on the right,
   plus on the left (swapped from the original RTL layout). */
body.frontiers-article-template .fr-stepper {
    direction: rtl !important;
}
body.frontiers-article-template .fr-stepper #fr-btn-decrease { order: 1 !important; }
body.frontiers-article-template .fr-stepper #fr-size-display { order: 2 !important; }
body.frontiers-article-template .fr-stepper #fr-btn-increase { order: 3 !important; }


/* ==========================================================================
   REFINEMENTS 3.6.0: submenu hover fix, size button swap, TOC end space,
   graceful first paint, shaded lightbulb icon
   ========================================================================== */

/* Avoid the brief unstyled/scrambled flash while JS builds the TOC, table wraps,
   mobile clones, etc. */
body.frontiers-article-template .fr-layout-container,
body.frontiers-article-template .fr-progress-bar,
body.frontiers-article-template .fr-fab,
body.frontiers-article-template .fr-bottom-sheet,
body.frontiers-article-template .fr-sheet-overlay {
    transition: opacity .18s ease, transform .18s ease;
}
body.frontiers-article-template:not(.fr-ready) .fr-layout-container,
body.frontiers-article-template:not(.fr-ready) .fr-fab,
body.frontiers-article-template:not(.fr-ready) .fr-bottom-sheet,
body.frontiers-article-template:not(.fr-ready) .fr-sheet-overlay {
    opacity: 0 !important;
}
body.frontiers-article-template.fr-ready .fr-layout-container,
body.frontiers-article-template.fr-ready .fr-fab {
    opacity: 1 !important;
}

/* Desktop submenu fix: the mobile dropdown copy stays hidden, but genuine
   desktop submenus inside .elementor-nav-menu--main must be available. */
@media (min-width: 1025px) {
    body.frontiers-article-template header .elementor-nav-menu--main .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .elementor-nav-menu--dropdown,
    body.frontiers-article-template header .elementor-nav-menu--main .sub-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main .sub-menu {
        display: block !important;
        position: absolute !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: translateY(8px) !important;
    }
    body.frontiers-article-template header .elementor-nav-menu--main li:hover > .elementor-nav-menu--dropdown,
    body.frontiers-article-template header .elementor-nav-menu--main li:hover > .sub-menu,
    body.frontiers-article-template header .elementor-nav-menu--main li:focus-within > .elementor-nav-menu--dropdown,
    body.frontiers-article-template header .elementor-nav-menu--main li:focus-within > .sub-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main li:hover > .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main li:hover > .sub-menu,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main li:focus-within > .elementor-nav-menu--dropdown,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main li:focus-within > .sub-menu {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateY(0) !important;
    }
}

/* Swap size buttons: plus on the right, minus on the left. */
body.frontiers-article-template .fr-stepper {
    direction: rtl !important;
}
body.frontiers-article-template .fr-stepper #fr-btn-increase { order: 1 !important; }
body.frontiers-article-template .fr-stepper #fr-size-display { order: 2 !important; }
body.frontiers-article-template .fr-stepper #fr-btn-decrease { order: 3 !important; }

/* A small but real scrollable tail at the end of the TOC. */
body.frontiers-article-template .fr-toc-scroll-area {
    padding-bottom: 0 !important;
}
body.frontiers-article-template .fr-toc-nav::after {
    content: '' !important;
    display: block !important;
    flex: 0 0 2.4rem !important;
    height: 2.4rem !important;
    min-height: 2.4rem !important;
}

/* Replace the shaded-box “i” mark with a light-bulb information icon. */
body.frontiers-article-template .fr-shaded-box::after {
    content: '💡' !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI Emoji', 'Apple Color Emoji', sans-serif !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    color: var(--fr-accent) !important;
    background: color-mix(in srgb, var(--fr-accent) 10%, transparent) !important;
}

/* ==========================================================================
   REFINEMENTS 3.7.0: anchor offset, mobile tooltip tap behavior/wrapping,
   no logo-corner shadow, reading time excludes footnotes, minimal shaded icon
   ========================================================================== */

/* Cross-reference/hash navigation should land below the sticky/fixed header. */
html {
    scroll-padding-top: 112px;
}
body.frontiers-article-template [id],
body.frontiers-article-template a[name] {
    scroll-margin-top: 112px !important;
}
@media (max-width: 767px) {
    html { scroll-padding-top: calc(var(--fr-fixed-header-offset, 0px) + 74px); }
    body.frontiers-article-template [id],
    body.frontiers-article-template a[name] {
        scroll-margin-top: calc(var(--fr-fixed-header-offset, 0px) + 74px) !important;
    }
}

/* Remove any stray image/logo shadow/filter glow in the mobile header area. */
@media (max-width: 767px) {
    body.frontiers-article-template header img,
    body.frontiers-article-template .elementor-location-header img,
    body.frontiers-article-template header .elementor-widget-image,
    body.frontiers-article-template header .elementor-widget-theme-site-logo,
    body.frontiers-article-template .elementor-location-header .elementor-widget-image,
    body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo {
        box-shadow: none !important;
        text-shadow: none !important;
        filter: none !important;
    }
    html[data-theme="light-1"] body.frontiers-article-template header img,
    html[data-theme="light-1"] body.frontiers-article-template .elementor-location-header img,
    html[data-theme="light-2"] body.frontiers-article-template header img,
    html[data-theme="light-2"] body.frontiers-article-template .elementor-location-header img {
        filter: invert(1) brightness(.9) contrast(1.15) !important;
    }
}

/* Tooltip trigger should wrap like normal text. Inline-flex caused awkward line
   consumption when a tooltip phrase wrapped onto multiple mobile lines. */
body.frontiers-article-template .fr-inline-tooltip,
body.frontiers-article-template .fr-article-body .fr-inline-tooltip {
    display: inline !important;
    white-space: normal !important;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    line-height: inherit !important;
}

/* A cleaner, minimal lightbulb icon for shaded information boxes — drawn as a
   monochrome SVG mask instead of the colorful emoji. */
body.frontiers-article-template .fr-shaded-box::after {
    content: '' !important;
    position: absolute;
    top: 1rem;
    left: 1rem;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    background-color: var(--fr-accent) !important;
    opacity: .9;
    border: 0 !important;
    padding: 0 !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='black' stroke-width='1.8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M9 18h6M10 22h4M8.25 14.25c-1.2-1.02-2-2.55-2-4.25a5.75 5.75 0 0 1 11.5 0c0 1.7-.8 3.23-2 4.25-.72.61-1.25 1.25-1.25 2.25h-5c0-1-.53-1.64-1.25-2.25Z'/%3E%3C/svg%3E") center / 22px 22px no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='black' stroke-width='1.8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M9 18h6M10 22h4M8.25 14.25c-1.2-1.02-2-2.55-2-4.25a5.75 5.75 0 0 1 11.5 0c0 1.7-.8 3.23-2 4.25-.72.61-1.25 1.25-1.25 2.25h-5c0-1-.53-1.64-1.25-2.25Z'/%3E%3C/svg%3E") center / 22px 22px no-repeat;
}

/* ==========================================================================
   REFINEMENTS 3.8.0: outside-click tooltip close + wide/tall table navigation
   ========================================================================== */

/* Wide table UX: a synced horizontal scrollbar appears at the top of wide tables
   and sticks under the header while the table is in view, so users do not need
   to scroll to the bottom of a huge table just to reach hidden columns. */
body.frontiers-article-template .fr-table-shell {
    position: relative;
    margin: 2rem 0;
}
body.frontiers-article-template .fr-table-shell .fr-table-wrapper {
    margin: 0 !important;
}
body.frontiers-article-template .fr-table-top-scroll {
    display: none;
    overflow-x: auto;
    overflow-y: hidden;
    height: 16px;
    margin: 0 0 .35rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--fr-surface) 64%, transparent);
    scrollbar-width: thin;
    scrollbar-color: color-mix(in srgb, var(--fr-muted) 28%, transparent) transparent;
}
body.frontiers-article-template .fr-table-has-x-scroll .fr-table-top-scroll {
    display: block;
    position: sticky;
    top: calc(var(--fr-fixed-header-offset, 0px) + var(--fr-header-current, 90px) + 8px);
    z-index: 30;
}
body.frontiers-article-template .fr-table-top-scroll-inner {
    height: 1px;
}
body.frontiers-article-template .fr-table-top-scroll::-webkit-scrollbar,
body.frontiers-article-template .fr-table-wrapper::-webkit-scrollbar {
    height: 9px;
    width: 9px;
}
body.frontiers-article-template .fr-table-top-scroll::-webkit-scrollbar-track,
body.frontiers-article-template .fr-table-wrapper::-webkit-scrollbar-track {
    background: transparent;
}
body.frontiers-article-template .fr-table-top-scroll::-webkit-scrollbar-thumb,
body.frontiers-article-template .fr-table-wrapper::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--fr-muted) 30%, transparent);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: content-box;
}
body.frontiers-article-template .fr-table-top-scroll:hover::-webkit-scrollbar-thumb,
body.frontiers-article-template .fr-table-wrapper:hover::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--fr-muted) 44%, transparent);
    background-clip: content-box;
}
@media (max-width: 767px) {
    body.frontiers-article-template .fr-table-has-x-scroll .fr-table-top-scroll {
        top: calc(var(--fr-fixed-header-offset, 0px) + 62px + 8px);
    }
}

/* ==========================================================================
   REFINEMENTS 3.9.0: desktop drag-to-scroll for horizontally overflowing tables
   ========================================================================== */

@media (min-width: 1025px) {
    body.frontiers-article-template .fr-table-wrapper.fr-table-is-draggable {
        cursor: grab;
        user-select: auto;
    }
    body.frontiers-article-template .fr-table-wrapper.fr-table-is-draggable.fr-pointer-on-text,
    body.frontiers-article-template .fr-table-wrapper.fr-table-is-draggable.fr-pointer-on-text * {
        cursor: text !important;
    }
    body.frontiers-article-template .fr-table-wrapper.fr-table-is-draggable.fr-table-dragging,
    body.frontiers-article-template .fr-table-wrapper.fr-table-is-draggable.fr-table-dragging * {
        cursor: grabbing !important;
        user-select: none !important;
    }
    body.frontiers-article-template .fr-table-wrapper.fr-table-is-draggable table {
        touch-action: pan-y;
    }
}

/* ==========================================================================
   REFINEMENTS 4.0.0: remove top table scrollbar, mobile tap-selection fix,
   table sticky-row markers
   ========================================================================== */

/* The drag-to-scroll table behavior is now the primary desktop solution; remove
   the extra top horizontal scrollbar added earlier. */
body.frontiers-article-template .fr-table-top-scroll,
body.frontiers-article-template .fr-table-has-x-scroll .fr-table-top-scroll {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    pointer-events: none !important;
}

/* Mobile: normal long-press selection is preserved, but quick taps should not
   trigger the distracting instant word selection. Avoid forced `user-select:text`
   and use manipulation/pan hints instead. */
@media (max-width: 767px) {
    body.frontiers-article-template,
    body.frontiers-article-template .fr-article-body,
    body.frontiers-article-template .fr-article-body *:not(input):not(textarea) {
        -webkit-user-select: auto !important;
        user-select: auto !important;
        -webkit-touch-callout: default !important;
        touch-action: pan-y;
    }
    body.frontiers-article-template .fr-inline-tooltip,
    body.frontiers-article-template a,
    body.frontiers-article-template button,
    body.frontiers-article-template header,
    body.frontiers-article-template .elementor-location-header,
    body.frontiers-article-template .elementor-nav-menu--dropdown,
    body.frontiers-article-template .fr-mobile-submenu-layer {
        touch-action: manipulation;
    }
}

/* Sticky table rows driven by first-cell markers:
   <sticky-row>, <sticky-row-name>, <end-sticky-row>, <end-sticky-name>. */
body.frontiers-article-template .fr-table-wrapper table tr.fr-table-sticky-row-active > th,
body.frontiers-article-template .fr-table-wrapper table tr.fr-table-sticky-row-active > td {
    position: sticky !important;
    top: inherit;
    background: color-mix(in srgb, var(--fr-surface) 96%, var(--fr-bg)) !important;
    color: var(--fr-text) !important;
    box-shadow: 0 1px 0 var(--fr-border), 0 8px 20px rgba(15,23,42,.08) !important;
}
/* Apply the row's computed top to cells because sticky on table rows is not
   reliable across all browsers. */
body.frontiers-article-template .fr-table-wrapper table tr.fr-table-sticky-row-active > th,
body.frontiers-article-template .fr-table-wrapper table tr.fr-table-sticky-row-active > td {
    top: var(--fr-sticky-row-top, auto) !important;
}
html[data-theme^="dark"] body.frontiers-article-template .fr-table-wrapper table tr.fr-table-sticky-row-active > th,
html[data-theme^="dark"] body.frontiers-article-template .fr-table-wrapper table tr.fr-table-sticky-row-active > td {
    box-shadow: 0 1px 0 var(--fr-border), 0 8px 20px rgba(0,0,0,.32) !important;
}

/* ==========================================================================
   REFINEMENTS 4.1.0: stronger, fully opaque sticky table rows
   ========================================================================== */

body.frontiers-article-template .fr-table-has-sticky-rows table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
}
body.frontiers-article-template .fr-table-wrapper table tr.fr-table-sticky-row-active > th,
body.frontiers-article-template .fr-table-wrapper table tr.fr-table-sticky-row-active > td {
    position: sticky !important;
    top: var(--fr-sticky-row-top, 0px) !important;
    z-index: var(--fr-sticky-row-z, 100) !important;
    background: var(--fr-surface) !important;
    background-color: var(--fr-surface) !important;
    opacity: 1 !important;
    color: var(--fr-text) !important;
    background-clip: padding-box !important;
    box-shadow:
        0 1px 0 var(--fr-border),
        0 -1px 0 var(--fr-border),
        0 8px 18px rgba(15, 23, 42, .12) !important;
}
body.frontiers-article-template .fr-table-wrapper table tr.fr-table-sticky-row-active > th::before,
body.frontiers-article-template .fr-table-wrapper table tr.fr-table-sticky-row-active > td::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--fr-surface);
    z-index: -1;
    pointer-events: none;
}
html[data-theme^="dark"] body.frontiers-article-template .fr-table-wrapper table tr.fr-table-sticky-row-active > th,
html[data-theme^="dark"] body.frontiers-article-template .fr-table-wrapper table tr.fr-table-sticky-row-active > td {
    background: var(--fr-surface) !important;
    background-color: var(--fr-surface) !important;
    box-shadow:
        0 1px 0 var(--fr-border),
        0 -1px 0 var(--fr-border),
        0 8px 20px rgba(0, 0, 0, .42) !important;
}

/* ==========================================================================
   REFINEMENTS 4.2.0: reliable sticky-row overlay for tables
   ========================================================================== */

/* Browser sticky behavior for <tr>/<td> is inconsistent inside overflowed tables.
   The JS now renders an in-table visual overlay for active sticky rows, while the
   original row remains in the table flow. */
body.frontiers-article-template .fr-table-wrapper table tr.fr-table-sticky-row-active > th,
body.frontiers-article-template .fr-table-wrapper table tr.fr-table-sticky-row-active > td {
    position: static !important;
    top: auto !important;
    z-index: auto !important;
}
body.frontiers-article-template .fr-table-sticky-overlay {
    position: fixed;
    display: none;
    overflow: hidden;
    z-index: 10020;
    pointer-events: none;
    border: 1px solid var(--fr-border);
    border-radius: 10px;
    background: var(--fr-surface) !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .16);
}
body.frontiers-article-template .fr-table-sticky-overlay.active {
    display: block;
}
body.frontiers-article-template .fr-table-sticky-overlay-inner {
    will-change: transform;
}
body.frontiers-article-template .fr-table-sticky-overlay table,
body.frontiers-article-template .fr-table-sticky-overlay-table {
    margin: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: var(--fr-surface) !important;
}
body.frontiers-article-template .fr-table-sticky-overlay th,
body.frontiers-article-template .fr-table-sticky-overlay td {
    background: var(--fr-surface) !important;
    background-color: var(--fr-surface) !important;
    opacity: 1 !important;
    color: var(--fr-text) !important;
    border-bottom: 1px solid var(--fr-border) !important;
    box-shadow: none !important;
}
html[data-theme^="dark"] body.frontiers-article-template .fr-table-sticky-overlay {
    box-shadow: 0 12px 30px rgba(0, 0, 0, .46);
}

/* ==========================================================================
   REFINEMENTS 4.3.0: make sticky table rows feel embedded, not floating
   ========================================================================== */

/* Keep the reliable overlay mechanism, but remove the “floating card/layer” look.
   The sticky row should visually read as the table row itself staying in place. */
body.frontiers-article-template .fr-table-sticky-overlay {
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    overflow: hidden !important;
}
body.frontiers-article-template .fr-table-sticky-overlay table,
body.frontiers-article-template .fr-table-sticky-overlay-table {
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    background: var(--fr-surface) !important;
}
body.frontiers-article-template .fr-table-sticky-overlay tr {
    background: var(--fr-surface) !important;
}
body.frontiers-article-template .fr-table-sticky-overlay th,
body.frontiers-article-template .fr-table-sticky-overlay td {
    background: var(--fr-surface) !important;
    background-color: var(--fr-surface) !important;
    opacity: 1 !important;
    border-top: 0 !important;
    border-right: 1px solid var(--fr-border) !important;
    border-left: 0 !important;
    border-bottom: 1px solid var(--fr-border) !important;
    box-shadow: none !important;
}
body.frontiers-article-template .fr-table-sticky-overlay th:first-child,
body.frontiers-article-template .fr-table-sticky-overlay td:first-child {
    border-right: 0 !important;
}
/* A very fine bottom separator gives table continuity without making the row
   feel like a hovering panel. */
body.frontiers-article-template .fr-table-sticky-overlay::after {
    content: '';
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
    height: 1px;
    background: var(--fr-border);
    pointer-events: none;
}
html[data-theme^="dark"] body.frontiers-article-template .fr-table-sticky-overlay {
    box-shadow: none !important;
}

/* ==========================================================================
   REFINEMENTS 4.4.0: sticky table row flush to header + mobile support polish
   ========================================================================== */

/* The sticky table row must sit directly under the sticky/fixed header, with no
   visual gap where the underlying table can show through. */
body.frontiers-article-template .fr-table-sticky-overlay {
    margin-top: 0 !important;
}
body.frontiers-article-template .fr-table-sticky-overlay::before {
    content: '';
    position: absolute;
    right: 0;
    left: 0;
    top: -2px;
    height: 2px;
    background: var(--fr-surface);
    pointer-events: none;
}

/* Explicit mobile support for sticky table rows. The JS works on mobile too;
   these rules ensure the overlay is sized/stacked correctly under the fixed
   mobile header and remains readable while horizontal touch scrolling tables. */
@media (max-width: 767px) {
    body.frontiers-article-template .fr-table-sticky-overlay {
        z-index: 9999 !important; /* below the fixed header, above table content */
        max-width: 100vw !important;
        overflow: hidden !important;
        touch-action: none;
    }
    body.frontiers-article-template .fr-table-sticky-overlay th,
    body.frontiers-article-template .fr-table-sticky-overlay td {
        background: var(--fr-surface) !important;
        background-color: var(--fr-surface) !important;
        opacity: 1 !important;
    }
    body.frontiers-article-template .fr-table-wrapper {
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
    }
}

/* ==========================================================================
   REFINEMENTS 4.5.0: restore mobile horizontal table swiping + sticky-row mobile
   ========================================================================== */

@media (max-width: 767px) {
    /* Earlier mobile anti-accidental-selection rules set article descendants to
       pan-y, which blocks horizontal table swiping. Tables must allow native
       two-axis panning so users can swipe left/right through columns. */
    body.frontiers-article-template .fr-article-body .fr-table-wrapper,
    body.frontiers-article-template .fr-article-body .fr-table-wrapper *,
    body.frontiers-article-template .fr-article-body .fr-table-shell,
    body.frontiers-article-template .fr-article-body .fr-table-shell * {
        touch-action: pan-x pan-y !important;
    }
    body.frontiers-article-template .fr-table-wrapper {
        overflow-x: auto !important;
        overflow-y: visible !important;
        -webkit-overflow-scrolling: touch !important;
        overscroll-behavior-x: contain !important;
    }
    body.frontiers-article-template .fr-table-wrapper table {
        min-width: max-content;
    }

    /* The sticky overlay should never intercept touch gestures; horizontal swipes
       must go to the real scrollable table underneath. */
    body.frontiers-article-template .fr-table-sticky-overlay,
    body.frontiers-article-template .fr-table-sticky-overlay * {
        pointer-events: none !important;
        touch-action: none !important;
    }
}

/* ==========================================================================
   REFINEMENTS 4.6.0: interactive sticky table rows + immediate horizontal sync
   ========================================================================== */

/* Sticky-row overlays are now interactive clones of the real rows: users can
   select/copy text, click links, and trigger our custom tooltips from them. */
body.frontiers-article-template .fr-table-sticky-overlay,
body.frontiers-article-template .fr-table-sticky-overlay * {
    pointer-events: auto !important;
    user-select: text !important;
    -webkit-user-select: text !important;
    -webkit-touch-callout: default !important;
}
body.frontiers-article-template .fr-table-sticky-overlay .fr-inline-tooltip {
    cursor: help !important;
}

/* Keep the overlay visually part of the table while allowing its text to be
   interacted with. */
body.frontiers-article-template .fr-table-sticky-overlay {
    cursor: default;
}

@media (max-width: 767px) {
    /* JS handles horizontal swipe gestures that start on the sticky row and
       applies scrollLeft immediately, so the sticky row does not lag behind. */
    body.frontiers-article-template .fr-table-sticky-overlay,
    body.frontiers-article-template .fr-table-sticky-overlay * {
        touch-action: pan-y !important;
    }
    body.frontiers-article-template .fr-table-sticky-overlay .fr-inline-tooltip {
        touch-action: manipulation !important;
    }
}

/* ==========================================================================
   REFINEMENTS 4.7.0: sticky-row overlay interaction parity and table-line match
   ========================================================================== */

/* Overlay should behave like the draggable table on desktop unless the pointer
   is directly over selectable text. */
@media (min-width: 1025px) {
    body.frontiers-article-template .fr-table-sticky-overlay.fr-table-is-draggable {
        cursor: grab !important;
    }
    body.frontiers-article-template .fr-table-sticky-overlay.fr-table-is-draggable.fr-pointer-on-text,
    body.frontiers-article-template .fr-table-sticky-overlay.fr-table-is-draggable.fr-pointer-on-text * {
        cursor: text !important;
    }
    body.frontiers-article-template .fr-table-sticky-overlay.fr-table-dragging,
    body.frontiers-article-template .fr-table-sticky-overlay.fr-table-dragging * {
        cursor: grabbing !important;
        user-select: none !important;
        -webkit-user-select: none !important;
    }
}

/* Match the real table's line style: this theme's table cells use horizontal
   separators, not vertical grid lines. */
body.frontiers-article-template .fr-table-sticky-overlay th,
body.frontiers-article-template .fr-table-sticky-overlay td {
    border-right: 0 !important;
    border-left: 0 !important;
    border-top: 0 !important;
    border-bottom: 1px solid var(--fr-border) !important;
}

@media (max-width: 767px) {
    /* Allow overlay tooltip taps and text selection, but JS captures deliberate
       horizontal swipes and syncs the real table instantly. */
    body.frontiers-article-template .fr-table-sticky-overlay,
    body.frontiers-article-template .fr-table-sticky-overlay * {
        pointer-events: auto !important;
    }
}

/* ==========================================================================
   REFINEMENTS 4.8.0: sticky-row desktop drag fix, tooltip stacking, matching
   vertical grid lines
   ========================================================================== */

/* Sticky rows should use vertical separators that visually match the table grid,
   not remove them. Use a slightly stronger border so the overlay row feels like
   the same table structure. */
body.frontiers-article-template .fr-table-sticky-overlay th,
body.frontiers-article-template .fr-table-sticky-overlay td {
    border-inline-start: 1px solid var(--fr-border) !important;
    border-inline-end: 0 !important;
    border-top: 0 !important;
    border-bottom: 1px solid var(--fr-border) !important;
}
body.frontiers-article-template .fr-table-sticky-overlay th:last-child,
body.frontiers-article-template .fr-table-sticky-overlay td:last-child {
    border-inline-start: 0 !important;
}

/* Tooltips opened from sticky-row clones must appear above the sticky row, not
   underneath it. */
body.frontiers-article-template .fr-tooltip {
    z-index: 100200 !important;
}

/* Ensure the overlay's grab cursor is backed by actual draggable behavior on
   desktop; JS now binds the handlers at overlay creation. */
@media (min-width: 1025px) {
    body.frontiers-article-template .fr-table-sticky-overlay.fr-table-is-draggable {
        cursor: grab !important;
    }
    body.frontiers-article-template .fr-table-sticky-overlay.fr-table-is-draggable.fr-table-dragging,
    body.frontiers-article-template .fr-table-sticky-overlay.fr-table-is-draggable.fr-table-dragging * {
        cursor: grabbing !important;
    }
}

/* ==========================================================================
   REFINEMENTS 4.9.0: sticky-row grid lines copied from real table cells
   ========================================================================== */

/* Border styles for sticky-row overlay cells are now copied from the matching
   real table cells in JS. Do not impose a separate logical-border design here;
   let the copied inline borders win so the final/edge column line is preserved. */
body.frontiers-article-template .fr-table-sticky-overlay th,
body.frontiers-article-template .fr-table-sticky-overlay td {
    border-color: inherit;
}

/* ==========================================================================
   REFINEMENTS 5.0.0: no shaded icon, gray reading theme, subtler accents,
   dedicated tablet layout
   ========================================================================== */

/* 1) Shaded paragraphs: remove the icon entirely. */
body.frontiers-article-template .fr-shaded-box::after {
    content: none !important;
    display: none !important;
}

/* 2) Replace the second light theme with a calm gray reading theme — a middle
   ground between light and dark. */
html[data-theme="light-2"] {
    --fr-bg: #686b70;
    --fr-surface: #74777d;
    --fr-border: #858990;
    --fr-text: #f3f1ec;
    --fr-muted: #d1d0cc;
    --fr-accent: #d6c3a0;
    --fr-tooltip-bg: #f3f1ec;
    --fr-tooltip-text: #34363a;
    --fr-surface-rgb: 116, 119, 125;
}

/* 3) Subtler accent colors. Dark-2 keeps its warm subtle accent. */
html[data-theme="light-1"] {
    --fr-accent: #496fb0;
}
html[data-theme="dark-1"] {
    --fr-accent: #8ba6c8;
}
html[data-theme="dark-2"] {
    --fr-accent: #c8b79d;
}

/* Tone down repeated inline accent marks such as footnote links and tooltip words. */
body.frontiers-article-template .fr-article-body a,
body.frontiers-article-template .fr-inline-tooltip,
body.frontiers-article-template .fr-article-body .fr-inline-tooltip {
    color: color-mix(in srgb, var(--fr-accent) 82%, var(--fr-text)) !important;
}
body.frontiers-article-template .fr-inline-tooltip,
body.frontiers-article-template .fr-article-body .fr-inline-tooltip {
    border-bottom-color: color-mix(in srgb, var(--fr-accent) 42%, transparent) !important;
}
body.frontiers-article-template .fr-toc-nav a.active {
    color: color-mix(in srgb, var(--fr-accent) 88%, var(--fr-text)) !important;
}

/* 4) Dedicated tablet version: close to mobile, but with more breathing room and
   a centered reading column. */
@media (min-width: 768px) and (max-width: 1024px) {
    body.frontiers-article-template,
    body.frontiers-article-template.fr-header-compact {
        --fr-header-current: 76px;
        --fr-header-normal: 76px;
        --fr-header-compact: 76px;
        padding-top: calc(var(--fr-fixed-header-offset, 0px) + 76px) !important;
    }
    body.frontiers-article-template header,
    body.frontiers-article-template #site-header,
    body.frontiers-article-template .site-header,
    body.frontiers-article-template .elementor-location-header,
    body.frontiers-article-template.fr-header-compact header,
    body.frontiers-article-template.fr-header-compact #site-header,
    body.frontiers-article-template.fr-header-compact .site-header,
    body.frontiers-article-template.fr-header-compact .elementor-location-header {
        position: fixed !important;
        top: var(--fr-fixed-header-offset, 0px) !important;
        right: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 76px !important;
        min-height: 76px !important;
        max-height: 76px !important;
        padding: 10px 28px !important;
        z-index: 100000 !important;
        display: flex !important;
        align-items: center !important;
    }
    body.frontiers-article-template header .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-container,
    body.frontiers-article-template header .elementor-section > .elementor-container,
    body.frontiers-article-template .elementor-location-header .elementor-section > .elementor-container {
        width: min(100%, 920px) !important;
        height: 56px !important;
        min-height: 56px !important;
        margin-inline: auto !important;
        display: grid !important;
        grid-template-columns: 88px minmax(220px, 1fr) 58px !important;
        grid-template-rows: 56px !important;
        align-items: center !important;
        justify-items: center !important;
        gap: 16px !important;
    }
    body.frontiers-article-template header .elementor-column,
    body.frontiers-article-template .elementor-location-header .elementor-column,
    body.frontiers-article-template header .elementor-widget-wrap,
    body.frontiers-article-template .elementor-location-header .elementor-widget-wrap,
    body.frontiers-article-template header .elementor-widget,
    body.frontiers-article-template .elementor-location-header .elementor-widget {
        display: contents !important;
        width: auto !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
    }
    body.frontiers-article-template header .elementor-widget-theme-site-logo,
    body.frontiers-article-template header .elementor-widget-image,
    body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo,
    body.frontiers-article-template .elementor-location-header .elementor-widget-image {
        grid-column: 1 !important;
        grid-row: 1 !important;
        justify-self: center !important;
        align-self: center !important;
        display: flex !important;
        align-items: center !important;
    }
    body.frontiers-article-template header img,
    body.frontiers-article-template .elementor-location-header img {
        max-height: 56px !important;
        width: auto !important;
    }
    body.frontiers-article-template header .elementor-widget-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-widget-search-form,
    body.frontiers-article-template header form[role="search"],
    body.frontiers-article-template .elementor-location-header form[role="search"],
    body.frontiers-article-template header .search-form,
    body.frontiers-article-template .elementor-location-header .search-form,
    body.frontiers-article-template header .elementor-search-form,
    body.frontiers-article-template .elementor-location-header .elementor-search-form,
    body.frontiers-article-template header .elementor-search-form__container,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__container {
        grid-column: 2 !important;
        grid-row: 1 !important;
        width: min(100%, 420px) !important;
        height: 42px !important;
        border-radius: 12px !important;
        align-self: center !important;
        justify-self: center !important;
    }
    body.frontiers-article-template header input[type="search"],
    body.frontiers-article-template .elementor-location-header input[type="search"],
    body.frontiers-article-template header .elementor-search-form__input,
    body.frontiers-article-template .elementor-location-header .elementor-search-form__input {
        height: 42px !important;
        line-height: 42px !important;
        border-radius: 12px !important;
    }
    body.frontiers-article-template header .elementor-menu-toggle,
    body.frontiers-article-template .elementor-location-header .elementor-menu-toggle {
        grid-column: 3 !important;
        grid-row: 1 !important;
        width: 46px !important;
        height: 46px !important;
        border-radius: 14px !important;
        justify-self: center !important;
        align-self: center !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    body.frontiers-article-template .fr-layout-container {
        display: block !important;
        width: min(100%, 900px) !important;
        max-width: 900px !important;
        margin: 1.5rem auto !important;
        padding: 0 2.25rem !important;
    }
    body.frontiers-article-template .fr-main-content,
    body.frontiers-article-template .fr-article {
        width: 100% !important;
        max-width: 100% !important;
    }
    body.frontiers-article-template .fr-article-body {
        font-size: var(--fr-article-size) !important;
        line-height: 1.95 !important;
    }
    body.frontiers-article-template .fr-fab.hidden-desktop,
    body.frontiers-article-template .fr-fab {
        display: flex !important;
        left: 28px !important;
        bottom: 28px !important;
        z-index: 100000 !important;
    }
    body.frontiers-article-template .fr-bottom-sheet {
        left: 32px !important;
        right: 32px !important;
        bottom: 24px !important;
        max-height: min(78vh, 760px) !important;
        border-radius: 28px !important;
    }
    body.frontiers-article-template .fr-sheet-content {
        padding: 1.25rem 1.5rem !important;
    }
    body.frontiers-article-template .fr-progress-bar {
        top: calc(var(--fr-fixed-header-offset, 0px) + 76px) !important;
    }
    body.frontiers-article-template .fr-table-has-x-scroll .fr-table-top-scroll {
        top: calc(var(--fr-fixed-header-offset, 0px) + 76px + 8px) !important;
    }
}

/* ==========================================================================
   REFINEMENTS 5.1.0: gray-mode logo/swatch, subtler accents, menu fonts,
   instant TOC jumps, PDF contrast, subtle transitions
   ========================================================================== */

/* Gray theme logo should stay white, not inverted like the pure light theme. */
html[data-theme="light-2"] body.frontiers-article-template header img,
html[data-theme="light-2"] body.frontiers-article-template .elementor-location-header img,
html[data-theme="light-2"] body.frontiers-article-template header .custom-logo,
html[data-theme="light-2"] body.frontiers-article-template .elementor-location-header .custom-logo,
html[data-theme="light-2"] body.frontiers-article-template header .custom-logo-link img,
html[data-theme="light-2"] body.frontiers-article-template .elementor-location-header .custom-logo-link img,
html[data-theme="light-2"] body.frontiers-article-template header .elementor-widget-theme-site-logo img,
html[data-theme="light-2"] body.frontiers-article-template .elementor-location-header .elementor-widget-theme-site-logo img {
    filter: none !important;
}

/* Theme swatches: actual circles, no oval distortion. */
body.frontiers-article-template .fr-theme-swatches {
    align-items: center !important;
}
body.frontiers-article-template .fr-swatch {
    box-sizing: border-box !important;
    flex: 0 0 30px !important;
    inline-size: 30px !important;
    block-size: 30px !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 50% !important;
    padding: 0 !important;
}
body.frontiers-article-template .fr-swatch[data-theme-val="light-2"] {
    background: #686b70 !important;
    border-color: #858990 !important;
}

/* Slightly subtler accents everywhere, including the last dark theme. */
html[data-theme="light-1"] { --fr-accent: #5575a8; }
html[data-theme="light-2"] { --fr-accent: #cdbb9b; }
html[data-theme="dark-1"] { --fr-accent: #91a8c1; }
html[data-theme="dark-2"] { --fr-accent: #b9aa92; }
body.frontiers-article-template .fr-article-body a,
body.frontiers-article-template .fr-inline-tooltip,
body.frontiers-article-template .fr-article-body .fr-inline-tooltip {
    color: color-mix(in srgb, var(--fr-accent) 74%, var(--fr-text)) !important;
}
body.frontiers-article-template .fr-inline-tooltip,
body.frontiers-article-template .fr-article-body .fr-inline-tooltip {
    border-bottom-color: color-mix(in srgb, var(--fr-accent) 34%, transparent) !important;
}

/* Desktop submenu font should match the general menu: Bidad. */
@media (min-width: 1025px) {
    body.frontiers-article-template header .elementor-nav-menu--main,
    body.frontiers-article-template header .elementor-nav-menu--main *,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main,
    body.frontiers-article-template .elementor-location-header .elementor-nav-menu--main * {
        font-family: 'Bidad', 'Sahel', 'Shabnam', sans-serif !important;
    }
}

/* PDF button contrast in gray mode and last dark mode. */
html[data-theme="light-2"] body.frontiers-article-template .fr-pdf-btn,
html[data-theme="light-2"] body.frontiers-article-template .fr-pdf-btn[data-tooltip],
html[data-theme="light-2"] body.frontiers-article-template .fr-pdf-btn:hover,
html[data-theme="light-2"] body.frontiers-article-template .fr-pdf-btn:focus {
    background: #5b5e63 !important;
    color: #ffffff !important;
    border: 1px solid #686c72 !important;
}
html[data-theme="light-2"] body.frontiers-article-template .fr-pdf-btn * {
    color: #ffffff !important;
}
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn,
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn[data-tooltip],
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn:hover,
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn:focus {
    background: #c8c8c8 !important;
    color: #080808 !important;
    border: 1px solid #dfdfdf !important;
}
html[data-theme="dark-2"] body.frontiers-article-template .fr-pdf-btn * {
    color: #080808 !important;
}

/* TOC links should jump immediately, not perform a smooth/dragged scroll. */
html,
body,
body.frontiers-article-template,
body.frontiers-article-template .fr-toc-scroll-area,
body.frontiers-article-template .fr-sheet-content {
    scroll-behavior: auto !important;
}

/* Simple subtle fade transitions for theme/state movements, without smoothing scroll. */
body.frontiers-article-template,
body.frontiers-article-template .fr-layout-container,
body.frontiers-article-template .fr-info-card,
body.frontiers-article-template .fr-settings-card,
body.frontiers-article-template .fr-shaded-box,
body.frontiers-article-template .fr-table-wrapper,
body.frontiers-article-template .fr-bottom-sheet,
body.frontiers-article-template .fr-tooltip,
body.frontiers-article-template .fr-toc-nav a,
body.frontiers-article-template .fr-pdf-btn,
body.frontiers-article-template .fr-select,
body.frontiers-article-template .fr-stepper,
body.frontiers-article-template .fr-align-btn {
    transition-property: opacity, background-color, color, border-color, box-shadow, transform;
    transition-duration: .16s;
    transition-timing-function: ease;
}
@media (prefers-reduced-motion: reduce) {
    body.frontiers-article-template,
    body.frontiers-article-template * {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
}

/* ========================================================================== 
   REFINEMENTS 5.2.0: restore menu indicators, remove PDF tooltip, normal TOC
   smooth navigation, mobile TOC fix
   ========================================================================== */

/* Restore Elementor's own submenu indicator icon and prevent our Bidad menu-font
   rule from breaking icon glyph fonts. */
body.frontiers-article-template .fr-has-submenu-indicator::after {
    content: none !important;
    display: none !important;
}
body.frontiers-article-template header .sub-arrow,
body.frontiers-article-template header .sub-arrow *,
body.frontiers-article-template .elementor-location-header .sub-arrow,
body.frontiers-article-template .elementor-location-header .sub-arrow *,
body.frontiers-article-template header i[class^="eicon"],
body.frontiers-article-template header i[class*=" eicon"],
body.frontiers-article-template .elementor-location-header i[class^="eicon"],
body.frontiers-article-template .elementor-location-header i[class*=" eicon"],
body.frontiers-article-template header i[class^="fa"],
body.frontiers-article-template header i[class*=" fa"],
body.frontiers-article-template .elementor-location-header i[class^="fa"],
body.frontiers-article-template .elementor-location-header i[class*=" fa"] {
    font-family: eicons, 'Font Awesome 5 Free', 'Font Awesome 6 Free', FontAwesome, sans-serif !important;
    font-weight: 900 !important;
}

/* The PDF button is self-explanatory; no tooltip marker/behavior. */
body.frontiers-article-template .fr-pdf-btn[data-tooltip] {
    cursor: pointer;
}

/* Page scrolling should use the browser's normal smooth behavior for explicit
   in-page navigation, while JS sets TOC clicks to a header-aware smooth jump. */
html {
    scroll-behavior: smooth;
}
body.frontiers-article-template .fr-toc-scroll-area,
body.frontiers-article-template .fr-sheet-content {
    scroll-behavior: auto !important;
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto !important; }
}

/* ==========================================================================
   REFINEMENTS 5.3.0: extended font lab, font weight + line-height controls
   ========================================================================== */
:root {
    --fr-article-weight: 400;
    --fr-article-line-height: 1.95;
}

/* Additional local fonts. Put these files in /assets/fonts/ exactly as named.
   Both .woff2 and .woff are listed where you said both are available. */
@font-face { font-family: 'Abar'; src: url('fonts/AbarLow-Regular.woff2') format('woff2'), url('fonts/AbarLow-Regular.woff') format('woff'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Abar'; src: url('fonts/AbarLow-SemiBold.woff2') format('woff2'), url('fonts/AbarLow-SemiBold.woff') format('woff'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Abar'; src: url('fonts/AbarLow-Bold.woff2') format('woff2'), url('fonts/AbarLow-Bold.woff') format('woff'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Abar'; src: url('fonts/AbarLow-ExtraBold.woff2') format('woff2'), url('fonts/AbarLow-ExtraBold.woff') format('woff'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'Abar'; src: url('fonts/AbarLow-Black.woff2') format('woff2'), url('fonts/AbarLow-Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; }

@font-face { font-family: 'On'; src: url('fonts/OnLight.woff2') format('woff2'), url('fonts/OnLight.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'On'; src: url('fonts/OnNormal.woff2') format('woff2'), url('fonts/OnNormal.woff') format('woff'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'On'; src: url('fonts/OnMedium.woff2') format('woff2'), url('fonts/OnMedium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'On'; src: url('fonts/OnSemiBold.woff2') format('woff2'), url('fonts/OnSemiBold.woff') format('woff'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'On'; src: url('fonts/OnBold.woff2') format('woff2'), url('fonts/OnBold.woff') format('woff'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'On'; src: url('fonts/OnBlack.woff2') format('woff2'), url('fonts/OnBlack.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; }

@font-face { font-family: 'IRANYekanX'; src: url('fonts/IRANYekanX-UltraLight.woff2') format('woff2'), url('fonts/IRANYekanX-UltraLight.woff') format('woff'); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: 'IRANYekanX'; src: url('fonts/IRANYekanX-Thin.woff2') format('woff2'), url('fonts/IRANYekanX-Thin.woff') format('woff'); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: 'IRANYekanX'; src: url('fonts/IRANYekanX-Light.woff2') format('woff2'), url('fonts/IRANYekanX-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'IRANYekanX'; src: url('fonts/IRANYekanX-Regular.woff2') format('woff2'), url('fonts/IRANYekanX-Regular.woff') format('woff'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'IRANYekanX'; src: url('fonts/IRANYekanX-Medium.woff2') format('woff2'), url('fonts/IRANYekanX-Medium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'IRANYekanX'; src: url('fonts/IRANYekanX-DemiBold.woff2') format('woff2'), url('fonts/IRANYekanX-DemiBold.woff') format('woff'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'IRANYekanX'; src: url('fonts/IRANYekanX-Bold.woff2') format('woff2'), url('fonts/IRANYekanX-Bold.woff') format('woff'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'IRANYekanX'; src: url('fonts/IRANYekanX-ExtraBold.woff2') format('woff2'), url('fonts/IRANYekanX-ExtraBold.woff') format('woff'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'IRANYekanX'; src: url('fonts/IRANYekanX-Black.woff2') format('woff2'), url('fonts/IRANYekanX-Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'IRANYekanX'; src: url('fonts/IRANYekanX-ExtraBlack.woff2') format('woff2'), url('fonts/IRANYekanX-ExtraBlack.woff') format('woff'); font-weight: 950; font-style: normal; font-display: swap; }
@font-face { font-family: 'IRANYekanX'; src: url('fonts/IRANYekanX-Heavy.woff2') format('woff2'), url('fonts/IRANYekanX-Heavy.woff') format('woff'); font-weight: 1000; font-style: normal; font-display: swap; }

@font-face { font-family: 'Dana'; src: url('fonts/Dana-Hairline.woff2') format('woff2'), url('fonts/Dana-Hairline.woff') format('woff'); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dana'; src: url('fonts/Dana-Thin.woff2') format('woff2'), url('fonts/Dana-Thin.woff') format('woff'); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dana'; src: url('fonts/Dana-UltraLight.woff2') format('woff2'), url('fonts/Dana-UltraLight.woff') format('woff'); font-weight: 250; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dana'; src: url('fonts/Dana-Light.woff2') format('woff2'), url('fonts/Dana-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dana'; src: url('fonts/Dana-Regular.woff2') format('woff2'), url('fonts/Dana-Regular.woff') format('woff'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dana'; src: url('fonts/Dana-Medium.woff2') format('woff2'), url('fonts/Dana-Medium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dana'; src: url('fonts/Dana-DemiBold.woff2') format('woff2'), url('fonts/Dana-DemiBold.woff') format('woff'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dana'; src: url('fonts/Dana-Bold.woff2') format('woff2'), url('fonts/Dana-Bold.woff') format('woff'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dana'; src: url('fonts/Dana-ExtraBold.woff2') format('woff2'), url('fonts/Dana-ExtraBold.woff') format('woff'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dana'; src: url('fonts/Dana-Black.woff2') format('woff2'), url('fonts/Dana-Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dana'; src: url('fonts/Dana-ExtraBlack.woff2') format('woff2'), url('fonts/Dana-ExtraBlack.woff') format('woff'); font-weight: 950; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dana'; src: url('fonts/Dana-Heavy.woff2') format('woff2'), url('fonts/Dana-Heavy.woff') format('woff'); font-weight: 1000; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dana'; src: url('fonts/Dana-fat.woff2') format('woff2'), url('fonts/Dana-fat.woff') format('woff'); font-weight: 1050; font-style: normal; font-display: swap; }

@font-face { font-family: 'Mahoor'; src: url('fonts/Mahoor-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Mahoor'; src: url('fonts/Mahoor-Medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Mahoor'; src: url('fonts/Mahoor-SemiBold.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Mahoor'; src: url('fonts/Mahoor-Bold.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Mahoor'; src: url('fonts/Mahoor-ExtraBold.woff2') format('woff2'); font-weight: 800; font-style: normal; font-display: swap; }

@font-face { font-family: 'Ravi'; src: url('fonts/Ravi-Thin.woff2') format('woff2'), url('fonts/Ravi-Thin.woff') format('woff'); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: 'Ravi'; src: url('fonts/Ravi-Light.woff2') format('woff2'), url('fonts/Ravi-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'Ravi'; src: url('fonts/Ravi-Regular.woff2') format('woff2'), url('fonts/Ravi-Regular.woff') format('woff'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Ravi'; src: url('fonts/Ravi-Medium.woff2') format('woff2'), url('fonts/Ravi-Medium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Ravi'; src: url('fonts/Ravi-SemiBold.woff2') format('woff2'), url('fonts/Ravi-SemiBold.woff') format('woff'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Ravi'; src: url('fonts/Ravi-Bold.woff2') format('woff2'), url('fonts/Ravi-Bold.woff') format('woff'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Ravi'; src: url('fonts/Ravi-Black.woff2') format('woff2'), url('fonts/Ravi-Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Ravi'; src: url('fonts/Ravi-ExtraBlack.woff2') format('woff2'), url('fonts/Ravi-ExtraBlack.woff') format('woff'); font-weight: 950; font-style: normal; font-display: swap; }

@font-face { font-family: 'YekanBakh'; src: url('fonts/YekanBakh-Thin.woff2') format('woff2'), url('fonts/YekanBakh-Thin.woff') format('woff'); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: 'YekanBakh'; src: url('fonts/YekanBakh-Light.woff2') format('woff2'), url('fonts/YekanBakh-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'YekanBakh'; src: url('fonts/YekanBakh-Regular.woff2') format('woff2'), url('fonts/YekanBakh-Regular.woff') format('woff'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'YekanBakh'; src: url('fonts/YekanBakh-SemiBold.woff2') format('woff2'), url('fonts/YekanBakh-SemiBold.woff') format('woff'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'YekanBakh'; src: url('fonts/YekanBakh-Bold.woff2') format('woff2'), url('fonts/YekanBakh-Bold.woff') format('woff'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'YekanBakh'; src: url('fonts/YekanBakh-ExtraBold.woff2') format('woff2'), url('fonts/YekanBakh-ExtraBold.woff') format('woff'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'YekanBakh'; src: url('fonts/YekanBakh-Black.woff2') format('woff2'), url('fonts/YekanBakh-Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'YekanBakh'; src: url('fonts/YekanBakh-ExtraBlack.woff2') format('woff2'), url('fonts/YekanBakh-ExtraBlack.woff') format('woff'); font-weight: 950; font-style: normal; font-display: swap; }

@font-face { font-family: 'BonyadeKoodak'; src: url('fonts/BonyadeKoodak-Thin.woff2') format('woff2'), url('fonts/BonyadeKoodak-Thin.woff') format('woff'); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: 'BonyadeKoodak'; src: url('fonts/BonyadeKoodak-ExtraLight.woff2') format('woff2'), url('fonts/BonyadeKoodak-ExtraLight.woff') format('woff'); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: 'BonyadeKoodak'; src: url('fonts/BonyadeKoodak-Light.woff2') format('woff2'), url('fonts/BonyadeKoodak-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'BonyadeKoodak'; src: url('fonts/BonyadeKoodak-Regular.woff2') format('woff2'), url('fonts/BonyadeKoodak-Regular.woff') format('woff'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'BonyadeKoodak'; src: url('fonts/BonyadeKoodak-Medium.woff2') format('woff2'), url('fonts/BonyadeKoodak-Medium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'BonyadeKoodak'; src: url('fonts/BonyadeKoodak-Bold.woff2') format('woff2'), url('fonts/BonyadeKoodak-Bold.woff') format('woff'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'BonyadeKoodak'; src: url('fonts/BonyadeKoodak-ExtraBold.woff2') format('woff2'), url('fonts/BonyadeKoodak-ExtraBold.woff') format('woff'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'BonyadeKoodak'; src: url('fonts/BonyadeKoodak-Black.woff2') format('woff2'), url('fonts/BonyadeKoodak-Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; }

@font-face { font-family: 'Dibaj'; src: url('fonts/Dibaj UltraLight.woff2') format('woff2'), url('fonts/Dibaj UltraLight.woff') format('woff'); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dibaj'; src: url('fonts/Dibaj Light.woff2') format('woff2'), url('fonts/Dibaj Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dibaj'; src: url('fonts/Dibaj Regular.woff2') format('woff2'), url('fonts/Dibaj Regular.woff') format('woff'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dibaj'; src: url('fonts/Dibaj Medium.woff2') format('woff2'), url('fonts/Dibaj Medium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dibaj'; src: url('fonts/Dibaj SemiBold.woff2') format('woff2'), url('fonts/Dibaj SemiBold.woff') format('woff'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dibaj'; src: url('fonts/Dibaj Bold.woff2') format('woff2'), url('fonts/Dibaj Bold.woff') format('woff'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dibaj'; src: url('fonts/Dibaj ExtraBold.woff2') format('woff2'), url('fonts/Dibaj ExtraBold.woff') format('woff'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dibaj'; src: url('fonts/Dibaj Black.woff2') format('woff2'), url('fonts/Dibaj Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Dibaj'; src: url('fonts/Dibaj SuperBlack.woff2') format('woff2'), url('fonts/Dibaj SuperBlack.woff') format('woff'); font-weight: 950; font-style: normal; font-display: swap; }

/* Apply the testing controls to the reading text and TOC. */
body.frontiers-article-template .fr-article-body {
    line-height: var(--fr-article-line-height) !important;
}
body.frontiers-article-template .fr-article-body p,
body.frontiers-article-template .fr-article-body li,
body.frontiers-article-template .fr-article-body div:not(.fr-shaded-box):not(.fr-table-wrapper):not(.fr-table-shell),
body.frontiers-article-template .fr-article-body span:not(.fr-label):not(.fr-inline-tooltip),
body.frontiers-article-template .fr-toc-nav a {
    font-weight: var(--fr-article-weight) !important;
    line-height: var(--fr-article-line-height) !important;
}
body.frontiers-article-template .fr-article-body strong,
body.frontiers-article-template .fr-article-body b,
body.frontiers-article-template .fr-inline-tooltip strong,
body.frontiers-article-template .fr-inline-tooltip b {
    font-weight: 700 !important;
}

body.frontiers-article-template .fr-setting-group-compact .fr-select {
    min-height: 38px;
}


/* ==========================================================================
   REFINEMENTS 5.4.0: final font set, 95%-scaled base size, fixed 2.10 line-height
   ========================================================================== */
:root {
    --fr-article-line-height: 2.10;
    --fr-article-weight: 400;
}

/* Final reader fonts are: Sahel, IranYekan, Bonyade Koodak. Keep the settings
   panel itself in the selected font too. */
body.frontiers-article-template .fr-settings-card,
body.frontiers-article-template .fr-settings-card *,
body.frontiers-article-template .fr-select,
body.frontiers-article-template .fr-stepper,
body.frontiers-article-template .fr-settings-collapse {
    font-family: var(--fr-article-font) !important;
}

body.frontiers-article-template .fr-article-body {
    line-height: 2.10 !important;
}
body.frontiers-article-template .fr-article-body p,
body.frontiers-article-template .fr-article-body li,
body.frontiers-article-template .fr-article-body div:not(.fr-shaded-box):not(.fr-table-wrapper):not(.fr-table-shell),
body.frontiers-article-template .fr-article-body span:not(.fr-label):not(.fr-inline-tooltip),
body.frontiers-article-template .fr-toc-nav a {
    line-height: 2.10 !important;
    font-weight: 400 !important;
}

/* Preserve actual rich formatting after the general final weight rule. */
body.frontiers-article-template .fr-article-body strong,
body.frontiers-article-template .fr-article-body b,
body.frontiers-article-template .fr-inline-tooltip strong,
body.frontiers-article-template .fr-inline-tooltip b {
    font-weight: 700 !important;
}

/* ==========================================================================
   REFINEMENTS 5.6.0: TOC rail transition, better reading-time exclusion,
   dark-mode image treatment
   ========================================================================== */

/* TOC active indicator: a quiet rail moves directly to the destination item.
   During TOC-click smooth body scroll, the TOC no longer steps through every
   intermediate heading. */
body.frontiers-article-template .fr-toc-nav {
    position: relative;
}
body.frontiers-article-template .fr-toc-rail {
    position: absolute;
    right: 0;
    top: 0;
    width: 2px;
    height: 0;
    border-radius: 999px;
    background: color-mix(in srgb, var(--fr-accent) 72%, var(--fr-text));
    opacity: .82;
    transform: translateY(0);
    transition: transform .24s ease, height .24s ease, opacity .18s ease;
    pointer-events: none;
    z-index: 1;
}
body.frontiers-article-template .fr-toc-nav a {
    position: relative;
    z-index: 2;
    border-right-color: transparent !important;
}
body.frontiers-article-template .fr-toc-nav a.active {
    border-right-color: transparent !important;
}
@media (prefers-reduced-motion: reduce) {
    body.frontiers-article-template .fr-toc-rail {
        transition: none !important;
    }
}

/* Dark-mode treatment for article images with white backgrounds. Best practice:
   don't invert content images; instead place them on a softened image-card and
   slightly reduce harsh white brightness in dark themes. */
body.frontiers-article-template .fr-article-body img {
    max-width: 100%;
    height: auto;
    border-radius: 14px;
}
html[data-theme^="dark"] body.frontiers-article-template .fr-article-body figure,
html[data-theme^="dark"] body.frontiers-article-template .fr-article-body .wp-caption {
    background: color-mix(in srgb, var(--fr-surface) 82%, var(--fr-bg)) !important;
    border: 1px solid var(--fr-border);
    border-radius: 18px;
    padding: .55rem;
}
html[data-theme^="dark"] body.frontiers-article-template .fr-article-body p > img,
html[data-theme^="dark"] body.frontiers-article-template .fr-article-body figure img,
html[data-theme^="dark"] body.frontiers-article-template .fr-article-body .wp-block-image img,
html[data-theme^="dark"] body.frontiers-article-template .fr-article-body .wp-caption img {
    background: #f1eee6;
    padding: .45rem;
    border-radius: 14px;
    filter: brightness(.90) contrast(.96) saturate(.96);
    box-shadow: 0 10px 30px rgba(0,0,0,.18);
}
html[data-theme="dark-2"] body.frontiers-article-template .fr-article-body p > img,
html[data-theme="dark-2"] body.frontiers-article-template .fr-article-body figure img,
html[data-theme="dark-2"] body.frontiers-article-template .fr-article-body .wp-block-image img,
html[data-theme="dark-2"] body.frontiers-article-template .fr-article-body .wp-caption img {
    filter: brightness(.86) contrast(.95) saturate(.94);
}


/* ==========================================================================
   REFINEMENTS 5.7.0: reading-time fix + centered/heavier title
   ========================================================================== */
body.frontiers-article-template .fr-article-title {
    text-align: center !important;
    text-align-last: center !important;
    font-weight: 700 !important;
}
@media (max-width: 767px) {
    body.frontiers-article-template .fr-article-title {
        text-align: center !important;
        text-align-last: center !important;
        font-weight: 600 !important;
    }
}