.cod-article {
    --cod-green: #306327;
    --cod-ink: #17251a;
    --cod-muted: #5a695e;
    background: #f7f9f5;
    color: var(--cod-ink);
    font-family: Poppins, Arial, sans-serif;
}
.cod-article *, .cod-article *::before, .cod-article *::after { box-sizing: border-box; }
.cod-article__wrap { width: min(100% - 48px, 1000px); margin-inline: auto; }
.cod-article__hero { padding: 48px 0 76px; background: linear-gradient(120deg, #173e20, #306327 72%, #438332); color: #fff; }
.cod-article__breadcrumb { display: flex; align-items: center; gap: 10px; margin-bottom: 44px; color: #cee9c6; font-size: 13px; }
.cod-article__breadcrumb a { color: inherit; text-decoration: none; }
.cod-article__breadcrumb a:hover, .cod-article__breadcrumb a:focus-visible { color: #fff; text-decoration: underline; }
.cod-article__eyebrow { display: block; margin-bottom: 15px; color: #d2edc8; font-size: 12px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.cod-article__hero h1 { max-width: 920px; margin: 0 0 25px; color: #fff; font-size: clamp(32px, 4.5vw, 54px); font-weight: 700; line-height: 1.18; letter-spacing: -.035em; }
.cod-article__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; color: #e1efdc; font-size: 13px; }
.cod-article__layout { padding: 0 0 100px; }
.cod-article__body { position: relative; max-width: 850px; margin: -38px auto 0; padding: 55px 62px 45px; border: 1px solid #e2e9de; border-radius: 18px; background: #fff; box-shadow: 0 16px 45px rgba(20, 53, 23, .08); }
.cod-article__content { color: #344338; font-size: 17px; line-height: 1.84; overflow-wrap: break-word; }
.cod-article__content > :first-child { margin-top: 0; }
.cod-article__content p { margin: 0 0 1.35em; color: inherit; font-size: inherit; line-height: inherit; }
.cod-article__content h2, .cod-article__content h3, .cod-article__content h4 { color: var(--cod-ink); font-weight: 700; line-height: 1.3; letter-spacing: -.025em; scroll-margin-top: 30px; }
.cod-article__content h2 { margin: 2.2em 0 .65em; padding-top: .7em; border-top: 1px solid #e8eee5; font-size: clamp(24px, 2.7vw, 31px); }
.cod-article__content h3 { margin: 1.7em 0 .55em; font-size: 23px; }
.cod-article__content h4 { margin: 1.5em 0 .5em; font-size: 19px; }
.cod-article__content a { color: var(--cod-green); text-decoration: underline; text-underline-offset: 3px; }
.cod-article__content a:hover { color: #193e1d; }
.cod-article__content ul, .cod-article__content ol { margin: 0 0 1.5em; padding-left: 1.5em; color: inherit; }
.cod-article__content li { margin-bottom: .45em; padding-left: .2em; line-height: 1.7; }
.cod-article__content li::marker { color: var(--cod-green); }
.cod-article__content figure { max-width: 100%; margin: 0 0 36px; }
.cod-article__content img { max-width: 100%; height: auto; }
.cod-article__content figure img, .cod-article__content > p > img { display: block; max-width: 100%; height: auto; border-radius: 12px; }
.cod-article__content figcaption { margin-top: 9px; color: var(--cod-muted); font-size: 12px; text-align: center; }
.cod-article__content blockquote { margin: 28px 0; padding: 18px 24px; border-left: 4px solid var(--cod-green); background: #f2f7ef; color: var(--cod-ink); }
.cod-article__content table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.cod-article__content th, .cod-article__content td { padding: 10px 14px; border: 1px solid #dce6d8; }
.cod-article__content pre { max-width: 100%; overflow-x: auto; padding: 18px; border-radius: 8px; background: #f2f6ef; font-size: 14px; line-height: 1.6; }
.cod-article__content iframe, .cod-article__content video, .cod-article__content embed { max-width: 100%; }
.cod-article__content .wp-block-columns { gap: 24px; }
.cod-article__footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 55px; padding-top: 30px; border-top: 1px solid #e2e9de; }
.cod-article__footer p { max-width: 400px; margin: 0; color: var(--cod-muted); font-size: 14px; line-height: 1.6; }
.cod-article__footer a { flex: none; display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; border-radius: 8px; background: var(--cod-green); color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; }
.cod-article__footer a:hover, .cod-article__footer a:focus-visible { background: #1c451f; color: #fff; }
.cod-article__pages { margin-top: 25px; }

@media (max-width: 760px) {
    .cod-article__wrap { width: min(100% - 32px, 1000px); }
    .cod-article__hero { padding: 32px 0 68px; }
    .cod-article__breadcrumb { margin-bottom: 34px; }
    .cod-article__body { margin-top: -30px; padding: 30px 22px; border-radius: 14px; }
    .cod-article__content { font-size: 16px; line-height: 1.75; }
    .cod-article__content h2 { margin-top: 1.8em; }
    .cod-article__footer { display: block; }
    .cod-article__footer a { margin-top: 18px; }
}
