/**
 * Just2Minutes — Complete Site Styles
 * Version: 3.0
 * path -- assets/css/style.css
 */

/* ============================================
   CSS VARIABLES / ROOT
   ============================================ */
:root {
    --brand-primary: #2E8B57;
    --brand-primary-dark: #216b42;
    --brand-accent: #FF6B5B;
    --brand-ink: #1F2937;
    --brand-muted: #6B7280;
    --brand-bg: #FAFAF9;
    --brand-border: #EAEAE8;
    --font-heading: 'Poppins', 'Inter', sans-serif;
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    
    /* Footer Colors */
    --footer-bg: #0a0f0d;
    --footer-text: rgba(255, 255, 255, 0.85);
    --footer-text-muted: rgba(255, 255, 255, 0.6);
    --footer-text-dim: rgba(255, 255, 255, 0.4);
    --footer-border: rgba(255, 255, 255, 0.06);
    --footer-social-bg: rgba(255, 255, 255, 0.08);
}

/* ============================================
   BASE STYLES
   ============================================ */
body {
    font-family: var(--font-body);
    color: var(--brand-ink);
    background-color: var(--brand-bg);
    margin: 0;
    padding: 0;
}

h1, h2, h3, h4, h5, h6,
.display-6, .navbar-brand {
    font-family: var(--font-heading);
    font-weight: 700;
    letter-spacing: -0.01em;
}

a {
    color: var(--brand-primary);
    text-decoration: none;
    transition: all 0.3s ease;
}

a:hover {
    color: var(--brand-primary-dark);
}

/* ============================================
   BUTTONS
   ============================================ */
.btn-primary {
    background-color: var(--brand-primary);
    border-color: var(--brand-primary);
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--brand-primary-dark);
    border-color: var(--brand-primary-dark);
}

.btn-outline-primary {
    color: var(--brand-primary);
    border-color: var(--brand-primary);
}

.btn-outline-primary:hover {
    background-color: var(--brand-primary);
    border-color: var(--brand-primary);
}

.text-primary { color: var(--brand-primary) !important; }
.bg-primary { background-color: var(--brand-primary) !important; }

/* ============================================
   NAVBAR
   ============================================ */
.navbar {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.navbar-brand {
    font-size: 1.4rem;
}

.navbar-nav .nav-link {
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--brand-ink);
    padding-left: 0.85rem;
    padding-right: 0.85rem;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
    color: var(--brand-primary);
}

/* ============================================
   CATEGORY BADGES
   ============================================ */
.category-badge {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-decoration: none;
    line-height: 1;
}

.category-badge:hover {
    text-decoration: underline;
}

/* ============================================
   POST CARDS
   ============================================ */
.post-card {
    border: 1px solid var(--brand-border);
    border-radius: 0.75rem;
    overflow: hidden;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.post-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 0.75rem 1.5rem rgba(31, 41, 55, 0.1);
}

.post-card .card-img-top {
    width: 100%;
    height: auto;
    object-fit: contain;
    display: block;
}

.post-card .card-title a {
    color: var(--brand-ink);
    text-decoration: none;
}

.post-card .card-title a:hover {
    color: var(--brand-primary);
}

/* ============================================
   HERO CARDS
   ============================================ */
.trending-label {
    display: inline-block;
    background: var(--brand-primary);
    color: #fff;
    font-family: var(--font-heading);
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    padding: 0.4rem 1rem;
    border-radius: 0.35rem;
    margin-bottom: 0.85rem;
}

.hero-card {
    position: relative;
    display: block;
    border-radius: 0.75rem;
    overflow: hidden;
    height: 260px;
    color: #fff;
    text-decoration: none;
    background-size: cover;
    background-position: center;
    background-color: #1F2937;
}

.hero-card::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.82) 100%);
}

.hero-card .hero-card-body {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    padding: 1.25rem;
}

.hero-card .category-badge {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.18);
    padding: 0.2rem 0.6rem;
    border-radius: 0.3rem;
}

.hero-card h2 {
    color: #fff;
    font-size: 1.15rem;
    line-height: 1.3;
    margin: 0.5rem 0 0.35rem;
}

.hero-card .hero-card-meta {
    font-size: 0.78rem;
    opacity: 0.85;
}

.hero-card:hover h2 {
    text-decoration: underline;
}

@media (min-width: 768px) {
    .hero-card {
        height: 320px;
    }
    .hero-card h2 {
        font-size: 1.4rem;
    }
}

/* ============================================
   SIDEBAR WIDGETS
   ============================================ */
.widget-card {
    border: 1px solid var(--brand-border);
    border-radius: 0.75rem;
}

.widget-title {
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: inline-block;
    padding-bottom: 0.4rem;
    border-bottom: 3px solid var(--brand-accent);
    margin-bottom: 1rem;
}

.widget-card .list-group-item {
    border-left: none;
    border-right: none;
}

.category-list-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.4rem 0;
    text-decoration: none;
    color: var(--brand-ink);
}

.category-list-item:hover {
    color: var(--brand-primary);
}

.category-list-item .dot {
    display: inline-block;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    margin-right: 0.5rem;
}

.category-list-item .count {
    color: var(--brand-muted);
    font-size: 0.8rem;
}

/* ============================================
   POST CONTENT
   ============================================ */
.post-content {
    line-height: 1.8;
    font-size: 1.05rem;
}

.post-content img {
    max-width: 100%;
    height: auto;
    border-radius: 0.5rem;
}

.comment-item .flex-grow-1 p {
    white-space: pre-wrap;
}

/* ============================================
   BRAND MARK
   ============================================ */
.brand-mark {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    text-decoration: none;
}

.brand-mark .brand-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 0.6rem;
    background: var(--brand-primary);
    color: #fff;
    font-family: var(--font-heading);
    font-weight: 800;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.brand-mark .brand-text {
    line-height: 1.1;
}

.brand-mark .brand-name {
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: 1.2rem;
    color: var(--brand-ink);
}

.brand-mark .brand-name .brand-name-accent {
    color: var(--brand-primary);
}

.brand-mark .brand-tagline {
    display: block;
    font-size: 0.68rem;
    color: var(--brand-muted);
    letter-spacing: 0.02em;
}

.brand-mark img {
    max-height: 150px;
}

/* ============================================
   SECTION HEADINGS
   ============================================ */
.section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 2px solid var(--brand-border);
    padding-bottom: 0.6rem;
    margin-bottom: 1.25rem;
}

.section-heading h2 {
    font-size: 1.15rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0;
    padding-bottom: 0.6rem;
    margin-bottom: -0.62rem;
    border-bottom: 3px solid var(--brand-accent);
    display: inline-block;
}

.section-heading .section-heading-link {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--brand-muted);
    text-decoration: none;
}

.section-heading .section-heading-link:hover {
    color: var(--brand-primary);
}

/* ============================================
   HEADLINE LIST
   ============================================ */
.headline-list-item {
    padding: 0.85rem 0;
    border-bottom: 1px solid var(--brand-border);
}

.headline-list-item:last-child {
    border-bottom: none;
}

.headline-list-item h3 {
    font-size: 0.95rem;
    line-height: 1.35;
    margin: 0.3rem 0 0.2rem;
}

.headline-list-item h3 a {
    color: var(--brand-ink);
    text-decoration: none;
}

.headline-list-item h3 a:hover {
    color: var(--brand-primary);
}

.headline-list-item .post-meta-small {
    font-size: 0.76rem;
    color: var(--brand-muted);
}

/* ============================================
   READ MORE BUTTON
   ============================================ */
.btn-readmore {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--brand-primary);
    color: #fff;
    font-size: 0.82rem;
    font-weight: 600;
    padding: 0.45rem 1.1rem;
    border-radius: 0.4rem;
    text-decoration: none;
}

.btn-readmore:hover {
    background: var(--brand-primary-dark);
    color: #fff;
}

/* ============================================
   FEATURED BANNER
   ============================================ */
.featured-banner {
    position: relative;
    display: block;
    border-radius: 0.75rem;
    overflow: hidden;
    min-height: 220px;
    color: #fff;
    text-decoration: none;
    background-size: cover;
    background-position: center;
    background-color: #16241C;
    margin: 2.5rem 0;
}

