body.resources-page {
    background-color: #fdfbf7;
    color: #451a03;
}

.resources-page .card-shadow {
    box-shadow: 0 20px 40px -15px rgba(22, 101, 52, 0.08);
}

.resources-page .zoom-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.resources-page .zoom-card:hover {
    transform: translateY(-5px);
}

.resources-page .category-window {
    transition: all 0.3s ease;
}

.resources-page .category-window:hover {
    border-color: #fbbf24;
}

.resources-page .resources-icon-pulse {
    animation: pulse-soft 1.8s infinite;
}

@keyframes pulse-soft {
    0% {
        transform: scale(1);
        opacity: 0.8;
    }
    50% {
        transform: scale(1.15);
        opacity: 1;
    }
    100% {
        transform: scale(1);
        opacity: 0.8;
    }
}
.accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease;
    opacity: 0;
}
.accordion-content.open {
    max-height: 600px;
    opacity: 1;
}

/* ===== SHARE POPUP ===== */
.share-popup {
    display: none;
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 50;
}

.share-popup.active {
    display: block;
}

/* Dropdown animation */
#sort-menu {
    transform: translateY(10px);
    opacity: 0;
    transition: all 0.2s ease;
}

#sort-menu:not(.hidden) {
    transform: translateY(0);
    opacity: 1;
}

.zoom-card:hover { transform: translateY(-5px); }
 

.article-content h1{
    font-family:'Playfair Display', serif;
    font-size:2.5rem;
    color:#166534;
    margin-top:2.5rem;
    margin-bottom:1rem;
    line-height:1.2;
}
.article-content h2{
    font-family:'Playfair Display', serif;
    font-size:2rem;
    color:#166534;
    margin-top:2.5rem;
    margin-bottom:1rem;
}
.article-content h3{
    font-family:'Playfair Display', serif;
    font-size:1.5rem;
    color:#166534;
    margin-top:2rem;
    margin-bottom:0.75rem;
}
.article-content p{
    font-size:1.125rem;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:1.5rem;
}
.article-content blockquote{
    margin:2rem 0;
}
.article-content blockquote p{
    margin:0;
}
.article-content img{
    border-radius:30px;
    margin:2rem auto;
    max-width:100%;
    height:auto;
}
.article-content iframe{
    width:100%;
    min-height:400px;
    border:0;
    border-radius:24px;
    margin:2rem 0;
}
.article-content ul,
.article-content ol{
    padding-left:1.5rem;
    margin-bottom:1.5rem;
    color:#4b5563;
}