.archive-section{
    padding-top:30px;
    background:#f8fafb;
}

.archive-title{
    font-size:38px;
    font-weight:700;
    color:#2b4f43;
}

.archive-subtitle{
    color:#d4a017;
    font-weight:600;
    letter-spacing:2px;
    text-transform:uppercase;
}

.archive-desc{
    max-width:700px;
    margin:auto;
    color:#666;
}

.archive-block{
    background:#fff;
    padding:30px;
    border-radius:15px;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
}

.archive-year{
    margin-bottom:25px;
}

.archive-year span{
    background:#2b4f43;
    color:#fff;
    padding:10px 30px;
    border-radius:30px;
    font-size:24px;
    font-weight:700;
}

.archive-buttons{
    display:flex;
    flex-wrap:wrap;
    gap:20px;
}

.issue-btn{
    width:210px;
    height:95px;
    background:#fff;
    border:2px solid #e5e5e5;
    border-radius:12px;
    text-align:center;
    padding-top:18px;
    text-decoration:none;
    color:#2b4f43;
    transition:.35s;
    position:relative;
}

.issue-btn strong{
    display:block;
    font-size:19px;
}

.issue-btn small{
    display:block;
    color:#777;
    margin-top:6px;
    font-size:15px;
}

.issue-btn:hover{
    background:#2b4f43;
    color:#fff;
    transform:translateY(-6px);
    border-color:#2b4f43;
    text-decoration:none;
}

.issue-btn:hover small{
    color:#fff;
}

.latest{
    border:2px solid #d4a017;
}

.badge-new{
    position:absolute;
    top:-12px;
    right:15px;
    background:#d4a017;
    color:#fff;
    font-size:11px;
    padding:4px 10px;
    border-radius:20px;
    font-weight:bold;
}

.archive-header{
    margin-bottom:25px;
}

.archive-label{
    display:inline-block;
    background:#f5b400;
    color:#fff;
    padding:6px 18px;
    border-radius:30px;
    font-size:13px;
    font-weight:600;
    letter-spacing:1px;
    text-transform:uppercase;
}

.archive-text{
    color:#777;
    max-width:650px;
    margin:15px auto 0;
    margin-bottom:-60px;
}

.year-heading{
    display:flex;
    align-items:center;
    margin-bottom:15px;
}

.year-circle{
    background:#2d5a4a;
    color:#fff;
    width:85px;
    height:85px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:26px;
    font-weight:700;
}

.year-line{
    flex:1;
    height:3px;
    background:#d4af37;
    margin-left:20px;
}

.issue-btn h5{
    margin:10px 0 5px;
    font-weight:700;
}

.issue-btn p{
    margin:0;
    color:#666;
}

.view-link{
    display:block;
    margin-top:15px;
    color:#d4af37;
    font-weight:600;
}

.issue-status{
    position:absolute;
    top:10px;
    right:10px;
    background:#d4af37;
    color:#fff;
    padding:3px 10px;
    font-size:11px;
    border-radius:20px;
}
.archive-info{
    background:#f8f9fa;
}

.info-box{
    background:#fff;
    padding:35px;
    text-align:center;
    border-radius:12px;
    box-shadow:0 5px 15px rgba(0,0,0,.08);
    transition:.3s;
    height:100%;
}

.info-box:hover{
    transform:translateY(-8px);
}

.info-box i{
    font-size:42px;
    color:#c59d23;
    margin-bottom:15px;
}

.info-box h4{
    font-weight:700;
    color:#2b4f43;
}

.quick-box{
    display:block;
    background:#2b4f43;
    color:#fff;
    padding:25px;
    text-align:center;
    border-radius:10px;
    transition:.3s;
    text-decoration:none;
}

.quick-box:hover{
    background:#c59d23;
    color:#fff;
}

.quick-box i{
    font-size:30px;
    display:block;
    margin-bottom:12px;
}
.journal-highlights{
    background:#ffffff;
}

.highlight-box{
    background:#fff;
    border-radius:12px;
    padding:30px;
    text-align:center;
    box-shadow:0 8px 20px rgba(0,0,0,.08);
    transition:.3s;
    height:100%;
}

.highlight-box:hover{
    transform:translateY(-8px);
}

.highlight-box i{
    font-size:42px;
    color:#d4af37;
    margin-bottom:15px;
}

.highlight-box h5{
    color:#2b4f43;
    font-weight:700;
}

.indexed-section{
    background:#f7f9fb;
}

.index-box{
    background:#fff;
    padding:20px;
    border-radius:10px;
    font-weight:600;
    box-shadow:0 5px 15px rgba(0,0,0,.05);
    transition:.3s;
}

.index-box:hover{
    background:#2b4f43;
    color:#fff;
}

.archive-cta{
    background:#2b4f43;
}

.cta-box h2{
    color:#fff;
    font-weight:700;
}

.cta-box p{
    color:#f0f0f0;
    margin:20px auto;
    max-width:700px;
}