.featured-banner::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(10, 15, 12, 0.6);
}

.featured-banner .featured-banner-body {
    position: relative;
    z-index: 1;
    padding: 2.5rem 1.5rem;
    text-align: center;
}

.featured-banner h2 {
    color: #fff;
    font-size: 1.5rem;
    max-width: 32rem;
    margin: 0.75rem auto 0.5rem;
}

.featured-banner:hover h2 {
    text-decoration: underline;
}

/* ============================================
   FOOTER - COMPLETE STYLES (NO INLINE)
   ============================================ */

/* Footer Container */
.footer-modern {
    background: #0a0f0d;
    color: rgba(255, 255, 255, 0.85);
    padding: 60px 0 0;
    margin-top: 50px;
    border-top: 3px solid #2E8B57;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Footer Top Section */
.footer-top {
    padding: 0 0 40px;
}

/* Footer Bottom Section */
.footer-bottom {
    padding: 20px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

/* ============================================
   FOOTER BRAND
   ============================================ */
.footer-brand {
    max-width: 380px;
}

.footer-brand-link {
    display: inline-block;
    text-decoration: none;
    margin-bottom: 15px;
}

.footer-logo {
    max-height: 100px;
    width: auto;
    filter: brightness(0.9);
    transition: all 0.3s ease;
}

.footer-logo:hover {
    filter: brightness(1);
    transform: scale(1.02);
}

.footer-brand-name {
    font-family: 'Poppins', 'Inter', sans-serif;
    font-weight: 700;
    font-size: 1.5rem;
    color: #ffffff;
}

.footer-description {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.92rem;
    line-height: 1.7;
    margin: 12px 0 18px;
}

/* ============================================
   FOOTER SOCIAL ICONS
   ============================================ */
.footer-social {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.footer-social-text {
    color: rgba(255, 255, 255, 0.4);
    font-size: 13px;
}

.social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.8);
    font-size: 16px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.04);
}

.social-icon:hover {
    background: #2E8B57;
    color: #ffffff;
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 8px 25px rgba(46, 139, 87, 0.3);
    border-color: #2E8B57;
}

