/* =========================================================
   International Journal of Computational Intelligence
   IJCI — Professional Janeway Homepage Theme

   BRAND SYSTEM
   Primary Burnt Orange : #C83F0A
   Deep Navy            : #062653
   Dark Navy            : #0B1F3A
   Slate                : #475569
   Muted Slate          : #64748B
   Soft Background      : #F7F9FC
   Border               : #E2E8F0
   White                : #FFFFFF

   Visual Direction:
   Academic
   Computational
   Editorial
   Modern
   Structured
   ========================================================= */


/* =========================================================
   GLOBAL CONTAINER
   ========================================================= */

.jais-container {
    font-family: 'Merriweather', Georgia, 'Times New Roman', serif !important;
    max-width: 1220px !important;
    margin: 45px auto 70px !important;
    padding: 0 24px !important;
    color: #1E293B !important;
    line-height: 1.8 !important;
}

.jais-container h1,
.jais-container h2,
.jais-container h3 {
    font-family: 'Merriweather', Georgia, 'Times New Roman', serif !important;
    font-weight: 700 !important;
    letter-spacing: -0.025em !important;
    color: #062653 !important;
}

.jais-container p {
    color: #475569 !important;
    line-height: 1.85 !important;
}


/* =========================================================
   SECTION HEADINGS
   Distinctive asymmetric IJCI editorial treatment
   ========================================================= */

.jais-container h2 {
    position: relative !important;
    text-align: left !important;
    font-size: 2rem !important;
    margin: 65px 0 32px !important;
    padding-left: 18px !important;
    color: #062653 !important;
}

.jais-container h2:before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 7px !important;
    width: 5px !important;
    height: 38px !important;
    background: #C83F0A !important;
    border-radius: 3px !important;
}

.jais-container h2:after {
    content: "" !important;
    display: block !important;
    width: 55px !important;
    height: 3px !important;
    margin: 10px 0 0 0 !important;
    background: #C83F0A !important;
    border-radius: 2px !important;
}


/* =========================================================
   HERO SECTION
   Editorial split-panel design
   ========================================================= */

.jais-hero {
    position: relative !important;
    overflow: hidden !important;
    background:
        linear-gradient(
            115deg,
            #FFFFFF 0%,
            #FFFFFF 62%,
            #F7F9FC 100%
        ) !important;

    border: 1px solid #E2E8F0 !important;
    border-left: 7px solid #C83F0A !important;

    border-radius: 6px !important;

    padding: 58px 60px 62px !important;

    margin-bottom: 55px !important;

    box-shadow:
        0 14px 38px rgba(6, 38, 83, 0.07) !important;

    text-align: left !important;
}


/* Decorative computational line */

.jais-hero:after {
    content: "" !important;
    position: absolute !important;
    right: -80px !important;
    top: -80px !important;
    width: 260px !important;
    height: 260px !important;

    border: 1px solid rgba(200, 63, 10, 0.15) !important;
    border-radius: 50% !important;

    box-shadow:
        0 0 0 22px rgba(200, 63, 10, 0.025),
        0 0 0 45px rgba(6, 38, 83, 0.025) !important;

    pointer-events: none !important;
}


.jais-hero h1 {
    position: relative !important;
    z-index: 2 !important;

    max-width: 850px !important;

    font-size: 2.75rem !important;
    line-height: 1.25 !important;

    color: #062653 !important;

    margin: 0 0 18px !important;
}


/* Hero paragraph */

.jais-hero p {
    position: relative !important;
    z-index: 2 !important;

    max-width: 850px !important;

    margin: 0 !important;

    color: #475569 !important;

    font-size: 1.08rem !important;
}


/* Orange emphasis inside hero */

.jais-hero strong {
    color: #C83F0A !important;
}


/* =========================================================
   JOURNAL AT A GLANCE
   Structured editorial information panel
   ========================================================= */

