:root{
  --color-primary:#111827;
  --color-accent:#16a34a;
  --color-bg:#ffffff;
  --color-surface:#f8fafc;
  --color-border:rgba(17,24,39,0.12);
  --color-muted:rgba(17,24,39,0.72);

  --radius:12px;
  --radius-sm:10px;

  --shadow-sm:0 1px 2px rgba(17,24,39,0.06);
  --shadow-md:0 10px 30px rgba(17,24,39,0.10);

  --container-max:700px;
  --pad:16px;
  --gap:24px;

  --font:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Noto Sans","Liberation Sans",sans-serif;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--color-bg);
  color:var(--color-primary);
  font-family:var(--font);
  font-size:18px;
  line-height:1.6;
}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;}
a:hover{color:var(--color-accent);}
a:focus-visible,button:focus-visible{outline:3px solid rgba(22,163,74,0.35);outline-offset:2px;border-radius:10px;}

.container{
  width:100%;
  max-width:var(--container-max);
  margin:0 auto;
  padding:0 var(--pad);
}

.site-main{
  padding:18px 0 calc(88px + env(safe-area-inset-bottom));
}

/* Header + mobile nav */
.site-header{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(255,255,255,0.92);
  backdrop-filter:saturate(140%) blur(8px);
  border-bottom:1px solid var(--color-border);
}
.header-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 0;
}
.brand-link{display:flex;flex-direction:column;gap:2px;text-decoration:none;}
.brand-name{font-weight:800;letter-spacing:-0.01em;}
.brand-slogan{font-size:0.92rem;color:var(--color-muted);}

.nav-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:44px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-primary);
  font-weight:700;
}
.nav-toggle-label{font-size:0.95rem;}
.nav-toggle-icon{
  width:18px;height:12px;position:relative;display:inline-block;
}
.nav-toggle-icon::before,
.nav-toggle-icon::after{
  content:"";
  position:absolute;left:0;right:0;
  height:2px;border-radius:2px;
  background:var(--color-primary);
}
.nav-toggle-icon::before{top:1px;box-shadow:0 4px 0 var(--color-primary),0 8px 0 var(--color-primary);}
.nav-toggle-icon::after{display:none;}

.site-nav{
  padding:10px 0 14px;
}
.nav-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;}
.nav-link{
  display:flex;
  align-items:center;
  min-height:44px;
  padding:10px 12px;
  border-radius:12px;
  text-decoration:none;
  border:1px solid var(--color-border);
  background:var(--color-bg);
}
.nav-link:hover{color:var(--color-accent);border-color:rgba(22,163,74,0.35);}
.nav-meta{margin-top:10px;}
.nav-phone{display:inline-flex;min-height:44px;align-items:center;padding:10px 12px;border-radius:12px;background:var(--color-surface);border:1px solid var(--color-border);text-decoration:none;font-weight:700;}

/* Fixed call CTA */
.fixed-call{
  position:fixed;
  left:0;right:0;
  bottom:0;
  z-index:60;
  padding:10px var(--pad) calc(10px + env(safe-area-inset-bottom));
  background:linear-gradient(to top, rgba(255,255,255,0.98), rgba(255,255,255,0.70));
  border-top:1px solid var(--color-border);
  text-decoration:none;
}
.fixed-call-inner{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  width:100%;
  max-width:var(--container-max);
  margin:0 auto;
  border-radius:999px;
  background:var(--color-accent);
  color:#fff;
  font-weight:800;
  letter-spacing:0.01em;
  box-shadow:var(--shadow-md);
}

/* Buttons */
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid transparent;
  text-decoration:none;
  font-weight:800;
}
.button-primary{background:var(--color-accent);color:#fff;}
.button-secondary{background:transparent;border-color:var(--color-border);}

/* Home hero */
.home-hero{display:flex;flex-direction:column;gap:14px;margin-top:14px;}
.hero-media{border-radius:var(--radius);overflow:hidden;border:1px solid var(--color-border);background:var(--color-surface);}
.hero-image{width:100%;aspect-ratio:16/9;object-fit:cover;}
.hero-content{display:flex;flex-direction:column;gap:10px;}
.hero-badge{margin:0;display:inline-flex;align-self:flex-start;padding:6px 10px;border-radius:999px;background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-muted);font-size:0.92rem;}
.hero-title{margin:0;font-size:clamp(1.6rem,4.5vw,2.0rem);line-height:1.2;letter-spacing:-0.02em;}
.hero-title-accent{color:var(--color-accent);}
.hero-desc{margin:0;color:var(--color-muted);}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px;}

/* Sections */
.section-header{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:26px 0 12px;}
.section-title{margin:0;font-size:clamp(1.3rem,3.6vw,1.6rem);line-height:1.25;}