.btn-outline-light{
    border:2px solid #fff;
}

/*==================================
        PREMIUM HERO
==================================*/

/* =========================
   ARCHIVE HERO
========================= */

.archive-hero {
    position: relative;
    width: 100%;
    height: 265px;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 8% 55%,
            rgba(8, 83, 68, 0.07) 0,
            rgba(8, 83, 68, 0.04) 115px,
            transparent 116px
        ),
        linear-gradient(
            110deg,
            #f5faf8 0%,
            #ffffff 42%,
            #ffffff 100%
        );

    border-bottom: 1px solid #eef2f0;
}


/* Main container */

.archive-hero-inner {
    width: 84%;
    max-width: 1180px;
    height: 100%;
    margin: auto;

    display: flex;
    align-items: center;

    position: relative;
    z-index: 2;
}


/* =========================
   ROUND ARCHIVE ICON
========================= */

.archive-icon {
    width: 124px;
    height: 124px;

    flex: 0 0 124px;

    border-radius: 50%;

    background: #d4af37;

    display: flex;
    align-items: center;
    justify-content: center;

    box-shadow:
        0 8px 22px rgba(0, 63, 50, 0.08);

    color: #ffffff;

    font-size: 48px;
}


/* =========================
   VERTICAL DIVIDER
========================= */

.archive-divider {
    width: 1px;
    height: 124px;

    background: #dce4e1;

    margin-left: 42px;
    margin-right: 40px;
}


/* =========================
   TEXT CONTENT
========================= */

.archive-content {
    max-width: 600px;
}

.archive-content h1 {
    margin: 0 0 16px;

    color: #172b2b;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 46px;
    line-height: 1.05;

    font-weight: 700;

    letter-spacing: -1.5px;
}


.archive-content p {
    margin: 0;

    max-width: 590px;

    color: #263838;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 17px;
    line-height: 1.85;

    font-weight: 400;
}


.archive-content strong {
    font-weight: 700;
    color: #174b42;
}


/* =========================
   RIGHT DECORATION
========================= */

.archive-decoration {
    position: absolute;

    right: -40px;
    bottom: -15px;

    width: 360px;
    height: 205px;

    opacity: 0.20;

    pointer-events: none;
}


/* Large pale circle */

.archive-decoration::before {
    content: "";

    position: absolute;

    width: 370px;
    height: 370px;

    right: -80px;
    top: -170px;

    border-radius: 50%;

    background: #e6efec;

    z-index: -2;
}


/* =========================
   BOOKS
========================= */

.book {
    position: absolute;

    right: 70px;

    width: 205px;
    height: 30px;

    border: 4px solid #8aa39c;

    border-radius: 15px 9px 9px 15px;

    background: rgba(255,255,255,0.45);
}


.book::before {
    content: "";

    position: absolute;

    left: 18px;
    top: 6px;

    width: 135px;
    height: 3px;

    background: #8aa39c;

    border-radius: 5px;
}


.book-1 {
    bottom: 105px;
    transform: rotate(1deg);
}

.book-2 {
    bottom: 75px;
    width: 235px;
    right: 55px;
    transform: rotate(-1deg);
}

.book-3 {
    bottom: 45px;
    width: 250px;
    right: 40px;
    transform: rotate(2deg);
}

.book-4 {
    bottom: 15px;
    width: 270px;
    right: 30px;
    height: 38px;
    border-radius: 20px 10px 10px 20px;
}


/* =========================
   PLANT
========================= */

.plant {
    position: absolute;

    right: 20px;
    bottom: 10px;

    width: 75px;
    height: 150px;
}


.stem {
    position: absolute;

    left: 35px;
    bottom: 0;

    width: 3px;
    height: 120px;

    background: #8aa39c;

    transform: rotate(4deg);
}


.leaf {
    position: absolute;

    width: 38px;
    height: 18px;

    border: 3px solid #8aa39c;

    border-radius: 100% 0 100% 0;

    transform-origin: bottom right;
}


.leaf-1 {
    top: 32px;
    left: 5px;
    transform: rotate(-28deg);
}

.leaf-2 {
    top: 58px;
    left: 34px;
    transform: rotate(25deg);
}

.leaf-3 {
    top: 82px;
    left: 8px;
    transform: rotate(-20deg);
}


/* =========================
   RESPONSIVE
========================= */

@media (max-width: 992px) {

    .archive-hero {
        height: 240px;
    }

    .archive-hero-inner {
        width: 90%;
    }

    .archive-icon {
        width: 105px;
        height: 105px;
        flex-basis: 105px;
        font-size: 40px;
    }

    .archive-divider {
        height: 105px;
        margin-left: 30px;
        margin-right: 30px;
    }

    .archive-content h1 {
        font-size: 40px;
    }

    .archive-content p {
        font-size: 15px;
        line-height: 1.7;
    }

    .archive-decoration {
        right: -100px;
        opacity: 0.13;
    }
}


