:root{--green:#008060;--green-light:#00a375;--green-pale:#f1f8f5;--green-mid:#c9e8de;--green-text:#003d2e;--white:#fff;--bg:#f6f6f7;--border:#e1e3e5;--border2:#c9cccf;--text-primary:#202223;--text-secondary:#6d7175;--text-subdued:#8c9196;--critical:#d72c0d;--warning:#ffc453;--r-sm:6px;--r-md:8px;--r-lg:12px;--r-xl:16px;--shadow-sm:0 1px 2px rgba(26,26,26,.08);--shadow-md:0 4px 12px rgba(26,26,26,.1);--shadow-lg:0 8px 32px rgba(26,26,26,.12)}
*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}
body{font-family:'Plus Jakarta Sans',sans-serif;background:var(--bg);color:var(--text-primary);font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased}
.topbar{background:var(--green-text);padding:8px 32px;display:flex;align-items:center;justify-content:center;gap:10px}
.topbar-text{font-size:13px;color:rgba(255,255,255,0.85)}
.topbar-link{font-size:13px;font-weight:600;color:#a8e6c8;text-decoration:none}
.topbar-link:hover{color:#fff}
nav{background:var(--white);border-bottom:1px solid var(--border);padding:0 40px;display:flex;align-items:center;height:64px;position:sticky;top:0;z-index:200;box-shadow:var(--shadow-sm)}
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none;margin-right:auto}
.nav-logo-icon{width:32px;height:32px;background:var(--green);border-radius:var(--r-md);display:flex;align-items:center;justify-content:center}
.nav-logo-icon svg{width:18px;height:18px;fill:white}
.nav-logo-text{font-size:18px;font-weight:800;color:var(--text-primary);letter-spacing:-0.02em}
.nav-logo-badge{font-size:10px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;background:var(--green-pale);color:var(--green);padding:2px 8px;border-radius:100px;border:1px solid var(--green-mid)}
.nav-links{display:flex;align-items:center;gap:4px}
.nav-link{font-size:14px;font-weight:500;color:var(--text-secondary);text-decoration:none;padding:8px 14px;border-radius:var(--r-md);transition:all 0.15s}
.nav-link:hover,.nav-link.active{background:var(--bg);color:var(--text-primary)}
.nav-link.active{color:var(--green);font-weight:600}
.nav-cta{font-size:14px;font-weight:600;color:var(--white);background:var(--green);text-decoration:none;padding:9px 20px;border-radius:var(--r-md);transition:all 0.15s;margin-left:12px;display:flex;align-items:center;gap:6px;box-shadow:0 1px 0 rgba(0,0,0,.15),inset 0 1px 0 rgba(255,255,255,.15)}
.nav-cta:hover{background:var(--green-light);transform:translateY(-1px)}

/* BLOG HERO */
.blog-hero{background:var(--white);border-bottom:1px solid var(--border);padding:60px 40px}
.blog-hero-inner{max-width:1200px;margin:0 auto}
.blog-hero-kicker{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--green);margin-bottom:12px;display:flex;align-items:center;gap:8px}
.blog-hero-kicker::before{content:'';width:16px;height:2px;background:var(--green);border-radius:1px}
.blog-hero-title{font-size:clamp(32px,4vw,48px);font-weight:800;letter-spacing:-0.03em;color:var(--text-primary);line-height:1.1;margin-bottom:14px}
.blog-hero-desc{font-size:16px;color:var(--text-secondary);line-height:1.7;max-width:600px;margin-bottom:32px}
.blog-search{display:flex;gap:10px;max-width:520px}
.blog-search input{flex:1;padding:12px 16px;border:1px solid var(--border2);border-radius:var(--r-md);font-size:14px;font-family:inherit;color:var(--text-primary);outline:none;transition:border-color 0.15s}
.blog-search input:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--green-pale)}
.blog-search-btn{padding:12px 24px;background:var(--green);color:white;border:none;border-radius:var(--r-md);font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;transition:all 0.15s}
.blog-search-btn:hover{background:var(--green-light)}

/* MAIN LAYOUT */
.blog-layout{max-width:1200px;margin:0 auto;padding:48px 40px;display:grid;grid-template-columns:1fr 320px;gap:48px;align-items:start}

