/* Premium article reading experience v2 */
.article-wrap{grid-template-columns:280px minmax(0,920px);gap:42px;justify-content:center;width:min(1280px,94%);margin:auto}
.article{max-width:920px;width:100%}
.article-content{font-size:18px;color:#25342b}
.article-content>p{max-width:820px}
.article-content h2{position:relative;font-size:31px;line-height:1.45;margin:54px 0 20px;padding:17px 22px 17px 68px;background:linear-gradient(135deg,#f1f8f3,#fff);border:1px solid #dcebe1;border-radius:22px;color:var(--green2);box-shadow:0 12px 32px rgba(20,86,52,.06)}
.article-content h2:before{content:"";position:absolute;right:0;top:14px;bottom:14px;width:6px;border-radius:8px;background:linear-gradient(180deg,var(--green),#78ad7e)}
.article-content h3{font-size:23px;line-height:1.55;color:#154b31;margin:28px 0 10px;display:flex;align-items:center;gap:10px}
.article-content h3:before{content:"";width:10px;height:10px;border:3px solid #77a982;border-radius:50%;flex:0 0 auto}
.article-content p{line-height:2;margin-bottom:18px}
.article-content figure{margin:0}
.article-content figure img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.article-content figure:hover img{transform:scale(1.025)}
.article-content figcaption{padding:15px 16px 17px;font-size:14px;line-height:1.8;color:#53665b;background:#fff;border-top:1px solid #e7eee9}
.symptom-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:24px 0 36px}
.symptom-card{position:relative;border:1px solid #dce8df;border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 18px 42px rgba(19,73,44,.09)}
.symptom-card figure{display:flex;flex-direction:column;height:100%}
.symptom-card figure img{aspect-ratio:4/5;object-fit:cover}
.symptom-card .symptom-label{position:absolute;top:14px;right:14px;z-index:2;display:inline-flex;align-items:center;padding:8px 13px;border-radius:999px;background:rgba(8,70,40,.92);color:#fff;font-size:13px;font-weight:800;backdrop-filter:blur(6px);box-shadow:0 8px 22px rgba(0,0,0,.16)}
.gg-article-intro{position:relative;background:linear-gradient(140deg,#0e5d36,#1f7c4d);color:#fff;border-radius:28px;padding:28px 30px;margin:18px 0 22px;overflow:hidden;box-shadow:0 24px 60px rgba(15,92,54,.18)}
.gg-article-intro:after{content:"";position:absolute;left:-65px;top:-65px;width:190px;height:190px;border-radius:50%;background:rgba(255,255,255,.08)}
.gg-article-intro p{position:relative;z-index:1;margin:0!important;max-width:800px!important;font-size:20px;line-height:2;color:#fff}
.gg-alert{border-radius:20px;padding:18px 20px;margin:22px 0;border:1px solid;box-shadow:0 10px 28px rgba(20,70,45,.05)}
.gg-alert-warning{background:#fff9e9;border-color:#eed78f;color:#6f5712}
.gg-alert-info{background:#edf8f1;border-color:#b8dfc5;color:#214f35}
.gg-alert strong{font-weight:900}
.gg-checklist{counter-reset:ggstep;background:#fff;border:1px solid #dbe9df;border-radius:24px;padding:18px 22px;margin:20px 0 34px;box-shadow:0 16px 42px rgba(18,74,44,.07)}
.gg-checklist ol{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:12px 18px}
.gg-checklist li{counter-increment:ggstep;position:relative;padding:13px 52px 13px 14px;border-radius:16px;background:#f7fbf8;line-height:1.75}
.gg-checklist li:before{content:counter(ggstep);position:absolute;right:12px;top:50%;transform:translateY(-50%);width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:var(--green);color:#fff;font-weight:900}
.gg-table-wrap{overflow:auto;border-radius:22px;box-shadow:0 15px 40px rgba(19,73,44,.07);margin:24px 0 36px}
.gg-table-wrap table{margin:0;border:0;border-radius:22px}
.gg-before-after{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0 30px}
.gg-before-after>div{border-radius:24px;padding:22px;border:1px solid;box-shadow:0 16px 40px rgba(20,70,45,.06)}
.gg-before{background:#fff5f2;border-color:#f0c9bd!important}
.gg-after{background:#eef9f1;border-color:#bfe2c8!important}
.gg-before-after h3{margin-top:0}
.gg-before h3{color:#a03d29}
.gg-after h3{color:#11633b}
.gg-before-after ul{margin:0;background:transparent;border:0;padding:0 24px 0 0}
.gg-cta{position:relative;background:linear-gradient(135deg,#0f4e31,#1d7a4a);color:#fff;border-radius:30px;padding:30px;margin:42px 0 28px;overflow:hidden;box-shadow:0 24px 65px rgba(13,84,48,.22)}
.gg-cta:after{content:"";position:absolute;left:-80px;bottom:-80px;width:230px;height:230px;border-radius:50%;background:rgba(255,255,255,.08)}
.gg-cta h2{background:none;border:0;box-shadow:none;padding:0;margin:0 0 10px;color:#fff}
.gg-cta h2:before{display:none}
.gg-cta p{position:relative;z-index:1;color:#fff;max-width:760px!important}
.gg-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#fff;color:#0f5d37!important;border-radius:14px;padding:13px 20px;font-weight:900;box-shadow:0 10px 25px rgba(0,0,0,.15)}
.toc{border:1px solid #dce8df;border-radius:22px;padding:18px;background:rgba(255,255,255,.96);box-shadow:0 18px 46px rgba(17,70,42,.08);max-height:calc(100vh - 120px);overflow:auto}
.toc strong{font-size:17px;color:var(--green2)}
.toc a{font-size:13px;line-height:1.55;padding:9px 0}
@media(max-width:1000px){.article-wrap{width:min(920px,92%);grid-template-columns:1fr}.toc{position:relative;max-height:none;order:2}.article{order:1}.symptom-gallery{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.article-wrap{width:min(94%,720px);padding-top:24px}.article-content h2{font-size:25px;padding:15px 18px 15px 42px;margin-top:38px}.article-content h3{font-size:20px}.gg-article-intro{padding:22px}.gg-article-intro p{font-size:17px}.symptom-gallery{grid-template-columns:1fr;gap:16px}.symptom-card figure img{aspect-ratio:16/11}.gg-checklist ol,.gg-before-after{grid-template-columns:1fr}.gg-cta{padding:24px 20px}.toc{display:none}}


/* GGS_ARTICLE_RENDER_PERF_V2 */

/*
 * Allow the browser to postpone expensive rendering of
 * below-the-fold article sections.
 */
.article .faq,
.article > .section,
.article .article-card {
    content-visibility: auto;
    contain-intrinsic-size: auto 420px;
}

/*
 * Avoid layout work outside visible cards.
 */
.article-card img {
    content-visibility: auto;
}

/* /GGS_ARTICLE_RENDER_PERF_V2 */

/* =========================================================
   GGS_ARTICLE_NATIVE_V6
   Native Green Grove Soil article system
   ========================================================= */


/* ---------------- HERO ---------------- */

.gg-article-hero{
    background:var(--soft);
    border-bottom:1px solid var(--line);
    padding:48px 0 34px;
}

.gg-article-hero-inner{
    position:relative;
}

.gg-article-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:7px;
    margin:0 0 22px;
    color:var(--muted);
    font-size:13px;
}

.gg-article-breadcrumb a:hover{
    color:var(--green);
}

.gg-article-category{
    display:inline-flex;
    margin-bottom:16px;
    color:var(--green);
    font-weight:800;
}

.gg-article-hero h1{
    max-width:950px;
    margin:0;
    color:var(--brand-dark,var(--green2));
    font-size:clamp(34px,4.4vw,56px);
    font-weight:900;
    line-height:1.28;
    letter-spacing:-.02em;
}

.gg-article-summary{
    max-width:820px;
    margin:18px 0 0;
    color:var(--muted);
    font-size:19px;
    line-height:1.9;
}

.gg-article-meta{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin:18px 0 26px;
    color:var(--muted);
    font-size:13px;
}

.gg-article-meta span{
    display:inline-flex;
    align-items:center;
    gap:5px;
}

.gg-article-meta span:not(:last-child)::after{
    content:"•";
    margin-inline-start:7px;
    color:var(--green);
}

.gg-article-figure{
    width:100%;
    margin:0;
}

.gg-article-figure img{
    width:100%;
    aspect-ratio:16/9;
    max-height:560px;
    object-fit:cover;
    border-radius:26px;
    box-shadow:var(--brand-shadow,var(--shadow));
}


/* ---------------- MAIN LAYOUT ---------------- */

.gg-article-layout{
    display:grid;
    grid-template-columns:280px minmax(0,820px);
    justify-content:center;
    align-items:start;
    gap:42px;
    padding:54px 0 76px;
}

.gg-article-main{
    min-width:0;
}

.gg-article-main .article{
    max-width:none;
    min-width:0;
}


/* ---------------- DESKTOP TOC ---------------- */

.gg-toc-desktop{
    position:sticky;
    top:104px;
    padding:20px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:26px;
    box-shadow:var(--brand-shadow,var(--shadow));
    max-height:calc(100vh - 128px);
    overflow:auto;
}

.gg-toc-desktop > strong{
    display:block;
    margin-bottom:14px;
    color:var(--brand-dark,var(--green2));
    font-size:17px;
    font-weight:900;
}

.gg-toc-list{
    list-style:none;
    padding:0;
    margin:0;
}

.gg-toc-list li{
    margin:0;
}

.gg-toc-list a{
    display:flex;
    align-items:flex-start;
    gap:9px;
    padding:9px 6px;
    color:var(--muted);
    font-size:13px;
    line-height:1.55;
    border-bottom:1px solid var(--line);
    transition:.18s ease;
}

.gg-toc-list li:last-child a{
    border-bottom:0;
}

.gg-toc-number{
    min-width:23px;
    color:var(--green);
    font-size:11px;
    font-weight:900;
}

.gg-toc-list a:hover,
.gg-toc-list a.is-active{
    color:var(--green);
}


/* ---------------- MOBILE TOC ---------------- */

.gg-toc-mobile{
    display:none;
    margin:0 0 28px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
}

.gg-toc-mobile > summary{
    cursor:pointer;
    padding:15px 17px;
    color:var(--brand-dark,var(--green2));
    font-weight:900;
}

.gg-toc-mobile nav{
    padding:0 17px 15px;
}

.gg-toc-mobile a{
    display:block;
    padding:8px 0;
    color:var(--muted);
    border-top:1px solid var(--line);
    font-size:13px;
}


/* ---------------- ARTICLE TYPOGRAPHY ---------------- */

.gg-article-main .article-content{
    color:var(--text);
    font-size:18px;
    line-height:2.05;
    overflow-wrap:anywhere;
}

.gg-article-main .article-content p{
    margin:0 0 20px;
}

.gg-article-main .article-content > p{
    max-width:820px;
}

.gg-article-main .article-content h2{
    position:relative;
    margin:56px 0 20px !important;
    padding:0 18px 0 0 !important;
    color:var(--brand-dark,var(--green2)) !important;
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    font-size:30px !important;
    font-weight:900;
    line-height:1.45;
}

.gg-article-main .article-content h2::before{
    content:"";
    position:absolute;
    inset-inline-start:0;
    top:.18em;
    width:5px;
    height:1.3em;
    background:var(--green);
    border-radius:999px;
}

html[dir="ltr"] .gg-article-main .article-content h2{
    padding:0 0 0 18px !important;
}

.gg-article-main .article-content h3{
    margin:32px 0 13px !important;
    color:var(--brand-dark,var(--green2)) !important;
    font-size:23px !important;
    font-weight:900;
    line-height:1.55;
    display:block !important;
}

.gg-article-main .article-content h3::before{
    display:none !important;
}

.gg-article-main .article-content h4{
    margin:26px 0 10px;
    color:var(--brand-dark,var(--green2));
    font-size:19px;
    font-weight:900;
}

.gg-article-main .article-content a{
    color:var(--green);
    font-weight:700;
    text-decoration:underline;
    text-underline-offset:4px;
}

.gg-article-main .article-content strong{
    color:var(--brand-dark,var(--green2));
}


/* ---------------- LISTS ---------------- */

.gg-article-main .article-content ul,
.gg-article-main .article-content ol{
    margin:20px 0 26px !important;
    padding:0 28px 0 0 !important;
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
}

html[dir="ltr"] .gg-article-main .article-content ul,
html[dir="ltr"] .gg-article-main .article-content ol{
    padding:0 0 0 28px !important;
}

.gg-article-main .article-content li{
    margin:8px 0;
    line-height:1.9;
}

.gg-article-main .article-content li::marker{
    color:var(--green);
}


/* ---------------- CONTENT IMAGES ---------------- */

.gg-article-main .article-content figure{
    margin:30px 0;
    overflow:hidden;
    border-radius:26px;
    border:1px solid var(--line);
}

.gg-article-main .article-content figure img,
.gg-article-main .article-content > img{
    width:100%;
    height:auto;
    border-radius:26px;
}

.gg-article-main .article-content figure:hover img{
    transform:none;
}

.gg-article-main .article-content figcaption{
    padding:12px 16px;
    color:var(--muted);
    background:#fff;
    border-top:1px solid var(--line);
    font-size:13px;
}


/* ---------------- BLOCKQUOTE ---------------- */

.gg-article-main .article-content blockquote{
    margin:28px 0;
    padding:18px 20px;
    background:var(--soft);
    border:1px solid var(--line);
    border-inline-start:4px solid var(--green);
    border-radius:18px;
    color:var(--text);
}


/* ---------------- TABLES ---------------- */

.gg-article-main .article-content table{
    display:block;
    width:100%;
    max-width:100%;
    overflow-x:auto;
    margin:28px 0;
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:none;
    -webkit-overflow-scrolling:touch;
}

.gg-article-main .article-content th,
.gg-article-main .article-content td{
    min-width:140px;
    padding:14px 16px;
    white-space:normal;
    border-bottom:1px solid var(--line);
}

.gg-article-main .article-content th{
    color:var(--brand-dark,var(--green2));
    background:var(--soft);
}


/* ---------------- PRODUCT CTA ---------------- */

.gg-article-main .product-widget{
    grid-template-columns:120px minmax(0,1fr);
    gap:18px;
    margin:42px 0;
    padding:18px;
    border-radius:26px;
    box-shadow:var(--brand-shadow,var(--shadow));
}

.gg-article-main .product-widget-img img{
    width:120px;
    height:120px;
    border-radius:20px;
}

.gg-article-main .product-widget h2{
    font-size:22px;
}

.gg-article-main .product-widget p{
    margin-bottom:12px;
}

.gg-article-main .widget-actions{
    gap:8px;
}


/* ---------------- TECHNICAL DOCUMENTS ---------------- */

.gg-article-main .docs-panel{
    margin:52px 0 0;
    padding:24px;
    border:1px solid var(--line);
    border-radius:26px;
    box-shadow:none;
}

.gg-article-main .docs-grid{
    gap:12px;
}

.gg-article-main .doc-link{
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:none;
}


/* ---------------- FAQ ---------------- */

.gg-article-main .faq{
    margin-top:52px;
    padding-top:34px;
    border-top:1px solid var(--line);
}

.gg-article-main .faq > h2{
    margin:0 0 20px;
    color:var(--brand-dark,var(--green2));
    font-size:30px;
    font-weight:900;
}

.gg-article-main .faq details{
    margin-bottom:10px;
    padding:0;
    overflow:hidden;
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:none;
    background:#fff;
}

.gg-article-main .faq summary{
    padding:16px 18px;
    font-weight:900;
}

.gg-article-main .faq details p{
    margin:0;
    padding:0 18px 18px;
    color:var(--muted);
}


/* ---------------- COMMUNITY ---------------- */

.gg-article-main .feedback-section{
    margin:52px 0 0;
    padding:22px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:26px;
    box-shadow:none;
}

.gg-article-main .feedback-section-head{
    margin-bottom:18px;
}

.gg-article-main .feedback-thread{
    box-shadow:none !important;
}


/* ---------------- RELATED ARTICLES ---------------- */

.gg-related-section{
    margin:58px 0 0 !important;
    padding:34px 0 0 !important;
    border-top:1px solid var(--line);
}

.gg-related-section .section-head{
    margin-bottom:20px;
}

.gg-related-section .section-head h2{
    color:var(--brand-dark,var(--green2));
    font-size:30px;
    font-weight:900;
}

.gg-related-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
}

.gg-related-link{
    display:block;
    color:inherit;
    text-decoration:none;
}

.gg-related-link .article-card{
    height:100%;
    min-height:100%;
}

.gg-related-link .article-card h3{
    margin:10px 0;
    color:var(--brand-dark,var(--green2));
    font-size:18px;
    line-height:1.55;
}

.gg-related-link .article-card .meta{
    margin-top:auto;
    padding-top:8px;
}


/* ---------------- FINAL CTA ---------------- */

.gg-final-cta{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    margin:58px 0 0;
    padding:26px;
    background:var(--soft);
    border:1px solid var(--line);
    border-radius:26px;
}

.gg-final-cta h2{
    margin:3px 0 7px;
    color:var(--brand-dark,var(--green2));
    font-size:27px;
    font-weight:900;
}

.gg-final-cta p{
    max-width:580px;
    margin:0;
    color:var(--muted);
}

.gg-final-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    flex-shrink:0;
}


/* ---------------- RESPONSIVE ---------------- */

@media(max-width:1000px){

    .gg-article-layout{
        grid-template-columns:1fr;
        gap:0;
    }

    .gg-toc-desktop{
        display:none;
    }

    .gg-toc-mobile{
        display:block;
    }

    .gg-related-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .gg-final-cta{
        align-items:flex-start;
        flex-direction:column;
    }
}


@media(max-width:650px){

    .gg-article-hero{
        padding:34px 0 24px;
    }

    .gg-article-breadcrumb{
        margin-bottom:17px;
        font-size:12px;
    }

    .gg-article-category{
        margin-bottom:12px;
    }

    .gg-article-hero h1{
        font-size:30px;
        line-height:1.4;
    }

    .gg-article-summary{
        margin-top:14px;
        font-size:16.5px;
        line-height:1.85;
    }

    .gg-article-meta{
        margin:14px 0 19px;
        gap:6px;
        font-size:12px;
    }

    .gg-article-meta span:not(:last-child)::after{
        display:none;
    }

    .gg-article-figure img{
        border-radius:20px;
    }

    .gg-article-layout{
        padding:30px 0 48px;
    }

    .gg-article-main .article-content{
        font-size:16.5px;
        line-height:2;
    }

    .gg-article-main .article-content h2{
        margin-top:42px !important;
        font-size:25px !important;
    }

    .gg-article-main .article-content h3{
        font-size:20px !important;
    }

    .gg-article-main .product-widget{
        grid-template-columns:1fr;
        margin:34px 0;
        padding:15px;
    }

    .gg-article-main .product-widget-img img{
        width:100%;
        height:auto;
        aspect-ratio:16/9;
    }

    .gg-related-grid{
        grid-template-columns:1fr;
    }

    .gg-final-cta{
        margin-top:44px;
        padding:20px;
        border-radius:22px;
    }

    .gg-final-cta h2{
        font-size:23px;
    }

    .gg-final-actions{
        width:100%;
    }

    .gg-final-actions .btn{
        width:100%;
    }

}


/* /GGS_ARTICLE_NATIVE_V6 */


/* =========================================================
   GGS_ARTICLE_SCROLL_FIX_V1
   Only TOC may remain sticky.
   Hero, titles and images always follow normal page scroll.
   ========================================================= */


/* Restore normal browser scrolling */
html:has(.article-wrap),
body:has(.article-wrap),
html:has(.gg-article-page),
body:has(.gg-article-page){
    height:auto !important;
    min-height:100% !important;
    max-height:none !important;

    overflow-x:hidden !important;
    overflow-y:auto !important;

    overscroll-behavior-y:auto !important;
}


/* The article itself must never become a scroll container */
.gg-article-page,
.gg-article-layout,
.gg-article-main,
.gg-article-main > .article,
.article-wrap,
.article-wrap > .article{
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    overflow:visible !important;

    position:relative !important;
}


/* HERO must move with the page */
.gg-article-hero,
.gg-article-hero-inner,
.gg-article-figure{
    position:relative !important;

    top:auto !important;
    right:auto !important;
    bottom:auto !important;
    left:auto !important;

    inset:auto !important;

    transform:none !important;
}


/* Article title must NEVER be fixed or sticky */
.gg-article-hero h1,
.article > h1{
    position:static !important;

    top:auto !important;
    right:auto !important;
    bottom:auto !important;
    left:auto !important;

    inset:auto !important;

    transform:none !important;
}


/* Hero and content images must scroll normally */
.gg-article-figure img,
.article-hero-img,
.article-content figure,
.article-content figure img,
.article-content > img{
    position:static !important;

    top:auto !important;
    right:auto !important;
    bottom:auto !important;
    left:auto !important;

    inset:auto !important;

    transform:none !important;
}


/* Never create nested vertical scroll inside the article */
.gg-article-main,
.article,
.article-content{
    overflow-y:visible !important;
}


/* TOC can stay sticky, but it must not capture the mouse wheel */
.gg-toc-desktop,
.article-wrap > .toc{
    overflow:visible !important;
    max-height:none !important;
}


/* Desktop: only TOC is sticky */
@media (min-width:1001px){

    .gg-toc-desktop,
    .article-wrap > .toc{
        position:sticky !important;
        top:104px !important;
    }

}


/* Mobile: absolutely nothing inside the article is sticky */
@media (max-width:1000px){

    .gg-toc-desktop,
    .article-wrap > .toc,
    .gg-article-hero,
    .gg-article-figure,
    .article-hero-img,
    .article > h1{
        position:static !important;
        top:auto !important;
    }

}


/* /GGS_ARTICLE_SCROLL_FIX_V1 */