.jais-table-wrap {
    max-width: 1000px !important;

    margin: 0 auto 55px !important;

    overflow: hidden !important;

    background: #FFFFFF !important;

    border: 1px solid #DCE4ED !important;

    border-radius: 6px !important;

    box-shadow:
        0 8px 26px rgba(6, 38, 83, 0.045) !important;
}


.jais-table-wrap table {
    width: 100% !important;

    border-collapse: collapse !important;

    background: #FFFFFF !important;
}


.jais-table-wrap td {
    padding: 20px 22px !important;

    border-bottom: 1px solid #E8EDF3 !important;

    vertical-align: middle !important;
}


.jais-table-wrap tr:last-child td {
    border-bottom: none !important;
}


/* Label column */

.jais-table-label {
    width: 30% !important;

    background: #F7F9FC !important;

    color: #062653 !important;

    font-weight: 700 !important;

    border-right: 1px solid #E2E8F0 !important;
}


/* Value column */

.jais-table-value {
    width: 70% !important;

    background: #FFFFFF !important;

    color: #334155 !important;

    font-weight: 500 !important;
}


/* Icons */

.jais-table-icon {
    display: inline-block !important;

    color: #C83F0A !important;

    margin-right: 10px !important;

    font-size: 1.05rem !important;

    min-width: 18px !important;
}


/* =========================================================
   CARDS
   Editorial flat-card treatment
   ========================================================= */

.jais-card {
    position: relative !important;

    background: #FFFFFF !important;

    border: 1px solid #E2E8F0 !important;

    border-radius: 5px !important;

    padding: 30px 34px !important;

    margin-top: 32px !important;

    box-shadow:
        0 7px 24px rgba(6, 38, 83, 0.045) !important;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease !important;
}


.jais-card:hover {
    border-color: rgba(200, 63, 10, 0.45) !important;

    box-shadow:
        0 12px 30px rgba(6, 38, 83, 0.08) !important;
}


/* Small orange vertical indicator */

.jais-card:before {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 22px !important;

    width: 4px !important;
    height: 42px !important;

    background: #C83F0A !important;

    border-radius: 0 3px 3px 0 !important;
}


.jais-card-title {
    color: #062653 !important;

    font-size: 1.35rem !important;

    font-weight: 700 !important;

    margin: 0 0 18px !important;

    padding-bottom: 14px !important;

    border-bottom: 1px solid #E5EAF0 !important;
}


/* =========================================================
   FEATURE GRID
   ========================================================= */

.jais-feature-grid {
    list-style: none !important;

    display: grid !important;

    grid-template-columns: repeat(2, 1fr) !important;

    column-gap: 45px !important;

    row-gap: 0 !important;

    margin: 0 !important;

    padding: 0 !important;
}


.jais-feature-grid li {
    position: relative !important;

    padding: 13px 0 13px 30px !important;

    border-bottom: 1px solid #EEF2F6 !important;

    color: #334155 !important;

    font-size: 0.98rem !important;
}


/* Custom IJCI marker */

.jais-feature-grid li:before {
    content: "✓" !important;

    position: absolute !important;

    left: 0 !important;

    top: 12px !important;

    width: 19px !important;

    height: 19px !important;

    line-height: 19px !important;

    text-align: center !important;

    border-radius: 50% !important;

    background: #C83F0A !important;

    color: #FFFFFF !important;

    font-size: 0.72rem !important;

    font-weight: 700 !important;
}


/* =========================================================
   PRIMARY BUTTON
   Academic rectangular style
   ========================================================= */

.jais-btn-primary {
    display: inline-block !important;

    padding: 12px 27px !important;

    border-radius: 4px !important;

    border: 1px solid #C83F0A !important;

    text-decoration: none !important;

    background: #C83F0A !important;

    color: #FFFFFF !important;

    font-family:
        'Merriweather',
        Georgia,
        'Times New Roman',
        serif !important;

    font-weight: 700 !important;

    font-size: 0.95rem !important;

    letter-spacing: 0.01em !important;

    transition:
        background 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease,
        box-shadow 0.2s ease !important;

    box-shadow:
        0 5px 14px rgba(200, 63, 10, 0.18) !important;
}