/* Social Icon Brand Colors on Hover */
.social-icon-facebook:hover { background: #1877F2 !important; border-color: #1877F2 !important; box-shadow: 0 8px 25px rgba(24, 119, 242, 0.3) !important; }
.social-icon-twitter:hover { background: #000000 !important; border-color: #000000 !important; box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important; }
.social-icon-instagram:hover { background: #E4405F !important; border-color: #E4405F !important; box-shadow: 0 8px 25px rgba(228, 64, 95, 0.3) !important; }
.social-icon-youtube:hover { background: #FF0000 !important; border-color: #FF0000 !important; box-shadow: 0 8px 25px rgba(255, 0, 0, 0.3) !important; }
.social-icon-linkedin:hover { background: #0A66C2 !important; border-color: #0A66C2 !important; box-shadow: 0 8px 25px rgba(10, 102, 194, 0.3) !important; }
.social-icon-pinterest:hover { background: #E60023 !important; border-color: #E60023 !important; box-shadow: 0 8px 25px rgba(230, 0, 35, 0.3) !important; }
.social-icon-tiktok:hover { background: #000000 !important; border-color: #000000 !important; box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important; }
.social-icon-whatsapp:hover { background: #25D366 !important; border-color: #25D366 !important; box-shadow: 0 8px 25px rgba(37, 211, 102, 0.3) !important; }
.social-icon-telegram:hover { background: #0088cc !important; border-color: #0088cc !important; box-shadow: 0 8px 25px rgba(0, 136, 204, 0.3) !important; }

/* ============================================
   FOOTER WIDGETS
   ============================================ */
.footer-widget {
    margin-bottom: 10px;
}

.footer-widget-title {
    font-family: 'Poppins', 'Inter', sans-serif;
    font-weight: 700;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #ffffff;
    margin-bottom: 20px;
    position: relative;
    padding-bottom: 12px;
    display: inline-block;
}

.footer-widget-title::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 30px;
    height: 3px;
    background: #2E8B57;
    border-radius: 2px;
}

/* ============================================
   FOOTER LINKS
   ============================================ */
.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: 12px;
}

.footer-links li a {
    color: rgba(255, 255, 255, 0.6);
    text-decoration: none;
    font-size: 0.88rem;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.footer-links li a i {
    font-size: 10px;
    transition: all 0.2s ease;
    color: #2E8B57;
}

.footer-links li a:hover {
    color: #ffffff;
    transform: translateX(5px);
}

.footer-links li a:hover i {
    transform: translateX(3px);
}

/* Category Links with Dots */
.footer-categories li a {
    display: flex;
    align-items: center;
    gap: 10px;
}

.footer-categories .cat-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
    transition: all 0.2s ease;
}

.footer-categories li a:hover .cat-dot {
    transform: scale(1.3);
}

/* ============================================
   FOOTER NEWSLETTER
   ============================================ */
.newsletter-text {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.88rem;
    line-height: 1.7;
    margin-bottom: 16px;
}

.newsletter-form {
    display: flex;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 50px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: all 0.3s ease;
}

.newsletter-form:focus-within {
    border-color: #2E8B57;
    box-shadow: 0 0 0 3px rgba(46, 139, 87, 0.15);
}

.newsletter-input {
    flex: 1;
    background: transparent;
    border: none;
    color: #ffffff;
    padding: 12px 20px;
    font-size: 0.88rem;
    outline: none;
}

.newsletter-input::placeholder {
    color: rgba(255, 255, 255, 0.4);
}

.newsletter-input:focus {
    box-shadow: none;
    background: transparent;
}

.btn-subscribe {
    background: #2E8B57;
    border: none;
    color: #ffffff;
    padding: 12px 22px;
    border-radius: 50px;
    font-size: 16px;
    transition: all 0.3s ease;
    cursor: pointer;
    flex-shrink: 0;
}

.btn-subscribe:hover {
    background: #216b42;
    transform: scale(1.05);
}

.btn-subscribe:disabled {
    opacity: 0.7;
    cursor: not-allowed;
    transform: none;
}

.newsletter-message {
    margin-top: 10px;
    font-size: 0.85rem;
    display: none;
}

.newsletter-message.success {
    color: #4caf50;
    display: block;
}

.newsletter-message.error {
    color: #f44336;
    display: block;
}

.footer-newsletter-badge {
    display: flex;
    align-items: center;
    gap: 6px;
    color: rgba(255, 255, 255, 0.4);
    font-size: 0.75rem;
    margin-top: 12px;
}

.footer-newsletter-badge i {
    color: #2E8B57;
}

/* ============================================
   FOOTER COPYRIGHT & LEGAL
   ============================================ */
.footer-copyright {
    color: rgba(255, 255, 255, 0.4);
    font-size: 0.85rem;
}

.footer-copyright strong {
    color: rgba(255, 255, 255, 0.7);
}

.footer-legal {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 4px 12px;
}

.footer-legal a {
    color: rgba(255, 255, 255, 0.4);
    text-decoration: none;
    font-size: 0.82rem;
    transition: color 0.2s ease;
}

.footer-legal a:hover {
    color: #ffffff;
}

.footer-divider {
    color: rgba(255, 255, 255, 0.15);
}

.back-to-top:hover {
    color: #2E8B57 !important;
}

.back-to-top i {
    margin-right: 4px;
}

/* ============================================
   FOOTER RESPONSIVE
   ============================================ */
@media (max-width: 991px) {
    .footer-top {
        padding: 40px 0 20px;
    }
}

@media (max-width: 768px) {
    .footer-top {
        padding: 30px 0 10px;
    }
    
    .footer-brand {
        max-width: 100%;
        text-align: center;
    }
    
    .footer-brand-link {
        display: inline-block;
    }
    
    .footer-social {
        justify-content: center;
    }
    
    .footer-widget {
        text-align: center;
    }
    
    .footer-widget-title {
        display: inline-block;
    }
    
    .footer-widget-title::after {
        left: 50%;
        transform: translateX(-50%);
    }
    
    .footer-links li {
        justify-content: center;
    }
    
    .footer-categories li a {
        justify-content: center;
    }
    
    .footer-legal {
        justify-content: center;
        margin-top: 10px;
    }
    
    .footer-copyright {
        text-align: center;
    }
    
    .footer-newsletter-badge {
        justify-content: center;
    }
    
    .newsletter-form {
        max-width: 400px;
        margin: 0 auto;
    }
    
    .footer-logo {
        max-height: 50px;
    }
}

@media (max-width: 480px) {
    .footer-top {
        padding: 20px 0 5px;
    }
    
    .footer-widget-title {
        font-size: 0.85rem;
    }
    
    .footer-links li a {
        font-size: 0.82rem;
    }
    
    .social-icon {
        width: 36px;
        height: 36px;
        font-size: 14px;
    }
    
    .footer-legal {
        gap: 2px 5px;
    }
    
    .footer-legal a {
        font-size: 0.75rem;
    }
    
    .footer-divider {
        margin: 0 2px;
    }
    
    .btn-subscribe {
        padding: 10px 16px;
        font-size: 14px;
    }
    
    .newsletter-input {
        padding: 10px 16px;
        font-size: 0.82rem;
    }
}

/* ============================================
   DARK MODE SUPPORT
   ============================================ */
@media (prefers-color-scheme: dark) {
    .footer-modern {
        background: #0a0f0d;
    }
}
/* ============================================================
   HOMEPAGE — MATCHED TO APPROVED VISUAL REFERENCE
   ============================================================ */
.j2m-home{background:#fff;color:#151515}
.j2m-home .top-strip{background:#111;color:#fff;font-size:12px}
.j2m-home .top-strip-inner{height:36px;display:flex;align-items:center;justify-content:space-between}
.j2m-home .top-links,.j2m-home .top-social,.j2m-home .top-right{display:flex;align-items:center;gap:25px}
.j2m-home .top-links a,.j2m-home .top-social a{color:#fff;opacity:.92;text-decoration:none}
.j2m-home .top-links a:hover,.j2m-home .top-social a:hover{opacity:1;color:#7ac943}
.j2m-home .top-right{gap:24px}.j2m-home .top-date{opacity:.95;margin-right:4px}.j2m-home .top-date i{margin-right:5px}
.j2m-home .site-header{background:#fff;border-bottom:1px solid #eee}.j2m-home .site-header>.container,.j2m-home .top-strip>.container{max-width:1360px}
.j2m-home .header-main{min-height:84px;display:flex;align-items:center;gap:30px}
.j2m-home .site-logo{display:flex;align-items:center;width:395px;height:78px;overflow:hidden;text-decoration:none;flex:0 0 auto}
.j2m-home .site-logo img{display:block;width:100%;height:100%;object-fit:contain;object-position:left center}
.j2m-home .logo-fallback strong{display:block;font:800 32px Poppins,sans-serif;color:#16810f}.j2m-home .logo-fallback strong span{color:#f57c00}.j2m-home .logo-fallback small{display:block;color:#222;font-weight:600;margin-top:-3px}
.j2m-home .main-nav{display:flex!important;align-items:center;justify-content:flex-end;flex:1;min-width:0}
.j2m-home .nav-menu{list-style:none;padding:0;margin:0;display:flex;align-items:center;gap:4px;white-space:nowrap}
.j2m-home .nav-menu li{margin:0}.j2m-home .nav-menu a{display:flex;align-items:center;gap:7px;height:50px;padding:0 12px;color:#151515;font:600 13px Poppins,sans-serif;text-transform:uppercase;text-decoration:none;border-radius:5px}
.j2m-home .nav-menu a i.fa-chevron-down{font-size:9px}.j2m-home .nav-menu a:hover{color:#198a13}.j2m-home .nav-menu a.active{background:#17880d;color:#fff}.j2m-home .nav-menu a.nav-home{font-size:13px}.j2m-home .nav-search{font-size:20px;color:#111;margin-left:7px;padding:10px}.j2m-home .nav-search:hover{color:#17880d}
.j2m-home .mobile-menu-btn{display:none;border:0;background:#17880d;color:#fff;padding:9px 12px;border-radius:5px}
.j2m-home .flash-wrap:empty{display:none}.j2m-home .flash-wrap{margin-top:10px}

.home-shell{max-width:1360px;margin:20px auto 40px;padding:0 18px;display:grid;grid-template-columns:255px minmax(0,1fr) 292px;gap:28px;align-items:start}
.home-left,.home-right{min-width:0}.home-main{min-width:0}
.side-widget{background:#fff;border:1px solid #e4e6e4;border-radius:6px;box-shadow:0 1px 4px rgba(0,0,0,.06);overflow:hidden;margin-bottom:18px}
.widget-head{background:#17880d;color:#fff;padding:10px 14px;font:700 14px Poppins,sans-serif;display:flex;align-items:center;gap:8px}.widget-head.orange{background:#ef7f00}.widget-head i{width:17px;text-align:center}
.explore-list{padding:8px 12px 10px}.explore-list a{display:flex;align-items:center;gap:13px;padding:10px 8px;color:#222;font-size:14px;text-decoration:none;border-radius:5px}.explore-list a:hover{background:#f1f8ef;color:#16880d}.explore-list a i{color:#16880d;width:18px;text-align:center;font-size:15px}
.mini-post-list{padding:10px 10px 3px}.mini-post{display:flex;gap:11px;padding:7px 0;text-decoration:none;color:#111}.mini-thumb{width:85px;height:60px;flex:0 0 85px;border-radius:5px;overflow:hidden;background:#eee}.mini-thumb img,.mini-thumb .image-placeholder{width:100%;height:100%;object-fit:cover}.mini-copy{display:flex;flex-direction:column;gap:4px;min-width:0}.mini-copy strong{font:600 12.5px/1.35 Poppins,sans-serif;color:#222;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.mini-copy small{font-size:10.5px;color:#777}.side-view-all{display:block;background:#16880d;color:#fff;text-align:center;margin:9px 10px 11px;padding:9px;border-radius:5px;font:600 12px Poppins,sans-serif;text-decoration:none}.side-view-all:hover{background:#116d0b;color:#fff}

.trending-bar{height:40px;border:1px solid #e7e7e7;border-radius:5px;display:flex;align-items:center;gap:14px;padding:0 8px 0 12px;margin-bottom:15px;box-shadow:0 1px 4px rgba(0,0,0,.03);background:#fff}.trending-bar>a{font:600 13px Poppins,sans-serif;color:#222;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;flex:1}.trending-pill{background:#ed3029;color:#fff;padding:6px 10px;border-radius:4px;font:700 11px Poppins,sans-serif;white-space:nowrap}.trend-arrows{display:flex;gap:5px}.trend-arrows button{width:25px;height:25px;border:1px solid #ddd;background:#fff;color:#666;border-radius:4px}.trend-arrows button:hover{background:#f3f3f3}
.featured-home{height:365px;display:block;position:relative;overflow:hidden;border-radius:6px;text-decoration:none;background:#222}.featured-home-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.featured-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05) 20%,rgba(0,0,0,.82) 100%)}.featured-copy{position:absolute;left:0;right:0;bottom:0;padding:25px;color:#fff;z-index:2}.green-label{display:inline-block;background:#17880d;color:#fff;border-radius:3px;padding:5px 9px;font:700 10px Poppins,sans-serif;text-transform:uppercase}.featured-copy h1{font:700 30px/1.18 Poppins,sans-serif;color:#fff;margin:9px 0 8px;max-width:700px}.featured-copy p{font:400 13px/1.5 Inter,sans-serif;color:#fff;margin:0 0 10px;max-width:680px}.featured-meta{display:flex;gap:16px;font-size:11px;color:#f3f3f3}.featured-meta i{margin-right:4px}
.section-title-row{display:flex;align-items:center;justify-content:space-between;margin:25px 0 12px}.section-title-row h2{font:700 18px Poppins,sans-serif;margin:0;display:flex;align-items:center;gap:9px}.section-title-row h2>span{width:4px;height:23px;background:#16880d;border-radius:2px}.section-title-row a{font:600 12px Poppins,sans-serif;color:#222;text-decoration:none}.section-title-row a:hover{color:#16880d}.section-title-row a i{font-size:18px;margin-left:5px;vertical-align:-2px}
.latest-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.home-card{min-width:0}.home-card-image{display:block;position:relative;height:145px;border-radius:5px;overflow:hidden;background:#eee}.home-card-image img{width:100%;height:100%;object-fit:cover;display:block}.card-cat{position:absolute;left:8px;bottom:8px;background:#17880d;color:#fff;border-radius:3px;padding:4px 7px;font:700 9px Poppins,sans-serif;text-transform:uppercase}.home-card-body{padding-top:8px}.home-card h3,.health-card h3{font:700 13px/1.35 Poppins,sans-serif;margin:0}.home-card h3 a,.health-card h3 a{color:#161616;text-decoration:none}.home-card h3 a:hover,.health-card h3 a:hover{color:#16880d}.card-meta{display:flex;gap:12px;color:#777;font-size:10px;margin-top:7px}.card-meta i{margin-right:3px}
.health-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.health-card{border:1px solid #e6e6e6;border-radius:5px;overflow:hidden;background:#fff}.health-card>a{display:block;height:165px}.health-card>a img{width:100%;height:100%;object-fit:cover}.health-card-body{padding:10px 11px 13px;position:relative}.health-card-body .card-cat{position:static;display:inline-block;margin-bottom:6px}.health-card h3{font-size:14px}
.search-widget form{padding:9px}.search-row{display:flex;border:1px solid #ddd;border-radius:5px;overflow:hidden}.search-row input{border:0;outline:0;min-width:0;width:100%;padding:8px 9px;font-size:12px}.search-row button{border:0;background:#17880d;color:#fff;padding:0 11px;font-size:11px;font-weight:600}.popular-list{padding:8px 10px}.popular-post{display:flex;gap:10px;padding:7px 0;text-decoration:none;color:#222}.popular-thumb{width:78px;height:56px;flex:0 0 78px;border-radius:5px;overflow:hidden;background:#eee}.popular-thumb img,.popular-thumb .image-placeholder{width:100%;height:100%;object-fit:cover}.popular-post>div:last-child{min-width:0}.popular-post strong{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font:600 12px/1.32 Poppins,sans-serif}.popular-post small{display:block;color:#777;font-size:10px;margin-top:4px}.tag-cloud{display:flex;flex-wrap:wrap;gap:7px;padding:12px}.tag-cloud a{border:1px solid #ddd;border-radius:15px;padding:5px 9px;color:#333;background:#fff;font-size:10.5px;text-decoration:none}.tag-cloud a:hover{border-color:#17880d;color:#17880d}.newsletter-widget p{font-size:12px;line-height:1.5;color:#444;padding:12px 12px 5px;margin:0}.newsletter-widget form{padding:4px 12px 13px}.newsletter-widget input{width:100%;border:1px solid #ddd;border-radius:5px;padding:9px 10px;font-size:11px;margin-bottom:8px}.newsletter-widget button{width:100%;border:0;border-radius:5px;background:#17880d;color:#fff;padding:9px;font:600 12px Poppins,sans-serif}.newsletter-widget button:hover{background:#116d0b}
.home-trust-strip{background:#101312;color:#fff;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:14px max(18px,calc((100% - 1200px)/2));margin-top:35px}.home-trust-strip>div{display:flex;align-items:center;justify-content:center;gap:12px;font-size:12px}.home-trust-strip i{font-size:20px;color:#56b848}
.image-placeholder{display:flex;align-items:center;justify-content:center;background:#e8ece8;color:#aab2aa;font-size:24px}

@media(max-width:1200px){.home-shell{grid-template-columns:225px minmax(0,1fr) 260px;gap:18px}.j2m-home .site-logo{width:320px}.j2m-home .nav-menu a{padding:0 7px;font-size:11px}.latest-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:992px){.j2m-home .header-main{min-height:72px}.j2m-home .site-logo{width:280px;height:65px}.j2m-home .mobile-menu-btn{display:block;margin-left:auto}.j2m-home .main-nav{display:none!important;flex-direction:column;align-items:stretch;padding:10px 0}.j2m-home .main-nav.show,.j2m-home .main-nav.collapsing{display:flex!important}.j2m-home .nav-menu{flex-direction:column;align-items:stretch;width:100%}.j2m-home .nav-menu a{height:42px}.j2m-home .nav-search{align-self:flex-end}.home-shell{grid-template-columns:1fr;max-width:760px}.home-left,.home-right{display:grid;grid-template-columns:1fr 1fr;gap:16px}.home-left .side-widget,.home-right .side-widget{margin-bottom:0}.home-main{grid-row:1}.home-left{grid-row:2}.home-right{grid-row:3}.featured-home{height:380px}}
@media(max-width:700px){.j2m-home .top-strip{display:none}.j2m-home .site-logo{width:235px;height:58px}.home-shell{padding:0 12px;margin-top:12px}.home-left,.home-right{display:block}.home-left .side-widget,.home-right .side-widget{margin-bottom:15px}.trending-bar{height:42px}.trending-bar>a{font-size:11px}.featured-home{height:330px}.featured-copy{padding:18px}.featured-copy h1{font-size:23px}.featured-copy p{font-size:11px}.latest-grid,.health-grid{grid-template-columns:1fr 1fr;gap:12px}.home-card-image{height:125px}.health-card>a{height:130px}.home-trust-strip{grid-template-columns:1fr 1fr;gap:16px}.home-trust-strip>div{font-size:10px}.home-trust-strip i{font-size:16px}}
@media(max-width:460px){.latest-grid,.health-grid{grid-template-columns:1fr}.home-card-image{height:180px}.health-card>a{height:180px}.featured-home{height:350px}.featured-copy h1{font-size:22px}.home-trust-strip{grid-template-columns:1fr}.j2m-home .site-logo{width:205px}}

/* ============================================================
   HOMEPAGE EXPANSION + FULL IMAGE DISPLAY
   Images are never cropped on the homepage. Their natural aspect
   ratio is preserved with width:100% and height:auto.
   ============================================================ */
.home-shell img { max-width:100%; }
.mini-thumb,.popular-thumb { height:auto; min-height:0; display:block; overflow:hidden; background:#f4f5f4; }
.mini-thumb img,.popular-thumb img { width:100%; height:auto !important; object-fit:contain !important; display:block; }
.mini-thumb .image-placeholder,.popular-thumb .image-placeholder { width:100%; height:65px; display:flex; align-items:center; justify-content:center; }
.featured-home { height:auto; overflow:hidden; }
.featured-home-img { position:relative; inset:auto; width:100%; height:auto !important; object-fit:contain !important; display:block; }
.featured-overlay { position:absolute; inset:0; }
.home-card-image { height:auto; overflow:hidden; }
.home-card-image img { width:100%; height:auto !important; object-fit:contain !important; display:block; }
.health-card>a { height:auto; overflow:hidden; }
.health-card>a img { width:100%; height:auto !important; object-fit:contain !important; display:block; }

.home-category-section { margin-top:30px; }
.category-section-title { align-items:flex-end; }
.category-section-title > div { min-width:0; }
.category-section-title h2 { margin-bottom:4px; }
.category-section-title h2 i { color:#17880d; font-size:16px; margin-right:3px; }
.category-section-title p { margin:0 0 0 25px; color:#777; font-size:11px; line-height:1.45; }
.category-post-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.category-post-card { border:1px solid #e5e7e5; border-radius:7px; background:#fff; overflow:hidden; transition:transform .18s ease,box-shadow .18s ease; }
.category-post-card:hover { transform:translateY(-2px); box-shadow:0 5px 18px rgba(0,0,0,.08); }
.category-post-image { position:relative; display:block; height:auto; overflow:hidden; background:#f3f4f3; }
.category-post-image img { width:100%; height:auto !important; object-fit:contain !important; display:block; }
.category-post-body { padding:11px 12px 13px; }
.category-post-body h3 { font:700 13px/1.4 Poppins,sans-serif; margin:0; }
.category-post-body h3 a { color:#171717; text-decoration:none; }
.category-post-body h3 a:hover { color:#17880d; }
.category-post-body p { color:#6b6b6b; font-size:10.5px; line-height:1.45; margin:7px 0 0; }
.category-post-body .card-meta { margin-top:8px; }

.home-more-content { margin-top:32px; }
.more-content-card { display:flex; align-items:center; gap:16px; padding:18px; border-radius:8px; background:linear-gradient(135deg,#f2faef,#fff); border:1px solid #dfeadb; }
.more-content-icon { width:48px; height:48px; flex:0 0 48px; border-radius:50%; background:#17880d; color:#fff; display:flex; align-items:center; justify-content:center; font-size:20px; }
.more-content-card h2 { font:700 18px/1.3 Poppins,sans-serif; margin:0 0 5px; }
.more-content-card p { margin:0; color:#5e5e5e; font-size:12px; line-height:1.55; }
.more-content-links { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:12px; }
.more-content-links a { display:flex; flex-direction:column; align-items:center; text-align:center; padding:15px 10px; border:1px solid #e3e5e3; border-radius:7px; background:#fff; text-decoration:none; transition:.18s ease; }
.more-content-links a:hover { border-color:#17880d; transform:translateY(-2px); }
.more-content-links i { font-size:20px; color:#17880d; margin-bottom:7px; }
.more-content-links strong { font:700 12px Poppins,sans-serif; color:#222; }
.more-content-links small { margin-top:3px; color:#777; font-size:10px; }

@media(max-width:1200px){
  .category-post-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .more-content-links { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:992px){
  .category-post-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .category-section-title { align-items:flex-start; }
}
@media(max-width:700px){
  .category-post-grid { grid-template-columns:1fr 1fr; gap:12px; }
  .category-section-title { display:flex; flex-direction:column; gap:6px; }
  .category-section-title p { margin-left:25px; }
  .more-content-card { align-items:flex-start; }
}
@media(max-width:460px){
  .category-post-grid { grid-template-columns:1fr; }
  .more-content-links { grid-template-columns:1fr 1fr; }
  .more-content-card h2 { font-size:16px; }
}
/* Full-source-image policy: never crop homepage images. */
.home-shell .featured-home{height:auto!important;min-height:0;overflow:hidden;}
.home-shell .featured-home-img{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;object-fit:contain!important;display:block!important;}
.home-shell .home-card-image,.home-shell .health-card>a{height:auto!important;min-height:0!important;}
.home-shell .home-card-image img,.home-shell .health-card>a img{width:100%!important;height:auto!important;object-fit:contain!important;display:block!important;}
.home-shell .mini-thumb,.home-shell .popular-thumb{height:auto!important;min-height:0!important;}
.home-shell .mini-thumb img,.home-shell .popular-thumb img{width:100%!important;height:auto!important;object-fit:contain!important;display:block!important;}


/* ============================================================
   SHARED FRONTEND HEADER
   The homepage previously scoped its header rules to .j2m-home,
   which left category, post, author, search and contact pages
   with an unstyled header. These rules intentionally apply to
   every frontend page while preserving the homepage layout.
   ============================================================ */
.j2m-site .top-strip{background:#111;color:#fff;font-size:12px}
.j2m-site .top-strip-inner{height:36px;display:flex;align-items:center;justify-content:space-between}
.j2m-site .top-links{display:flex;align-items:center;gap:20px}
.j2m-site .top-links a{color:#fff;text-decoration:none;opacity:.92;transition:opacity .15s ease}
.j2m-site .top-links a:hover{opacity:1}
.j2m-site .top-right{display:flex;align-items:center;gap:22px}
.j2m-site .top-date{white-space:nowrap}
.j2m-site .top-social{display:flex;align-items:center;gap:14px}
.j2m-site .top-social a{color:#fff;text-decoration:none;font-size:13px}
.j2m-site .site-header{background:#fff;border-bottom:1px solid #eee;position:relative;z-index:1000}
.j2m-site .site-header>.container,.j2m-site .top-strip>.container{max-width:1360px}
.j2m-site .header-main{min-height:84px;display:flex;align-items:center;gap:30px}
.j2m-site .site-logo{display:flex;align-items:center;width:395px;height:78px;overflow:hidden;text-decoration:none;flex:0 0 auto}
.j2m-site .site-logo img{display:block;width:100%;height:auto;max-height:78px;object-fit:contain;object-position:left center}
.j2m-site .logo-fallback{display:flex;flex-direction:column;text-decoration:none;line-height:1}
.j2m-site .logo-fallback strong{font-family:Poppins,sans-serif;font-size:30px;color:#237c18}
.j2m-site .logo-fallback strong span{color:#f08a00}
.j2m-site .logo-fallback small{margin-top:7px;color:#333;font-size:12px;font-weight:600;letter-spacing:.05em}
.j2m-site .main-nav{display:flex;align-items:center;justify-content:flex-end;gap:14px;flex:1;min-width:0}
.j2m-site .nav-menu{display:flex;align-items:center;justify-content:flex-end;gap:2px;list-style:none;margin:0;padding:0}
.j2m-site .nav-menu a{height:48px;padding:0 11px;display:flex;align-items:center;gap:6px;color:#17191b;text-decoration:none;text-transform:uppercase;font-size:12px;font-weight:700;white-space:nowrap;border-radius:5px;transition:.15s ease}
.j2m-site .nav-menu a:hover{color:#2e8b57;background:#f3f8f2}
.j2m-site .nav-menu a.active{background:#2e8b57;color:#fff}
.j2m-site .nav-menu a i{font-size:9px}
.j2m-site .nav-menu .nav-home{padding-left:14px;padding-right:14px}
.j2m-site .nav-search{width:38px;height:38px;display:grid;place-items:center;color:#16191b;text-decoration:none;font-size:17px;border-radius:50%;flex:0 0 auto}
.j2m-site .nav-search:hover{background:#f2f6f2;color:#2e8b57}
.j2m-site .mobile-menu-btn{display:none;border:0;background:#2e8b57;color:#fff;width:40px;height:40px;border-radius:6px;align-items:center;justify-content:center}

@media(max-width:1200px){
    .j2m-site .site-logo{width:320px}
    .j2m-site .nav-menu a{padding:0 7px;font-size:11px}
    .j2m-site .header-main{gap:18px}
}
@media(max-width:992px){
    .j2m-site .header-main{min-height:72px}
    .j2m-site .site-logo{width:280px;height:65px}
    .j2m-site .site-logo img{max-height:65px}
    .j2m-site .mobile-menu-btn{display:flex;margin-left:auto}
    .j2m-site .main-nav{display:none!important;flex-direction:column;align-items:stretch;padding:10px 0;background:#fff}
    .j2m-site .main-nav.show,.j2m-site .main-nav.collapsing{display:flex!important}
    .j2m-site .nav-menu{flex-direction:column;align-items:stretch;width:100%;gap:2px}
    .j2m-site .nav-menu a{height:42px;justify-content:space-between}
    .j2m-site .nav-search{align-self:flex-end;margin-top:5px}
}
@media(max-width:700px){
    .j2m-site .top-strip{display:none}
    .j2m-site .site-logo{width:235px;height:58px}
    .j2m-site .site-logo img{max-height:58px}
}
@media(max-width:460px){
    .j2m-site .site-logo{width:205px;height:54px}
    .j2m-site .site-logo img{max-height:54px}
}


/* ============================================================
   FRONTEND HEADER + FOOTER FINAL CLEANUP
   ============================================================ */
/* Navigation has no dropdown arrows because these links open their
   category directly. Keep the navigation clean and consistent. */
.j2m-site .nav-menu a i.fa-chevron-down,
.j2m-home .nav-menu a i.fa-chevron-down {
    display: none !important;
}

/* Footer lists: preserve semantic <ul> markup but never render browser bullets. */
.footer-modern ul,
.footer-modern ol,
.footer-modern .footer-links,
.footer-modern .footer-categories {
    list-style: none !important;
    list-style-type: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.footer-modern ul li,
.footer-modern ol li,
.footer-modern .footer-links li,
.footer-modern .footer-categories li {
    list-style: none !important;
    list-style-type: none !important;
    margin-left: 0 !important;
    padding-left: 0;
}

.footer-modern ul li::marker,
.footer-modern ol li::marker,
.footer-modern .footer-links li::marker,
.footer-modern .footer-categories li::marker {
    content: '' !important;
    display: none !important;
}

/* White text inputs on the dark footer for clear contrast. */
.footer-modern .newsletter-form {
    background: #ffffff !important;
    border: 1px solid rgba(255,255,255,.22) !important;
}

.footer-modern .newsletter-input,
.footer-modern input[type="text"],
.footer-modern input[type="email"],
.footer-modern input[type="search"],
.footer-modern textarea,
.footer-modern select {
    background: #ffffff !important;
    color: #1f2937 !important;
    border-color: #d9dfda !important;
    -webkit-text-fill-color: #1f2937;
}

.footer-modern .newsletter-input::placeholder,
.footer-modern input::placeholder,
.footer-modern textarea::placeholder {
    color: #7a827d !important;
    opacity: 1;
}

.footer-modern .newsletter-input:focus,
.footer-modern input:focus,
.footer-modern textarea:focus,
.footer-modern select:focus {
    background: #ffffff !important;
    color: #1f2937 !important;
    outline: none;
}

/* Keep the footer newsletter button visually separate from the white field. */
.footer-modern .btn-subscribe {
    flex: 0 0 auto;
    background: #2e8b57;
    color: #ffffff;
    border: 0;
}

.footer-modern .btn-subscribe:hover {
    background: #216b42;
    color: #ffffff;
}

/* Footer newsletter input: readable on dark footer */
.footer-modern .newsletter-input,
.footer-modern input[type="email"],
.footer-modern input[type="text"] {
    background: #ffffff !important;
    color: #1f2937 !important;
    border: 1px solid #d1d5db !important;
}
.footer-modern .newsletter-input::placeholder,
.footer-modern input::placeholder {
    color: #6b7280 !important;
    opacity: 1 !important;
}
.footer-modern .footer-links,
.footer-modern .footer-links li {
    list-style: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* Main navigation has no dropdown arrows */
.site-header .nav-menu > li > a::after,
.site-header .nav-menu > li::after { content: none !important; display: none !important; }

/* ============================================================
   HOMEPAGE CONTENT EXPANSION
   Trending / Editor's Picks / Category Discovery / Most Viewed /
   Quick Tips / About / FAQ
   ============================================================ */
.home-section-block{margin:30px 0}
.home-section-block .section-title-row{margin-bottom:18px}
.home-section-block .section-title-row h2{display:flex;align-items:center;gap:9px}
.home-section-block .section-title-row h2>i{font-size:.86em;color:#2e8b57}
.small-label{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:#2e8b57;margin-bottom:7px}

/* Trending */
.trending-post-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.trending-post-card{position:relative;display:block;background:#fff;border:1px solid #e6ebe8;border-radius:12px;overflow:hidden;color:inherit;text-decoration:none;transition:transform .2s,box-shadow .2s,border-color .2s}
.trending-post-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(22,61,45,.1);border-color:#b7d8c7}
.trend-number{position:absolute;z-index:2;top:8px;left:8px;background:#2e8b57;color:#fff;border-radius:7px;padding:4px 7px;font-size:12px;font-weight:800}
.trending-post-thumb{background:#f0f4f2;overflow:hidden}
.trending-post-thumb img{display:block;width:100%;height:auto;object-fit:contain}
.trending-post-copy{padding:12px}
.trending-post-copy h3{font-size:15px;line-height:1.35;margin:0 0 8px;color:#20352d}
.trending-post-copy small{color:#77827d;font-size:11px}

/* Editor picks */
.editors-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.editor-pick-card{background:#fff;border:1px solid #e6ebe8;border-radius:14px;overflow:hidden;box-shadow:0 4px 16px rgba(20,55,41,.05)}
.editor-pick-image{display:block;position:relative;background:#f2f5f3}
.editor-pick-image img{display:block;width:100%;height:auto;object-fit:contain}
.editor-pick-body{padding:16px}
.editor-pick-body h3{font-size:20px;line-height:1.35;margin:0 0 9px}
.editor-pick-body h3 a{color:#21362e;text-decoration:none}
.editor-pick-body h3 a:hover{color:#2e8b57}
.editor-pick-body p{font-size:14px;line-height:1.65;color:#69756f;margin:0 0 12px}

/* Visual categories */
.visual-category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.visual-category-card{display:flex;align-items:center;gap:11px;padding:15px;background:#fff;border:1px solid #e3eae6;border-left:4px solid var(--cat-color,#2e8b57);border-radius:10px;color:#263b32;text-decoration:none;transition:.2s}
.visual-category-card:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(20,55,41,.08)}
.visual-category-icon{width:39px;height:39px;display:grid;place-items:center;border-radius:50%;background:#edf6f1;color:var(--cat-color,#2e8b57);flex:none}
.visual-category-card strong{display:block;font-size:14px}
.visual-category-card small{display:block;margin-top:3px;color:#7b8781;font-size:11px}
.visual-category-card>i{margin-left:auto;color:#9aa69f;font-size:12px}

/* Most viewed */
.most-viewed-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.most-viewed-item{display:flex;align-items:center;gap:11px;background:#fff;border:1px solid #e5ebe8;border-radius:10px;padding:10px;text-decoration:none;color:#263b32}
.most-viewed-item:hover{border-color:#a8cfbb;background:#fbfdfc}
.most-rank{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#f0f6f2;color:#2e8b57;font-weight:800;font-size:13px;flex:none}
.most-thumb{width:74px;flex:none;background:#f1f4f2;border-radius:7px;overflow:hidden}
.most-thumb img{display:block;width:100%;height:auto;object-fit:contain}
.most-copy{min-width:0;flex:1}.most-copy strong{display:block;font-size:14px;line-height:1.35}.most-copy small{display:block;color:#7d8882;font-size:11px;margin-top:5px}.most-viewed-item>i{font-size:11px;color:#a0aaa5}

/* Quick tips */
.quick-tips-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.quick-tip-card{display:flex;gap:12px;padding:15px;background:#f7faf8;border:1px solid #e1ebe5;border-radius:12px}
.quick-tip-card>i{width:38px;height:38px;border-radius:9px;display:grid;place-items:center;background:#2e8b57;color:#fff;flex:none}
.quick-tip-card h3{font-size:14px;margin:0 0 4px}.quick-tip-card p{font-size:12px;line-height:1.5;color:#6f7b75;margin:0}

/* About */
.about-home-card{display:flex;gap:20px;padding:24px;background:linear-gradient(135deg,#edf7f1,#fff);border:1px solid #dce9e2;border-radius:15px}
.about-home-icon{width:60px;height:60px;display:grid;place-items:center;border-radius:14px;background:#2e8b57;color:#fff;font-size:25px;flex:none}
.about-home-card h2{margin:0 0 8px;font-size:25px;color:#20352d}.about-home-card p{max-width:760px;color:#68756e;line-height:1.7;margin:0 0 14px}
.home-outline-btn{display:inline-flex;align-items:center;gap:8px;border:1px solid #2e8b57;border-radius:7px;padding:9px 13px;color:#2e8b57;text-decoration:none;font-weight:700;font-size:13px}.home-outline-btn:hover{background:#2e8b57;color:#fff}

/* FAQ */
.home-faq-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.home-faq-list details{background:#fff;border:1px solid #e3eae6;border-radius:10px;padding:0 15px}
.home-faq-list summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px 0;font-size:14px;font-weight:700;color:#2a4036}.home-faq-list summary::-webkit-details-marker{display:none}.home-faq-list summary i{font-size:11px;color:#2e8b57;transition:transform .2s}.home-faq-list details[open] summary i{transform:rotate(45deg)}
.home-faq-list details p{border-top:1px solid #edf0ee;margin:0;padding:12px 0 15px;color:#69766f;font-size:13px;line-height:1.65}

/* Right sidebar category list */
.side-category-list a{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid #edf0ee;color:#34483f;text-decoration:none;font-size:13px}.side-category-list a:last-child{border-bottom:0}.side-category-list b{min-width:24px;text-align:center;border-radius:12px;background:#eef6f1;color:#2e8b57;font-size:11px;padding:3px 6px}

/* Full-image rule for all homepage cards */
.home-main img,.home-left img,.home-right img,.home-section-block img,.home-category-section img{width:100%;height:auto;object-fit:contain}

@media (max-width:1100px){
 .trending-post-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.visual-category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.most-viewed-list{grid-template-columns:1fr}.quick-tips-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:800px){
 .trending-post-grid,.editors-grid,.visual-category-grid,.quick-tips-grid,.home-faq-list{grid-template-columns:1fr 1fr}.about-home-card{padding:18px}
}
@media (max-width:560px){
 .trending-post-grid,.editors-grid,.visual-category-grid,.quick-tips-grid,.home-faq-list{grid-template-columns:1fr}.about-home-card{flex-direction:column}.about-home-card h2{font-size:21px}.home-section-block{margin:24px 0}
}

/* Homepage newsletter CTA */
.home-newsletter-card{display:grid;grid-template-columns:auto 1fr minmax(300px,420px);align-items:center;gap:18px;padding:22px;background:#173b2c;color:#fff;border-radius:15px;box-shadow:0 8px 24px rgba(23,59,44,.14)}
.home-newsletter-icon{width:58px;height:58px;border-radius:14px;background:#2e8b57;display:grid;place-items:center;font-size:24px}
.home-newsletter-copy .small-label{color:#bde1cc}.home-newsletter-copy h2{margin:0 0 5px;font-size:23px;color:#fff}.home-newsletter-copy p{margin:0;color:#d5e4dc;font-size:13px;line-height:1.55}
.home-newsletter-form>div{display:flex;gap:8px}.home-newsletter-form input{min-width:0;flex:1;border:0;border-radius:7px;background:#fff;color:#1f2f28;padding:12px 13px;outline:0}.home-newsletter-form input::placeholder{color:#7b8580}.home-newsletter-form button{border:0;border-radius:7px;background:#8fc94a;color:#16301f;padding:0 16px;font-weight:800;white-space:nowrap;cursor:pointer}.home-newsletter-form button:hover{background:#a6d969}.home-newsletter-form small{display:block;margin-top:7px;color:#bcd0c5;font-size:10px}
@media(max-width:900px){.home-newsletter-card{grid-template-columns:auto 1fr}.home-newsletter-form{grid-column:1/-1}}
@media(max-width:560px){.home-newsletter-card{grid-template-columns:1fr}.home-newsletter-form{grid-column:auto}.home-newsletter-form>div{flex-direction:column}.home-newsletter-form button{padding:11px}}

/* Latest articles page */
.latest-page-shell{max-width:1320px;margin:30px auto;padding:0 18px;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:25px}
.page-heading-card{background:#fff;border:1px solid #e3eae6;border-radius:14px;padding:24px;margin-bottom:20px}.page-heading-card h1{font-size:31px;color:#20352d;margin:0 0 8px}.page-heading-card p{margin:0;color:#6d7973;line-height:1.65}
.latest-page-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.latest-page-card{background:#fff;border:1px solid #e3eae6;border-radius:13px;overflow:hidden}.latest-page-image{display:block;background:#f2f5f3}.latest-page-image img{display:block;width:100%;height:auto;object-fit:contain}.latest-page-body{padding:16px}.latest-page-body h2{font-size:19px;line-height:1.4;margin:5px 0 8px}.latest-page-body h2 a{color:#263b32;text-decoration:none}.latest-page-body h2 a:hover{color:#2e8b57}.latest-page-body p{color:#6e7a74;font-size:13px;line-height:1.6;margin:0 0 12px}.latest-page-meta{display:flex;justify-content:space-between;color:#89938e;font-size:11px}.site-pagination{display:flex;justify-content:center;align-items:center;gap:6px;margin:28px 0}.site-pagination a,.site-pagination span{min-width:36px;height:36px;display:grid;place-items:center;border:1px solid #dce5e0;border-radius:7px;color:#365046;text-decoration:none;font-size:13px}.site-pagination a.active,.site-pagination a:hover{background:#2e8b57;border-color:#2e8b57;color:#fff}.site-pagination span{border:0;color:#8b9691}
@media(max-width:900px){.latest-page-shell{grid-template-columns:1fr}.latest-page-sidebar{display:none}}
@media(max-width:600px){.latest-page-grid{grid-template-columns:1fr}.latest-page-shell{padding:0 12px}.page-heading-card{padding:18px}.page-heading-card h1{font-size:25px}}
.visual-category-image{width:48px!important;height:48px!important;object-fit:contain!important;border-radius:9px;flex:none;background:#f2f5f3}

/* Full-image rule for editorial cards */
.home-card-image img,.category-post-image img,.health-card img,.frontend-post-card .image-wrap img{width:100%;height:auto;object-fit:contain;display:block}


/* v2.1 image policy: show the complete source image. */
.j2m-site .frontend-post-card .image-wrap img,
.j2m-site .home-card-image img,
.j2m-site .health-card>a img,
.j2m-site .featured-home-img,
.j2m-site .popular-thumb img,
.j2m-site .mini-thumb img,
.j2m-site .popular-post-item .popular-thumb img,
.j2m-site .latest-post-item .latest-thumb img { width:100% !important; height:auto !important; max-height:none !important; object-fit:contain !important; display:block; }
.j2m-site .home-card-image,.j2m-site .health-card>a,.j2m-site .featured-home { height:auto !important; overflow:hidden; }
.j2m-site .featured-home { position:relative; }
.j2m-site .featured-home-img { position:relative !important; inset:auto !important; }
.j2m-site .featured-overlay { position:absolute; inset:0; }

/* v2.1 mobile navigation drawer */
.mobile-nav-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,.42);z-index:1040}
.j2m-site.mobile-nav-open{overflow:hidden}
.j2m-site.mobile-nav-open .mobile-nav-backdrop{display:block}
@media(max-width:992px){
 .j2m-site .header-main{position:relative;flex-wrap:wrap}
 .j2m-site .main-nav{z-index:1050}
 .j2m-site .main-nav.show{display:flex!important;position:fixed;top:0;right:0;bottom:0;width:min(330px,88vw);height:100vh;overflow-y:auto;padding:78px 18px 24px;background:#fff;box-shadow:-8px 0 30px rgba(0,0,0,.16);justify-content:flex-start}
 .j2m-site .nav-menu{justify-content:flex-start}
 .j2m-site .nav-menu a{height:48px;width:100%;font-size:13px}
 .j2m-site .nav-search{align-self:stretch;justify-content:flex-start;margin:8px 0 0;width:100%;padding:12px}
 .j2m-site .mobile-menu-btn{position:relative;z-index:1060}
}
@media(max-width:575px){.j2m-site .site-logo{max-width:250px;width:72%;height:auto}.j2m-site .top-links{display:none}.j2m-site .top-strip-inner{justify-content:center}.j2m-site .home-shell,.j2m-site .frontend-page-shell{padding-left:10px;padding-right:10px}}

/* v2.1 search */
.search-input-wrap{position:relative;flex:1}.search-input-wrap>i{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#7a7f7b;z-index:2}.search-input-wrap input{padding-left:40px!important}.search-suggestions{position:absolute;left:0;right:0;top:calc(100% + 4px);background:#fff;border:1px solid #ddd;border-radius:8px;box-shadow:0 12px 30px rgba(0,0,0,.12);z-index:50;display:none;overflow:hidden}.search-suggestions.show{display:block}.search-suggestion{display:block;padding:11px 14px;color:#222;text-decoration:none;border-bottom:1px solid #eee}.search-suggestion:last-child{border-bottom:0}.search-suggestion:hover{background:#f4faf2}.search-suggestion small{display:block;color:#777;margin-top:2px}

/* Homepage section refinements */
.latest-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
.health-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
.most-viewed-list{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
.visual-category-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
.home-faq-list{grid-template-columns:1fr !important;}
.trend-arrows button{cursor:pointer;display:grid;place-items:center;transition:background .15s,border-color .15s,color .15s;}
.trend-arrows button:hover{background:#2e8b57;border-color:#2e8b57;color:#fff;}
.trend-arrows button:focus-visible{outline:2px solid #2e8b57;outline-offset:2px;}
@media(max-width:900px){
  .latest-grid,.health-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .visual-category-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .most-viewed-list{grid-template-columns:1fr !important;}
}
@media(max-width:560px){
  .latest-grid,.health-grid,.visual-category-grid{grid-template-columns:1fr !important;}
}


/* ============================================================
   FINAL FRONTEND REFINEMENTS
   ============================================================ */
/* Homepage sidebars: no inner scrollbar; let the page show the full widgets. */


/* Category sidebar: icons + comfortable padding. */
.side-category-list a {
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    padding:10px 12px !important;
    border-bottom:1px solid #edf0ed !important;
    text-decoration:none !important;
    color:#26332c !important;
}
.side-category-list a:last-child { border-bottom:0 !important; }
.side-category-name { display:flex; align-items:center; gap:9px; min-width:0; }
.side-category-name i { width:18px; text-align:center; color:#16880d; }
.side-category-list b { min-width:25px; padding:3px 7px; border-radius:12px; background:#edf6ef; color:#16880d; font-size:10px; text-align:center; }

/* Common subscribe card used in homepage, inner pages and single posts. */
.site-subscribe-card { background:#fff !important; border:1px solid #e3e9e4 !important; border-radius:10px !important; overflow:hidden !important; box-shadow:0 2px 8px rgba(25,55,35,.06) !important; }
.site-subscribe-card .subscribe-head { background:#17880d; color:#fff; font:700 13px/1.2 Poppins,sans-serif; padding:11px 13px; }
.site-subscribe-card .subscribe-head i { margin-right:7px; }
.site-subscribe-card .subscribe-body { padding:13px; }
.site-subscribe-card .subscribe-body p { margin:0 0 11px !important; color:#56615b; font:400 12px/1.55 Inter,sans-serif; }
.site-subscribe-card .subscribe-form { display:flex; flex-direction:column; gap:8px; padding:0 !important; margin:0 !important; }
.site-subscribe-card .subscribe-form input[type=email] { width:100% !important; min-width:0 !important; box-sizing:border-box !important; background:#fff !important; color:#243029 !important; border:1px solid #d8e0da !important; border-radius:6px !important; padding:10px 11px !important; font-size:12px !important; outline:none !important; }
.site-subscribe-card .subscribe-form input[type=email]:focus { border-color:#2e8b57 !important; box-shadow:0 0 0 3px rgba(46,139,87,.10) !important; }
.site-subscribe-card .subscribe-form input[type=email]::placeholder { color:#8a938e !important; opacity:1 !important; }
.site-subscribe-card .subscribe-form button { width:100% !important; border:0 !important; border-radius:6px !important; background:#17880d !important; color:#fff !important; padding:10px 12px !important; font:700 12px Poppins,sans-serif !important; cursor:pointer !important; }
.site-subscribe-card .subscribe-form button:hover { background:#116d0b !important; }
.site-subscribe-card .subscribe-note { margin-top:9px; color:#8a938e; font-size:10px; line-height:1.4; }
.site-subscribe-card .subscribe-note i { color:#2e8b57; margin-right:4px; }

/* Footer: no visual arrows/dots/bullets. */
.footer-modern .footer-links li a { gap:0 !important; transform:none !important; }
.footer-modern .footer-links li a i,
.footer-modern .footer-links li a:hover i,
.footer-modern .footer-categories .cat-dot,
.footer-modern .footer-categories li a:hover .cat-dot { display:none !important; }
.footer-modern .footer-links li a:hover { transform:none !important; }
.footer-modern .footer-legal .back-to-top i { display:none !important; }
.footer-modern .footer-legal .footer-divider { margin:0 8px; }

/* Latest.php: equal image frames without cropping the source image. */
.latest-page-image { height:230px !important; display:flex !important; align-items:center !important; justify-content:center !important; overflow:hidden !important; background:#f2f5f3 !important; }
.latest-page-image img { width:100% !important; height:100% !important; object-fit:contain !important; display:block !important; }
.latest-page-image .image-placeholder { width:100%; height:100%; display:grid; place-items:center; }

@media(max-width:600px){ .latest-page-image { height:210px !important; } }

/* Category page: featured title/body below the image and equal card image heights. */
.category-featured { overflow:hidden; padding:0 !important; }
.category-featured-image { display:block; background:#f3f5f3; overflow:hidden; }
.category-featured-image img { width:100%; height:auto !important; max-height:none !important; object-fit:contain; display:block; }
.category-featured-body { padding:22px; }
.category-featured-body h2 { margin:5px 0 9px; font-size:clamp(1.35rem,2.4vw,2rem); line-height:1.3; }
.category-featured-body h2 a { color:#172019; text-decoration:none; }
.category-featured-body h2 a:hover { color:#2e8b57; }
.category-featured-body p { color:#68736c; line-height:1.65; margin-bottom:14px; }
.frontend-post-grid .image-wrap { display:block; background:#f3f5f3; overflow:hidden; }
.frontend-post-grid .image-wrap img { width:100% !important; height:auto !important; max-height:none !important; object-fit:contain !important; display:block; }
@media(max-width:767px){
    .category-featured-image img,
    .frontend-post-grid .image-wrap img { height:auto !important; max-height:none !important; }
}

/* Single-post layout: no left sidebar; its content is moved into the right sidebar. */
.single-post-shell { grid-template-columns:minmax(0,1fr) 310px !important; gap:28px !important; }
.single-post-shell .post-layout-row { display:contents !important; }
.single-post-shell .single-post-main { grid-column:1; min-width:0; }
.single-post-shell .frontend-page-right { grid-column:2; min-width:0; }
.single-explore-widget { margin-bottom:18px; }
.single-explore-widget .explore-list { padding:7px 0; }
.single-explore-widget .explore-list a { display:flex; align-items:center; gap:10px; padding:9px 13px; color:#26332c; text-decoration:none; font-size:12px; }
.single-explore-widget .explore-list a i { width:18px; text-align:center; color:#16880d; }
.single-explore-widget .explore-list a:hover { background:#f2f8f3; color:#16880d; }
@media(max-width:1199px){ .single-post-shell { grid-template-columns:minmax(0,1fr) 280px !important; } }
@media(max-width:991px){ .single-post-shell { display:block !important; } .single-post-shell .single-post-main,.single-post-shell .frontend-page-right { margin-bottom:20px; } }

/* Single post related articles: category-focused, equal image frames. */
.related-posts-section .frontend-post-grid .image-wrap { height:210px; }

/* Article newsletter uses the same readable input treatment. */
.article-newsletter form { display:flex; gap:8px; flex-wrap:wrap; min-width:0; }
.article-newsletter form input[type=email] { min-width:0; flex:1 1 220px; background:#fff !important; color:#1f2937 !important; border:1px solid #d9dee0 !important; border-radius:7px; padding:.75rem .9rem; }
.article-newsletter form button { flex:0 0 auto; }
@media(max-width:767px){ .article-newsletter form { display:grid; grid-template-columns:1fr; } .article-newsletter form input[type=email], .article-newsletter form button { width:100%; } }

/* Single-post category list: same icon language and spacing as homepage sidebar. */
.single-category-widget .category-list { list-style:none; margin:0; padding:0 10px 10px; }
.single-category-widget .category-list li { padding:0; border-bottom:1px solid #edf0ed; }
.single-category-widget .category-list li:last-child { border-bottom:0; }
.single-category-widget .category-list li a { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 5px; text-decoration:none; color:#26332c; }
.single-category-widget .category-list .cat-name { display:flex; align-items:center; gap:9px; flex:1; }
.single-category-widget .category-list .cat-name i { width:18px; text-align:center; color:#16880d; }
.single-category-widget .category-list .cat-count { background:#edf6ef; color:#16880d; border-radius:12px; padding:3px 8px; font-size:10px; font-weight:700; }



/* ============================================================
   HOMEPAGE SIDEBAR — STICKY UNTIL THE SIDEBAR CONTAINING BLOCK ENDS
   The sidebars stay visible while the main column scrolls, but because
   there is no fixed height or overflow container, the page can always
   continue to the bottom cards. CSS sticky automatically stops when the
   .home-shell containing block reaches its bottom.
   ============================================================ */
@media (min-width: 993px) {
    /* Smart sticky sidebar: when scrolling down, a tall sidebar shifts upward so
       its bottom remains visible; when scrolling up, it shifts back to its top. */
    .home-shell > .home-left,
    .home-shell > .home-right {
        position: -webkit-sticky !important;
        position: sticky !important;
        top: var(--j2m-sticky-top, 20px) !important;
        align-self: start !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        scrollbar-width: none !important;
    }
}

@media (max-width: 992px) {
    .home-shell > .home-left,
    .home-shell > .home-right {
        position: static !important;
        top: auto !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }
}