/* CATEGORY FILTER */
.cat-filter{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}
.cat-btn{font-size:12px;font-weight:600;padding:6px 16px;border-radius:100px;border:1px solid var(--border2);background:var(--white);color:var(--text-secondary);cursor:pointer;transition:all 0.15s}
.cat-btn:hover{border-color:var(--green);color:var(--green)}
.cat-btn.active{background:var(--green);border-color:var(--green);color:white}

/* FEATURED POST */
.featured-post{background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-sm);margin-bottom:24px;text-decoration:none;display:block;transition:all 0.2s}
.featured-post:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--green-mid)}
.fp-inner{display:grid;grid-template-columns:1fr 1fr;align-items:center}
.fp-thumb{aspect-ratio:4/3;background:linear-gradient(135deg,var(--green-text),#005c45);display:flex;align-items:center;justify-content:center;font-size:64px;position:relative}
.fp-badge{position:absolute;top:14px;left:14px;background:var(--green);color:white;font-size:10px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;padding:4px 12px;border-radius:100px}
.fp-badge-featured{background:#e67e00}
.fp-content{padding:32px}
.fp-category{font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--green);margin-bottom:10px}
.fp-title{font-size:20px;font-weight:800;color:var(--text-primary);letter-spacing:-0.02em;line-height:1.3;margin-bottom:12px}
.fp-excerpt{font-size:14px;color:var(--text-secondary);line-height:1.7;margin-bottom:16px}
.fp-meta{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--text-subdued)}
.fp-meta-dot{width:3px;height:3px;border-radius:50%;background:var(--border2)}
.fp-read{font-size:13px;font-weight:600;color:var(--green);margin-top:14px;display:flex;align-items:center;gap:4px}

/* POST GRID */
.post-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.post-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-sm);text-decoration:none;display:block;transition:all 0.2s}
.post-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--green-mid)}
.pc-thumb{aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;font-size:36px;position:relative}
.pc-cat-badge{position:absolute;top:10px;left:10px;font-size:10px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:white;padding:3px 10px;border-radius:100px}
.pc-body{padding:18px}
.pc-category{font-size:10px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--green);margin-bottom:8px}
.pc-title{font-size:15px;font-weight:700;color:var(--text-primary);line-height:1.4;margin-bottom:8px;letter-spacing:-0.01em}
.pc-excerpt{font-size:12px;color:var(--text-secondary);line-height:1.65;margin-bottom:12px}
.pc-meta{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--text-subdued)}
.pc-meta-dot{width:3px;height:3px;border-radius:50%;background:var(--border2)}

/* SIDEBAR */
.sidebar{}
.sidebar-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);padding:24px;box-shadow:var(--shadow-sm);margin-bottom:20px}
.sidebar-title{font-size:14px;font-weight:700;color:var(--text-primary);margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--border)}
.sidebar-post{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);text-decoration:none;transition:all 0.15s}
.sidebar-post:last-child{border-bottom:none;padding-bottom:0}
.sidebar-post:hover .sp-title{color:var(--green)}
.sp-thumb{width:52px;height:52px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.sp-title{font-size:13px;font-weight:600;color:var(--text-primary);line-height:1.4;margin-bottom:4px;transition:color 0.15s}
.sp-meta{font-size:11px;color:var(--text-subdued)}
.tag-cloud{display:flex;flex-wrap:wrap;gap:8px}
.tag{font-size:12px;font-weight:500;padding:5px 12px;border-radius:100px;border:1px solid var(--border2);color:var(--text-secondary);text-decoration:none;transition:all 0.15s}
.tag:hover{border-color:var(--green);color:var(--green);background:var(--green-pale)}

/* AUDIT CTA SIDEBAR */
.sidebar-audit{background:var(--green);border-radius:var(--r-xl);padding:24px;text-align:center}
.sa-icon{font-size:36px;margin-bottom:12px}
.sa-title{font-size:16px;font-weight:800;color:white;margin-bottom:8px;letter-spacing:-0.01em}
.sa-desc{font-size:13px;color:rgba(255,255,255,.8);line-height:1.6;margin-bottom:20px}
.sa-btn{display:block;background:white;color:var(--green);font-size:13px;font-weight:700;padding:11px 20px;border-radius:var(--r-md);text-decoration:none;transition:all 0.2s}
.sa-btn:hover{background:var(--green-pale);transform:translateY(-1px)}
.sa-note{font-size:11px;color:rgba(255,255,255,.6);margin-top:10px}

/* NEWSLETTER */
.newsletter-bar{background:var(--green-pale);border:1px solid var(--green-mid);border-radius:var(--r-xl);padding:32px 40px;display:flex;align-items:center;gap:40px;margin-top:40px}
.nl-left{flex:1}
.nl-title{font-size:18px;font-weight:800;color:var(--text-primary);letter-spacing:-0.02em;margin-bottom:6px}
.nl-desc{font-size:14px;color:var(--text-secondary)}
.nl-form{display:flex;gap:10px;flex-shrink:0}
.nl-input{padding:11px 16px;border:1px solid var(--border2);border-radius:var(--r-md);font-size:14px;font-family:inherit;width:240px;outline:none;transition:border-color 0.15s}
.nl-input:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--green-pale)}
.nl-btn{padding:11px 24px;background:var(--green);color:white;border:none;border-radius:var(--r-md);font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;white-space:nowrap;transition:all 0.15s}
.nl-btn:hover{background:var(--green-light)}