.jais-btn-primary:hover {
    background: #A93207 !important;

    border-color: #A93207 !important;

    color: #FFFFFF !important;

    text-decoration: none !important;

    transform: translateY(-2px) !important;

    box-shadow:
        0 8px 20px rgba(200, 63, 10, 0.24) !important;
}


/* =========================================================
   OUTLINE BUTTON
   ========================================================= */

.jais-btn-outline {
    display: inline-block !important;

    padding: 11px 26px !important;

    border-radius: 4px !important;

    border: 1px solid #062653 !important;

    text-decoration: none !important;

    background: #FFFFFF !important;

    color: #062653 !important;

    font-family:
        'Merriweather',
        Georgia,
        'Times New Roman',
        serif !important;

    font-weight: 600 !important;

    font-size: 0.95rem !important;

    transition:
        background 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease !important;
}


.jais-btn-outline:hover {
    background: #062653 !important;

    border-color: #062653 !important;

    color: #FFFFFF !important;

    text-decoration: none !important;
}


/* =========================================================
   QUICK ACCESS
   Distinct tile-based navigation
   ========================================================= */

.jais-quick-grid {
    display: grid !important;

    grid-template-columns:
        repeat(auto-fit, minmax(205px, 1fr)) !important;

    gap: 14px !important;

    margin-top: 25px !important;
}


.jais-quick-grid a {
    position: relative !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    min-height: 58px !important;

    padding: 13px 15px !important;

    text-align: center !important;

    border-radius: 5px !important;

    border: 1px solid #DCE4ED !important;

    background: #FFFFFF !important;

    color: #062653 !important;

    font-weight: 600 !important;

    text-decoration: none !important;

    transition:
        background 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease !important;
}


/* Orange top indicator */

.jais-quick-grid a:before {
    content: "" !important;

    position: absolute !important;

    left: 18px !important;

    right: 18px !important;

    top: -1px !important;

    height: 3px !important;

    background: #C83F0A !important;

    transform: scaleX(0) !important;

    transform-origin: center !important;

    transition: transform 0.2s ease !important;
}


.jais-quick-grid a:hover {
    background: #062653 !important;

    border-color: #062653 !important;

    color: #FFFFFF !important;

    transform: translateY(-2px) !important;
}


.jais-quick-grid a:hover:before {
    transform: scaleX(1) !important;
}


/* Primary buttons inside quick grid */

.jais-quick-grid .jais-btn-primary {
    background: #C83F0A !important;

    border-color: #C83F0A !important;

    color: #FFFFFF !important;
}


/* =========================================================
   CLOSING SECTION
   ========================================================= */

.jais-closing {
    position: relative !important;

    margin-top: 70px !important;

    padding: 45px 25px 15px !important;

    border-top: 1px solid #DCE4ED !important;

    text-align: center !important;
}


/* Decorative center marker */

.jais-closing:before {
    content: "" !important;

    position: absolute !important;

    top: -2px !important;

    left: 50% !important;

    transform: translateX(-50%) !important;

    width: 80px !important;

    height: 3px !important;

    background: #C83F0A !important;
}


.jais-closing h3 {
    color: #062653 !important;

    font-size: 1.5rem !important;

    margin-bottom: 12px !important;
}


.jais-closing p {
    max-width: 780px !important;

    margin: 12px auto 0 !important;

    color: #64748B !important;

    font-size: 1.02rem !important;

    line-height: 1.85 !important;
}


/* =========================================================
   LINKS
   Excludes IJCI buttons
   ========================================================= */

