:root{
  --green:#0f3d2e;
  --bg:#f6f7f5;
  --card:#ffffff;
  --text:#102018;
  --muted:#6b7a73;
  --shadow: 0 10px 30px rgba(0,0,0,.10);
  --shadow2: 0 8px 20px rgba(0,0,0,.08);
  --radius: 16px;
  --fb:#1877f2;
  --container: 1120px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;color:var(--text);background:var(--bg)}
a{color:inherit;text-decoration:none}
.cp-title a{color:inherit}
.cp-title a:hover{color:var(--green)}
.cp-card > a{display:block}
.cp-container{max-width:var(--container);margin:0 auto;padding:0 18px}
.cp-topbar{background:#e9eee9;position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(16,32,24,.10)}
.cp-topbar-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:14px}
.cp-brand{display:flex;align-items:center;gap:10px;font-weight:900;font-size:20px;color:var(--green)}
.cp-brand svg{width:28px;height:28px;fill:var(--green)}
.cp-nav{display:flex;gap:18px;align-items:center;flex-wrap:wrap;font-weight:700;color:#32423b}
.cp-nav a{padding:9px 12px;border-radius:999px}
.cp-nav a:hover{background:rgba(15,61,46,.08)}
.cp-nav .is-active{background:var(--green);color:#fff}

.cp-hero{position:relative;min-height:380px;display:flex;align-items:flex-end;overflow:hidden;background:radial-gradient(circle at 30% 40%, rgba(31,166,122,.55), rgba(15,61,46,.65));background-size:cover;background-position:center}
.cp-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.38), rgba(0,0,0,.62))}
.cp-hero-content{position:relative;z-index:1;padding:34px 0 26px;color:#fff}
.cp-hero h1{margin:0 0 10px;font-size:clamp(32px,4.6vw,60px);line-height:.98;letter-spacing:-.6px;font-weight:950}
.cp-hero p{margin:0 0 16px;opacity:.92;font-size:16px;max-width:70ch}

.cp-btn{border:0;cursor:pointer;font-weight:900;border-radius:14px;padding:12px 16px;display:inline-flex;gap:10px;align-items:center}
.cp-btn.primary{background:#0b6b4f;color:#fff;box-shadow:0 12px 22px rgba(11,107,79,.28)}
.cp-btn.fb{background:var(--fb);color:#fff;border-radius:12px;padding:11px 12px}

.cp-section{padding:26px 0 34px}
.cp-section h2{margin:0 0 14px;font-size:30px;letter-spacing:-.4px;font-weight:950}

.cp-row{display:flex;gap:18px;align-items:flex-start}
.cp-main{flex:1;min-width:0}
.cp-sidebar{width:320px;flex:0 0 320px}

.cp-ad-box{background:#fff;border:2px dashed rgba(15,61,46,.20);border-radius:18px;padding:20px;text-align:center;box-shadow:var(--shadow2);margin-bottom:16px;overflow:hidden}
.cp-ad-label{font-size:11px;font-weight:900;color:#0f3d2e;margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px;opacity:.7}
.cp-top-ad{margin:18px 0 18px}
.cp-top-ad .cp-ad-box{margin-bottom:0;border-radius:18px;box-shadow:0 10px 30px rgba(0,0,0,.08)}
.cp-ad-box > div{min-height:90px;display:flex;align-items:center;justify-content:center}
.cp-ad-card{display:flex;align-items:center;justify-content:center;background:transparent;border:none;box-shadow:none;padding:0}
.cp-ad-card .cp-ad-box{width:100%;margin-bottom:0}

.cp-featured{background:#fff;border-radius:18px;overflow:hidden;box-shadow:var(--shadow);border:1px solid rgba(16,32,24,.08);margin:8px 0 18px}
.cp-featured-img{height:300px;background:#d9dedb center/cover no-repeat}
.cp-featured-body{padding:18px}
.cp-featured-title{font-size:26px;font-weight:950;margin:8px 0 8px;letter-spacing:-.4px}
.cp-featured-badge{display:inline-block;background:rgba(15,61,46,.92);color:#fff;padding:7px 12px;border-radius:999px;font-weight:950;font-size:12px}

.cp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.cp-card{background:var(--card);border:1px solid rgba(16,32,24,.08);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow2);transition:transform .15s ease,box-shadow .15s ease;display:flex;flex-direction:column}
.cp-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.cp-thumb{height:180px;background:#d9dedb center/cover no-repeat;position:relative}
.cp-badges{position:absolute;left:12px;top:12px;display:flex;gap:8px;flex-wrap:wrap}
.cp-badge{font-size:12px;font-weight:900;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.92);border:1px solid rgba(16,32,24,.12);backdrop-filter:blur(6px)}
.cp-badge.featured{background:rgba(15,61,46,.92);color:#fff;border-color:rgba(255,255,255,.15)}
.cp-body{padding:14px 14px 12px;display:flex;flex-direction:column;gap:10px;flex:1}
.cp-title{font-size:18px;font-weight:950;margin:0;letter-spacing:-.2px}
.cp-meta{display:flex;gap:10px;flex-wrap:wrap;color:var(--muted);font-weight:800;font-size:13px}
.cp-desc{margin:0;color:#2d3a34;opacity:.92;line-height:1.35;font-size:14px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.cp-actions{margin-top:auto;display:flex;gap:10px;padding-top:6px}
.cp-actions a{width:100%}

.cp-footer{padding:26px 0 40px;color:var(--muted);font-weight:700;font-size:13px;border-top:1px solid rgba(16,32,24,.10)}
.cp-footer-row{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}

.cp-search-box{margin-bottom:24px}
.cp-search-box form{position:relative;max-width:600px}
.cp-search-input{width:100%;padding:14px 50px 14px 20px;border:2px solid rgba(15,61,46,.15);border-radius:16px;font-size:16px;font-weight:600;background:#fff;transition:all .2s ease}
.cp-search-input:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(15,61,46,.08)}
.cp-search-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:var(--green);color:#fff;border:0;border-radius:10px;padding:10px 14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}
.cp-search-btn:hover{background:#0b6b4f}

.cp-filters{margin-bottom:16px}
.cp-filter-group{display:flex;gap:10px;flex-wrap:wrap}
.cp-filter-btn{display:inline-flex;align-items:center;gap:6px;padding:10px 16px;background:#fff;border:2px solid rgba(15,61,46,.15);border-radius:999px;font-size:14px;font-weight:900;color:#203129;transition:all .2s ease;text-decoration:none}
.cp-filter-btn:hover{background:rgba(15,61,46,.05);border-color:rgba(15,61,46,.25)}
.cp-filter-btn.active{background:var(--green);color:#fff;border-color:var(--green)}
.cp-filter-icon{font-size:16px}

.cp-submit-form{background:#fff;border-radius:20px;padding:30px;box-shadow:var(--shadow);border:1px solid rgba(16,32,24,.08)}
.cp-form-section{margin-bottom:30px}
.cp-form-section:last-child{margin-bottom:0}
.cp-form-section h3{font-size:20px;font-weight:950;margin:0 0 20px;color:var(--green);letter-spacing:-.3px}
.cp-form-group{margin-bottom:20px}
.cp-form-group label{display:block;font-weight:900;font-size:14px;margin-bottom:8px;color:var(--text)}
.cp-form-group .required{color:#d32f2f}
.cp-form-group input[type="text"],.cp-form-group input[type="email"],.cp-form-group input[type="url"],.cp-form-group input[type="date"],.cp-form-group select,.cp-form-group textarea{width:100%;padding:12px 16px;border:2px solid rgba(15,61,46,.15);border-radius:12px;font-size:15px;font-weight:600;font-family:inherit;transition:all .2s ease;background:#fff}
.cp-form-group input:focus,.cp-form-group select:focus,.cp-form-group textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(15,61,46,.08)}
.cp-form-group small{display:block;margin-top:6px;font-size:13px;color:var(--muted);font-weight:700}
.cp-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cp-success-box,.cp-error-box{text-align:center;padding:40px;background:#fff;border-radius:20px;box-shadow:var(--shadow);margin-bottom:30px}
.cp-error-box{background:#fef2f2;border:2px solid #fca5a5;color:#991b1b}

@media (max-width:1200px){
  .cp-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:980px){
  .cp-grid{grid-template-columns:1fr 1fr}
  .cp-filter-btn{font-size:13px;padding:8px 12px}
  .cp-form-row{grid-template-columns:1fr}
}
@media (max-width:680px){
  .cp-nav{display:none}
  .cp-grid{grid-template-columns:1fr}
  .cp-hero{min-height:340px}
  .cp-filter-btn{font-size:12px;padding:7px 10px}
  .cp-submit-form{padding:20px}
}