@media (max-width: 768px) {

    .archive-hero {
        height: auto;
        min-height: 250px;
        padding: 45px 0;
    }

    .archive-hero-inner {
        width: 88%;
    }

    .archive-icon {
        width: 82px;
        height: 82px;
        flex-basis: 82px;
        font-size: 30px;
    }

    .archive-divider {
        height: 82px;
        margin-left: 20px;
        margin-right: 22px;
    }

    .archive-content {
        max-width: 100%;
    }

    .archive-content h1 {
        font-size: 34px;
        margin-bottom: 10px;
    }

    .archive-content p {
        font-size: 14px;
        line-height: 1.6;
    }

    .archive-decoration {
        display: none;
    }
}


@media (max-width: 500px) {

    .archive-hero-inner {
        align-items: flex-start;
    }

    .archive-icon {
        width: 65px;
        height: 65px;
        flex-basis: 65px;
        font-size: 24px;
    }

    .archive-divider {
        height: 65px;
        margin-left: 15px;
        margin-right: 16px;
    }

    .archive-content h1 {
        font-size: 28px;
    }

    .archive-content p {
        font-size: 13px;
    }
}

.archive-search{
    padding:0 0 80px;
    margin-top:0;
}

.search-card{

    background:#fff;

    padding:35px;

    border-radius:15px;

    box-shadow:0 10px 25px rgba(0,0,0,.08);

    max-width:950px;

    margin:auto;

}

.search-card h3{

    font-size:34px;

    color:#1e473d;

    font-weight:700;
}

.search-card input,
.search-card select{

    height:60px;

    border-radius:12px;

    border:1px solid #ddd;

    padding-left:18px;

    transition:.3s;
}

.search-card input:focus,
.search-card select:focus{

    border-color:#d4af37;

    box-shadow:0 0 15px rgba(212,175,55,.25);
}

.search-card button{

    height:60px;

    border-radius:12px;

    background:#d4af37;

    border:none;

    font-weight:700;

    transition:.3s;
}

.search-card button:hover{

    background:#16362d;

    transform:translateY(-3px);
}
.latest-issue{
    padding:30px 0 30px;
    margin-bottom:-40px;
    background:#fafbfc;
}

.issue-cover img{

    border-radius:20px;

    box-shadow:0 25px 60px rgba(0,0,0,.15);

    transition:.5s;
}

.issue-cover img:hover{

    transform:scale(1.04);
}

.issue-details{

    padding-left:30px;
}

.issue-details h2{

    font-size:35px;

    color:#16362d;

    font-weight:800;
}

.issue-details p{

    font-size:13px;

    line-height:1.9;

    color:#666;
}

.issue-info{

    display:flex;

    flex-wrap:wrap;

    gap:15px;

    margin:35px 0;
}

.issue-info span{

    background:#fff;

    border-left:5px solid #d4af37;

    padding:14px 22px;

    border-radius:10px;

    box-shadow:0 10px 25px rgba(0,0,0,.06);

    font-weight:600;
}

.issue-details .btn{

    padding:16px 42px;

    border-radius:50px;

    background:#16362d;

    color:#fff;

    font-weight:700;

    transition:.4s;
}

.issue-details .btn:hover{

    background:#d4af37;

    color:#fff;

    transform:translateY(-4px);
}
.section-title{

    font-size:35px;

    font-weight:800;

    color:#16362d;

    margin-bottom:5px;
}

.section-subtitle{

    max-width:720px;

    margin:auto;

    color:#666;

    font-size:13px;

    line-height:1.8;
    
    
}

.section-tag{

    display:inline-block;

    background:#d4af37;

    color:#fff;

    padding:8px 22px;

    border-radius:30px;

    font-size:13px;

    letter-spacing:2px;

    text-transform:uppercase;
    
    margin-bottom:-40px;
}
/*=====================================
        JOURNAL STATISTICS
======================================*/

.journal-stats{
    padding:35px 0;
    margin-bottom:-20px;
}
.stat-card{
    background:#fff;
    border-radius:15px;
    padding:25px 20px;
    text-align:center;
    height:150px;
    border-top:4px solid #d4af37;
    box-shadow:0 8px 20px rgba(0,0,0,.08);
    transition:.3s;
}

.stat-card:hover{
    transform:translateY(-8px);
    box-shadow:0 18px 35px rgba(0,0,0,.12);
}

.stat-icon{
    width:60px;
    height:60px;
    margin-bottom:-30px;
    border-radius:50%;
    background:#f6f6f6;
    display:flex;
    align-items:center;
    justify-content:center;
}

.stat-icon i{
    font-size:17px;
    color:#d4af37;
}

.stat-card h2{
    font-size:30px;
    font-weight:700;
    margin-bottom:-3px;
    color:#1f4d42;
}

.stat-card p{
    font-size:14px;
    color:#666;
    margin:0;
}
.search-card input,
.search-card select{

    height:50px;

    border-radius:8px;

}

.search-card button{

    height:50px;

    border-radius:8px;

    width:130px;

}