.jais-container a:not(.jais-btn-primary):not(.jais-btn-outline) {
    color: #C83F0A !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.jais-container a:not(.jais-btn-primary):not(.jais-btn-outline):hover,
.jais-container a:not(.jais-btn-primary):not(.jais-btn-outline):focus {
    color: #A93207 !important;
    text-decoration: underline !important;
}


/* =========================================================
   EMPHASIZED TEXT
   ========================================================= */

.jais-container strong {
    color: #062653 !important;
}


.jais-container em {
    color: #475569 !important;
}


/* =========================================================
   SELECTION
   ========================================================= */

.jais-container ::selection {
    background: #C83F0A !important;

    color: #FFFFFF !important;
}


/* =========================================================
   RESPONSIVE — TABLET
   ========================================================= */

@media (max-width: 900px) {

    .jais-container {
        padding: 0 20px !important;
    }

    .jais-hero {
        padding: 45px 38px 48px !important;
    }

    .jais-hero h1 {
        font-size: 2.35rem !important;
    }

    .jais-feature-grid {
        column-gap: 25px !important;
    }
}


/* =========================================================
   RESPONSIVE — MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .jais-container {
        margin-top: 25px !important;

        margin-bottom: 45px !important;

        padding: 0 15px !important;
    }


    .jais-container h2 {
        font-size: 1.65rem !important;

        margin-top: 45px !important;

        margin-bottom: 25px !important;
    }


    .jais-container h2:before {
        height: 30px !important;

        top: 5px !important;
    }


    /* Hero */

    .jais-hero {
        padding: 38px 25px 42px !important;

        border-left-width: 5px !important;

        border-radius: 4px !important;

        margin-bottom: 40px !important;
    }


    .jais-hero h1 {
        font-size: 1.9rem !important;

        line-height: 1.35 !important;
    }


    .jais-hero p {
        font-size: 0.98rem !important;

        line-height: 1.75 !important;
    }


    /* Information table */

    .jais-table-wrap {
        border-radius: 4px !important;
    }


    .jais-table-wrap td {
        display: block !important;

        width: 100% !important;

        box-sizing: border-box !important;

        padding: 15px 18px !important;
    }


    .jais-table-label {
        width: 100% !important;

        background: #062653 !important;

        color: #FFFFFF !important;

        border-right: none !important;

        border-bottom: none !important;
    }


    .jais-table-value {
        width: 100% !important;

        background: #F7F9FC !important;

        color: #334155 !important;

        padding-left: 18px !important;
    }


    .jais-table-icon {
        color: #C83F0A !important;
    }


    /* Cards */

    .jais-card {
        padding: 25px 22px !important;

        border-radius: 4px !important;
    }


    .jais-card-title {
        font-size: 1.18rem !important;
    }


    /* Features */

    .jais-feature-grid {
        grid-template-columns: 1fr !important;

        gap: 0 !important;
    }


    .jais-feature-grid li {
        padding: 11px 0 11px 28px !important;
    }


    /* Buttons */

    .jais-btn-primary,
    .jais-btn-outline {
        width: 100% !important;

        box-sizing: border-box !important;

        text-align: center !important;

        margin-bottom: 10px !important;
    }


    /* Quick links */

    .jais-quick-grid {
        grid-template-columns: 1fr !important;

        gap: 10px !important;
    }


    .jais-quick-grid a {
        min-height: 52px !important;
    }


    /* Closing */

    .jais-closing {
        margin-top: 50px !important;

        padding-top: 35px !important;
    }
}


/* =========================================================
   VERY SMALL MOBILE DEVICES
   ========================================================= */

@media (max-width: 480px) {

    .jais-container {
        padding: 0 12px !important;
    }

    .jais-hero {
        padding: 30px 20px 34px !important;
    }

    .jais-hero h1 {
        font-size: 1.65rem !important;
    }

    .jais-container h2 {
        font-size: 1.45rem !important;
    }

    .jais-card {
        padding: 22px 18px !important;
    }
}