/* Cards grid */
.cards-grid{display:grid;grid-template-columns:1fr;gap:12px;}
@media (min-width:360px){
  .cards-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (min-width:480px){
  :root{--pad:20px;}
  .cards-grid{gap:16px;}
}
@media (min-width:768px){
  :root{--pad:24px;}
}

.card{
  background:var(--color-bg);
  border:1px solid var(--color-border);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow-sm);
}
.card-link{display:block;color:inherit;text-decoration:none;}
.card-link:hover .card-title{color:var(--color-accent);}
.card-media{background:var(--color-surface);}
.card-media--placeholder{aspect-ratio:4/3;}
.post-card-image{width:100%;aspect-ratio:4/3;object-fit:cover;}
.card-body{padding:14px;display:flex;flex-direction:column;gap:8px;}
.card-title{margin:0;font-size:clamp(1.05rem,3.0vw,1.2rem);line-height:1.25;}
.card-excerpt{margin:0;color:var(--color-muted);font-size:0.98rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.card-cta{margin:0;font-weight:800;color:var(--color-accent);font-size:0.98rem;}

/* Category */
.category-header{display:flex;flex-direction:column;gap:12px;margin-top:14px;}
.category-title{margin:0;font-size:clamp(1.6rem,4.5vw,2.0rem);line-height:1.2;}
.category-media{border-radius:var(--radius);overflow:hidden;border:1px solid var(--color-border);background:var(--color-surface);}
.category-image{width:100%;aspect-ratio:16/9;object-fit:cover;}
.subcategory-chips{display:flex;flex-wrap:wrap;gap:10px;}
.chip{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  text-decoration:none;
  font-weight:700;
}
.chip:hover{border-color:rgba(22,163,74,0.35);color:var(--color-accent);}

/* Article */
.article-shell{margin-top:14px;}
.article-header{margin-bottom:12px;}
.article-title{margin:0;font-size:clamp(1.6rem,4.5vw,2.0rem);line-height:1.2;letter-spacing:-0.02em;}
.article-meta{margin:8px 0 0;color:var(--color-muted);font-size:0.95rem;}
.article-featured{margin:14px 0 18px;}
.post-image,.page-image{width:100%;border-radius:var(--radius);border:1px solid var(--color-border);background:var(--color-surface);aspect-ratio:16/9;object-fit:cover;}

.article-content{font-size:1rem;}
.article-content h2{font-size:clamp(1.3rem,3.6vw,1.6rem);line-height:1.25;margin:26px 0 10px;}
.article-content h3{font-size:clamp(1.15rem,3.0vw,1.35rem);line-height:1.25;margin:22px 0 10px;}
.article-content h4{font-size:1.05rem;line-height:1.25;margin:18px 0 8px;}
.article-content p{margin:0 0 16px;}
.article-content ul,.article-content ol{margin:0 0 16px;padding-left:22px;}
.article-content li{margin:6px 0;}
.article-content a{color:var(--color-accent);text-decoration:underline;}
.article-content blockquote{
  margin:18px 0;
  padding:14px 14px;
  border-left:4px solid var(--color-accent);
  background:var(--color-surface);
  border-radius:0 var(--radius) var(--radius) 0;
  color:var(--color-muted);
}
.article-content hr{border:0;border-top:1px solid var(--color-border);margin:22px 0;}
.article-content figure{margin:18px 0;}
.article-content figcaption{margin-top:8px;color:var(--color-muted);font-size:0.95rem;}
.article-content table{width:100%;border-collapse:collapse;margin:18px 0;border:1px solid var(--color-border);border-radius:var(--radius);overflow:hidden;display:block;}
.article-content thead{background:var(--color-surface);}
.article-content th,.article-content td{padding:10px 12px;border-bottom:1px solid var(--color-border);text-align:left;}
.article-content code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:0.95em;background:var(--color-surface);padding:2px 6px;border-radius:8px;border:1px solid var(--color-border);}
.article-content pre{margin:18px 0;padding:14px;border-radius:var(--radius);background:#0b1220;color:#e5e7eb;overflow:auto;}
.article-content pre code{background:transparent;border:0;padding:0;color:inherit;}

/* TOC support */
.article-toc{
  margin:18px 0 22px;
  padding:14px;
  border:1px solid var(--color-border);
  border-radius:var(--radius);
  background:var(--color-surface);
}
.article-toc-title{margin:0 0 10px;font-weight:900;font-size:0.95rem;letter-spacing:0.02em;text-transform:uppercase;color:var(--color-muted);}
.article-toc ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;}
.article-toc a{
  display:block;
  padding:10px 12px;
  border-radius:12px;
  background:var(--color-bg);
  border:1px solid var(--color-border);
  text-decoration:none;
  font-weight:800;
  color:var(--color-primary);
}
.article-toc a:hover{color:var(--color-accent);border-color:rgba(22,163,74,0.35);}

/* Rich text wrapper for theme blocks */
.rich-text h2{font-size:clamp(1.3rem,3.6vw,1.6rem);line-height:1.25;margin:0 0 10px;}
.rich-text h3{font-size:clamp(1.15rem,3.0vw,1.35rem);line-height:1.25;margin:18px 0 10px;}
.rich-text p{margin:0 0 14px;}
.rich-text ul,.rich-text ol{margin:0 0 14px;padding-left:22px;}

/* Pagination */
.pagination{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:18px 0 0;}
.pagination-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-bg);
  text-decoration:none;
  font-weight:800;
}
.pagination-link.is-disabled{opacity:0.55;}
.pagination-status{color:var(--color-muted);font-size:0.95rem;}

/* Footer */
.site-footer{border-top:1px solid var(--color-border);background:var(--color-surface);padding:18px 0 calc(18px + env(safe-area-inset-bottom));}
.footer-inner{display:flex;flex-direction:column;gap:10px;}
.footer-site-name{margin:0;font-weight:900;}
.footer-slogan{margin:0;color:var(--color-muted);}
.footer-phone{margin:0;}
.footer-text p{margin:0 0 10px;color:var(--color-muted);}
.kp-credit{margin:0;color:var(--color-muted);font-size:0.95rem;}

/* Empty + error */
.empty-state{padding:14px;border:1px dashed var(--color-border);border-radius:var(--radius);background:var(--color-surface);color:var(--color-muted);}
.error-shell{margin-top:18px;padding:18px;border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface);}
.error-title{margin:0 0 10px;font-size:clamp(1.6rem,4.5vw,2.0rem);line-height:1.2;}
.error-text{margin:0 0 14px;color:var(--color-muted);}
.error-actions{margin:0;}