/* FOOTER */
footer{background:var(--text-primary);padding:48px 40px 32px}
.footer-inner{max-width:1200px;margin:0 auto}
.footer-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:60px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.1)}
.footer-brand-name{font-size:20px;font-weight:800;color:var(--white);letter-spacing:-0.02em;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.footer-brand-dot{width:8px;height:8px;border-radius:50%;background:var(--green)}
.footer-brand-desc{font-size:13px;color:rgba(255,255,255,.45);line-height:1.7;max-width:280px}
.footer-col-title{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:16px}
.footer-links{list-style:none;display:flex;flex-direction:column;gap:10px}
.footer-links a{font-size:13px;color:rgba(255,255,255,.6);text-decoration:none;transition:color 0.15s}
.footer-links a:hover{color:rgba(255,255,255,.9)}
.footer-bottom{padding-top:24px;display:flex;justify-content:space-between;align-items:center}
.footer-copy{font-size:12px;color:rgba(255,255,255,.3)}
.footer-bottom-links{display:flex;gap:20px}
.footer-bottom-links a{font-size:12px;color:rgba(255,255,255,.3);text-decoration:none}
.footer-bottom-links a:hover{color:rgba(255,255,255,.6)}

@media(max-width:1024px){
  .blog-layout{grid-template-columns:1fr;padding:32px 24px}
  .fp-inner{grid-template-columns:1fr}
  .post-grid{grid-template-columns:1fr}
  .newsletter-bar{flex-direction:column;gap:20px;padding:24px}
  .nl-form{width:100%}
  .nl-input{flex:1}
  .footer-top{grid-template-columns:1fr 1fr;gap:32px}
  .blog-hero{padding:40px 24px}
}
@media(max-width:640px){
  nav{padding:0 20px}
  .footer-top{grid-template-columns:1fr}
}

/* ── SIDEBAR ── */
.blog-sidebar{position:sticky;top:80px}
.sidebar-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);padding:24px;margin-bottom:20px;box-shadow:var(--shadow-sm)}
.sidebar-card-title{font-size:15px;font-weight:700;color:var(--text-primary);margin-bottom:10px}
.sidebar-card-desc{font-size:13px;color:var(--text-secondary);line-height:1.7;margin-bottom:16px}
.sidebar-card-btn{display:block;background:var(--green);color:white;text-align:center;padding:12px;border-radius:var(--r-md);text-decoration:none;font-size:14px;font-weight:700;transition:all 0.15s}
.sidebar-card-btn:hover{background:var(--green-light);transform:translateY(-1px)}
.sidebar-categories{list-style:none}
.sidebar-categories li{border-bottom:1px solid var(--border);padding:8px 0}
.sidebar-categories li:last-child{border-bottom:none}
.sidebar-categories a{font-size:13px;color:var(--text-secondary);text-decoration:none;display:flex;justify-content:space-between;transition:color 0.15s}
.sidebar-categories a:hover{color:var(--green)}
.sidebar-categories span{color:var(--text-subdued)}

/* ── PAGINATION ── */
.nav-links{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 12px;border:1px solid var(--border);border-radius:var(--r-md);font-size:13px;font-weight:600;color:var(--text-secondary);text-decoration:none;transition:all 0.15s}
.page-numbers:hover,.page-numbers.current{background:var(--green);border-color:var(--green);color:white}