@import url("./header-v4.css?v=2");
@import url("./header-v8.css?v=12");
@import url("./moneybird-v9.css?v=16");

/*
 * Kennisbank & blog v2
 * Editorial rhythm inspired by Moneybird and Propty, expressed in the
 * Webgroeiers colours and typography. The article content remains native HTML.
 */
:root {
  --kb-ink: #09231a;
  --kb-green: #0b805d;
  --kb-green-dark: #052a20;
  --kb-mint: #e8f4ef;
  --kb-sand: #f3eee4;
  --kb-line: #dfe8e3;
  --kb-muted: #5d6f68;
  --kb-page: min(1248px, calc(100vw - 64px));
  --kb-reading: 736px;
}

html:has(body.wg-kb-v2),
body.wg-kb-v2 {
  overflow-x: clip;
  background: #fff;
  color: var(--kb-ink);
}

body.wg-kb-v2 { padding-top: 0; }
.wg-kb-v2 .article-page { background: #fff; }

/* White editorial articles need the glass header from the first pixel. */
.wg-kb-v2.is-kb-article .site-header::after {
  background: rgba(255,255,255,.9) !important;
  box-shadow: 0 1px 1px -.5px rgba(31,33,32,.03), 0 8px 20px -8px rgba(31,33,32,.08) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
}
.wg-kb-v2.is-kb-article .site-header .logo-text,
.wg-kb-v2.is-kb-article .site-header .nav-mega-trigger,
.wg-kb-v2.is-kb-article .site-header .nav-links > li > a:not(.nav-cta) { color: #0f1a17 !important; }
.wg-kb-v2.is-kb-article .site-header .logo-wm-w,
.wg-kb-v2.is-kb-article .site-header .logo-wm-w path { color: var(--kb-green) !important; stroke: currentColor !important; }
.wg-kb-v2.is-kb-article .site-header .nav-login {
  color: #0f1a17 !important;
  border-color: rgba(15,26,23,.2) !important;
  background: transparent !important;
}
.wg-kb-v2.is-kb-article .site-header .mobile-menu__trigger,
.wg-kb-v2.is-kb-article .site-header .mobile-portal-link { color: #063d2c !important; }
.wg-kb-v2.is-kb-article .site-header .hamburger span { background: #063d2c !important; }

/* ---------- Hub hero ---------- */
.wg-kb-v2 .kb-hub-hero {
  position: relative;
  isolation: isolate;
  display: flex;
  min-height: 660px;
  align-items: flex-end;
  overflow: hidden;
  padding: 190px 0 92px;
  border: 0;
  border-radius: 0 0 40px 40px;
  color: #fff;
  background-color: var(--kb-green-dark);
  background-position: center;
  background-size: cover;
}
.wg-kb-v2.is-knowledge-hub .kb-hub-hero {
  background-image: linear-gradient(90deg, rgba(3,30,22,.91) 0%, rgba(3,30,22,.72) 42%, rgba(3,30,22,.12) 76%), url("./images/generated/hero-marketing-v8.webp");
}
.wg-kb-v2.is-blog-hub .kb-hub-hero {
  background-image: linear-gradient(90deg, rgba(3,30,22,.88) 0%, rgba(3,30,22,.64) 43%, rgba(3,30,22,.1) 76%), url("./images/generated/hero-ondernemer-v2.webp");
}
.wg-kb-v2 .kb-hub-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: auto -5vw -29vw auto;
  width: 48vw;
  height: 48vw;
  min-width: 530px;
  min-height: 530px;
  border: clamp(62px, 7vw, 108px) solid rgba(49,196,141,.46);
  border-radius: 42% 58% 58% 42%;
  transform: rotate(-20deg);
}
.wg-kb-v2 .kb-hub-hero .container {
  width: var(--kb-page);
  max-width: 1248px;
  margin: 0 auto;
  padding: 0;
}
.wg-kb-v2 .kb-hub-hero .breadcrumb { margin: 0 0 26px; color: rgba(255,255,255,.7); }
.wg-kb-v2 .kb-hub-hero .breadcrumb a,
.wg-kb-v2 .kb-hub-hero .breadcrumb span[aria-current] { color: inherit; }
.kb-hub-kicker {
  display: inline-flex;
  margin-bottom: 18px;
  padding: 7px 11px;
  border: 1px solid rgba(255,255,255,.32);
  border-radius: 999px;
  background: rgba(255,255,255,.1);
  font-size: 13px;
  font-weight: 700;
  backdrop-filter: blur(8px);
}
.wg-kb-v2 .kb-hub-h1 {
  max-width: 760px;
  margin: 0 0 22px;
  color: #fff;
  font-size: clamp(3.75rem, 6.2vw, 5.75rem);
  font-weight: 700;
  letter-spacing: -.055em;
  line-height: .98;
}
.wg-kb-v2 .kb-hub-intro {
  max-width: 650px;
  margin: 0;
  color: rgba(255,255,255,.84);
  font-size: clamp(1.05rem, 1.5vw, 1.25rem);
  line-height: 1.55;
}
.wg-kb-v2 .kb-hub-intro a { color: #fff; text-underline-offset: 3px; }
.wg-kb-v2 .kb-pillars {
  display: flex;
  max-width: 920px;
  margin: 36px 0 0;
  gap: 10px;
}
.wg-kb-v2 .kb-pillar {
  flex: 1 1 0;
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 18px;
  color: #fff;
  background: rgba(4,31,23,.45);
  backdrop-filter: blur(10px);
}
.wg-kb-v2 .kb-pillar:hover { transform: translateY(-3px); border-color: rgba(255,255,255,.46); box-shadow: none; }
.wg-kb-v2 .kb-pillar strong { color: #fff; }
.wg-kb-v2 .kb-pillar > span { color: rgba(255,255,255,.7); }
.wg-kb-v2 .kb-pillar .arrow-cta { color: #fff; }

/* ---------- Hub cards ---------- */
.wg-kb-v2 .kb-list-section {
  position: relative;
  z-index: 2;
  width: min(1320px, calc(100vw - 32px));
  margin: -30px auto 96px;
  padding: 82px 0 76px;
  border: 1px solid rgba(9,35,26,.06);
  border-radius: 36px;
  background: #f7f6f2;
}
.wg-kb-v2 .kb-list-section > .container {
  width: min(1160px, calc(100% - 80px));
  max-width: none;
  margin: 0 auto;
  padding: 0;
}
.wg-kb-v2 .kb-list-section .section-header { max-width: 760px; margin: 0 0 32px; }
.wg-kb-v2 .kb-list-section .section-eyebrow { color: var(--kb-green); }
.wg-kb-v2 .kb-list-section .section-heading {
  margin: 10px 0 0;
  color: var(--kb-ink);
  font-size: clamp(2.25rem, 4vw, 3.5rem);
  line-height: 1.05 !important;
}
.wg-kb-v2 .kb-list-section .section-heading em { color: var(--kb-green); font-style: normal; }
.kb-filters { display: flex; flex-wrap: wrap; gap: 9px; margin: 0 0 32px; }
.kb-filter {
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid #d5ded9;
  border-radius: 999px;
  color: #395148;
  background: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 650;
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s, transform .2s;
}
.kb-filter:hover { border-color: #8ebca9; transform: translateY(-1px); }
.kb-filter.is-active { border-color: var(--kb-green-dark); color: #fff; background: var(--kb-green-dark); }
.wg-kb-v2 .kb-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px; }
.wg-kb-v2 .kb-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  padding: 0;
  border: 1px solid rgba(9,35,26,.09);
  border-radius: 26px;
  color: var(--kb-ink);
  background: #fff;
  box-shadow: 0 18px 45px -36px rgba(9,35,26,.42);
  transition: transform .28s cubic-bezier(.33,1,.68,1), box-shadow .28s, border-color .28s;
}
.wg-kb-v2 .kb-card:hover { transform: translateY(-5px); border-color: rgba(11,128,93,.3); box-shadow: 0 28px 55px -36px rgba(9,35,26,.48); }
.wg-kb-v2 .kb-card[hidden] { display: none; }
.wg-kb-v2 .kb-card .kb-image { aspect-ratio: 16 / 9; margin: 0; border-radius: 0; }
.wg-kb-v2 .kb-card .kb-body { display: flex; flex: 1; flex-direction: column; padding: 26px 28px 28px; }
.wg-kb-v2 .kb-card .kb-cat {
  align-self: flex-start;
  margin-bottom: 14px;
  padding: 6px 10px;
  border-radius: 999px;
  color: #0b6d50;
  background: var(--kb-mint);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .01em;
}
.wg-kb-v2 .kb-title { margin: 0 0 12px; color: var(--kb-ink); font-size: clamp(1.35rem, 2vw, 1.7rem); line-height: 1.2 !important; }
.wg-kb-v2 .kb-desc { margin: 0 0 24px; color: var(--kb-muted); font-size: 15px; line-height: 1.62; }
.wg-kb-v2 .kb-card .kb-meta { margin-top: auto; }
.wg-kb-v2 .kb-card--featured { grid-column: 1 / -1; display: grid; grid-template-columns: 1.18fr 1fr; }
.wg-kb-v2 .kb-card--featured .kb-image { height: 100%; aspect-ratio: auto; min-height: 420px; }
.wg-kb-v2 .kb-card--featured .kb-body { justify-content: center; padding: clamp(34px, 5vw, 62px); }
.wg-kb-v2 .kb-card--featured .kb-title { font-size: clamp(2rem, 3.3vw, 3rem); line-height: 1.08 !important; }

/* ---------- Article opening ---------- */
.wg-kb-v2 .article-hero {
  padding: 190px 0 56px;
  border: 0;
  background: #fff;
}
.wg-kb-v2 .article-hero .container { width: min(1060px, calc(100vw - 64px)); max-width: none; padding: 0; }
.wg-kb-v2 .article-hero .breadcrumb { margin-bottom: 46px; }
.wg-kb-v2 .article-cat {
  display: inline-flex;
  margin-bottom: 18px;
  padding: 7px 11px;
  border-radius: 999px;
  color: #0b6d50;
  background: var(--kb-mint);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
}
.wg-kb-v2 .article-h1 {
  max-width: 1000px;
  margin: 0 0 24px;
  color: var(--kb-ink);
  font-size: clamp(3rem, 5.35vw, 4.5rem);
  font-weight: 700;
  letter-spacing: -.052em !important;
  line-height: 1.01 !important;
}
.wg-kb-v2 .article-dek { max-width: 760px; margin: 0; color: #4b6058; font-size: clamp(1.15rem, 1.8vw, 1.42rem); line-height: 1.5; }
.wg-kb-v2 .article-meta { gap: 0; margin-top: 34px; color: #6d7c77; font-size: 14px; }
.wg-kb-v2 .article-meta > span { display: inline-flex; align-items: center; }
.wg-kb-v2 .article-meta > span + span::before { content: ""; width: 4px; height: 4px; margin: 0 13px; border-radius: 50%; background: #a5b2ad; }
.wg-kb-v2 .article-meta .am-dot { width: 36px; height: 36px; margin-right: 3px; color: #fff; background: linear-gradient(135deg,#075c43,#31a97c); }
.wg-kb-v2 .article-figure { width: var(--kb-page); max-width: 1248px; margin: 0 auto; padding: 0; }
.wg-kb-v2 .article-figure img { aspect-ratio: 16 / 8.5; border-radius: 32px; box-shadow: 0 30px 70px -52px rgba(9,35,26,.55); }

/* ---------- AI summary ---------- */
.ai-summary {
  max-width: 860px;
  margin-top: 42px;
  padding: 22px 24px 24px;
  border: 1px solid #dbe6e1;
  border-radius: 24px;
  background: linear-gradient(135deg, #f7fbf9, #edf6f2);
}
.ai-summary > summary { list-style: none; }
.ai-summary > summary::-webkit-details-marker { display: none; }
.ai-summary__toggle { display: flex; align-items: center; justify-content: space-between; gap: 20px; cursor: pointer; }
.ai-summary__toggle strong { display: block; color: var(--kb-ink); font-size: 20px; line-height: 1.2; letter-spacing: -.02em; }
.ai-summary__choice { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 8px; color: var(--kb-green); font-size: 13px; font-weight: 700; }
.ai-summary__choice i { display: inline-flex; width: 24px; height: 24px; align-items: center; justify-content: center; border-radius: 50%; color: #fff; background: var(--kb-green); font-size: 17px; font-style: normal; transition: transform .2s; }
.ai-summary[open] .ai-summary__choice i { transform: rotate(45deg); }
.ai-summary__content { margin-top: 16px; }
.ai-summary__intro { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.ai-summary__eyebrow { display: block; margin-bottom: 5px; color: var(--kb-green); font-size: 12px; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; }
.ai-summary h2 { margin: 0; color: var(--kb-ink); font-size: 20px; font-weight: 700; letter-spacing: -.02em; }
.ai-summary__note { max-width: 310px; margin: 0; color: #61726c; font-size: 12px; line-height: 1.45; }
.ai-summary__services { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 9px; margin-top: 18px; }
.ai-service {
  display: flex;
  min-width: 0;
  min-height: 48px;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border: 1px solid rgba(9,35,26,.1);
  border-radius: 13px;
  color: #18342a;
  background: rgba(255,255,255,.86);
  font-size: 13px;
  font-weight: 650;
  text-decoration: none;
  transition: transform .18s, background .18s, border-color .18s;
}
.ai-service:hover { transform: translateY(-2px); border-color: rgba(11,128,93,.35); background: #fff; }
.ai-service img { width: 25px; height: 25px; object-fit: contain; }
.article-mobile-meta { display: none; }
.article-toc-mobile { display: none; }

/* ---------- Reading area ---------- */
.wg-kb-v2 .article-wrap {
  display: grid;
  grid-template-columns: 260px minmax(0, var(--kb-reading));
  justify-content: center;
  gap: 68px;
  width: min(1120px, calc(100vw - 64px));
  max-width: none;
  margin: 0 auto;
  padding: 84px 0 0;
}
.wg-kb-v2 .article-toc {
  position: sticky;
  top: 110px;
  align-self: start;
  max-height: calc(100vh - 140px);
  overflow: auto;
  margin: 0;
  padding: 22px;
  border: 1px solid var(--kb-line);
  border-radius: 20px;
  background: #f8faf9;
}
.wg-kb-v2 .article-toc strong { color: #53665f; }
.wg-kb-v2 .article-toc ol { gap: 10px; }
.wg-kb-v2 .article-toc a { color: #4c6259; font-size: 14px; line-height: 1.45; }
.wg-kb-v2 .article-body { min-width: 0; color: #344941; font-size: 18px; line-height: 1.78; }
.wg-kb-v2 .article-body > p { margin-bottom: 1.45rem; }
.wg-kb-v2 .article-body h2 { margin: 3.4rem 0 1.2rem; color: var(--kb-ink); font-size: clamp(1.8rem, 3vw, 2.4rem); line-height: 1.13; }
.wg-kb-v2 .article-body h3 { margin-top: 2.2rem; color: var(--kb-ink); font-size: 1.35rem; }
.wg-kb-v2 .article-body a { color: #087856; text-decoration-color: rgba(8,120,86,.35); text-underline-offset: 3px; }
.wg-kb-v2 .article-callout { padding: 22px 24px; border-color: #e7dcc2; border-radius: 18px; color: #594d32; background: var(--kb-sand); }
.wg-kb-v2 .article-takeaways { padding: 28px 30px; border-radius: 22px; background: var(--kb-green-dark); }
.wg-kb-v2 .article-takeaways li { color: rgba(255,255,255,.78); }
.wg-kb-v2 .article-faq,
.wg-kb-v2 .author-box,
.wg-kb-v2 .article-cta-band { max-width: var(--kb-reading); margin-left: auto; margin-right: auto; }
.wg-kb-v2 .article-faq { padding: 0; }
.wg-kb-v2 .faq-item { border-color: var(--kb-line); border-radius: 16px; }
.wg-kb-v2 .author-box { border-color: var(--kb-line); border-radius: 22px; background: #f7faf8; }
.wg-kb-v2 .article-cta-inner { padding: clamp(30px,5vw,48px); border-radius: 26px; background: var(--kb-green-dark); }
.wg-kb-v2 .article-related { width: min(1160px, calc(100vw - 64px)); margin: 0 auto; padding-top: 96px; }
.wg-kb-v2 .article-related .kb-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
.wg-kb-v2 .article-related .kb-card--featured { grid-column: auto; display: flex; }
.wg-kb-v2 .article-related .kb-card--featured .kb-image { min-height: 0; aspect-ratio: 16/9; }
.wg-kb-v2 .article-related .kb-card--featured .kb-body { padding: 26px 28px 28px; }
.wg-kb-v2 .article-related .kb-card--featured .kb-title { font-size: clamp(1.35rem,2vw,1.7rem); }

@media (max-width: 1000px) {
  :root { --kb-page: min(1248px, calc(100vw - 40px)); }
  .wg-kb-v2 .article-wrap { grid-template-columns: minmax(0, var(--kb-reading)); gap: 0; }
  .wg-kb-v2 .article-toc { position: static; max-height: none; margin-bottom: 44px; }
  .wg-kb-v2 .article-related .kb-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ai-summary__services { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 760px) {
  :root { --kb-page: calc(100vw - 24px); }
  .wg-kb-v2 .kb-hub-hero {
    display: block;
    min-height: 0;
    padding: 118px 0 58px;
    border-radius: 0;
    color: var(--kb-ink);
    background: #f6f6f3 !important;
  }
  .wg-kb-v2 .kb-hub-hero::after {
    right: -250px;
    bottom: -280px;
    border-color: rgba(11,128,93,.08);
  }
  .wg-kb-v2 .kb-hub-hero .container { width: calc(100vw - 40px); }
  .wg-kb-v2 .kb-hub-hero .breadcrumb { margin-bottom: 34px; color: #68756f; }
  .wg-kb-v2 .kb-hub-hero .breadcrumb a,
  .wg-kb-v2 .kb-hub-hero .breadcrumb span[aria-current] { color: inherit; }
  .wg-kb-v2 .kb-hub-kicker { margin-bottom: 16px; border-color: #d5e4dd; color: #0b6d50; background: #e8f3ee; backdrop-filter: none; }
  .wg-kb-v2 .kb-hub-h1 { max-width: none; margin-bottom: 20px; color: var(--kb-ink); font-size: clamp(2.8rem, 13vw, 3.45rem); line-height: 1 !important; }
  .wg-kb-v2 .kb-hub-intro { color: #263a32; font-size: 1.08rem; line-height: 1.55; }
  .wg-kb-v2 .kb-hub-intro a { color: var(--kb-green); }
  .wg-kb-v2 .kb-pillars { display: none; }
  .wg-kb-v2 .kb-list-section { width: calc(100vw - 16px); margin: 0 auto 72px; padding: 54px 0 52px; border-radius: 26px; }
  .wg-kb-v2 .kb-list-section > .container { width: calc(100% - 32px); }
  .wg-kb-v2 .kb-list-section .section-header { margin-bottom: 26px; }
  .wg-kb-v2 .kb-list-section .section-heading { font-size: clamp(2.05rem, 9.5vw, 2.5rem); line-height: 1.08 !important; }
  .wg-kb-v2 .kb-grid,
  .wg-kb-v2 .article-related .kb-grid { grid-template-columns: 1fr; }
  .wg-kb-v2 .kb-card--featured { grid-column: auto; display: flex; }
  .wg-kb-v2 .kb-card--featured .kb-image { min-height: 0; aspect-ratio: 16/9; }
  .wg-kb-v2 .kb-card--featured .kb-body { padding: 26px 24px 28px; }
  .wg-kb-v2 .kb-card--featured .kb-title { font-size: 1.7rem; line-height: 1.16 !important; }
  .wg-kb-v2 .kb-card:not(.kb-card--featured) {
    display: grid;
    grid-template-columns: 108px minmax(0,1fr);
    min-height: 188px;
  }
  .wg-kb-v2 .kb-card:not(.kb-card--featured) .kb-image { height: 100%; min-height: 188px; aspect-ratio: auto; }
  .wg-kb-v2 .kb-card:not(.kb-card--featured) .kb-body { padding: 17px 16px; }
  .wg-kb-v2 .kb-card:not(.kb-card--featured) .kb-cat { margin-bottom: 9px; padding: 5px 8px; font-size: 10px; }
  .wg-kb-v2 .kb-card:not(.kb-card--featured) .kb-title { margin-bottom: 12px; font-size: 1.08rem; line-height: 1.28 !important; }
  .wg-kb-v2 .kb-card:not(.kb-card--featured) .kb-desc { display: none; }
  .wg-kb-v2 .kb-card:not(.kb-card--featured) .kb-meta { align-items: flex-end; gap: 8px; font-size: 12px; }
  .wg-kb-v2 .kb-card:not(.kb-card--featured) .kb-read { font-size: 12px; }
  .kb-filters { flex-wrap: nowrap; overflow-x: auto; margin-right: -16px; padding-right: 16px; scrollbar-width: none; }
  .kb-filter { flex: 0 0 auto; }
  .wg-kb-v2.is-kb-article .article-page,
  .wg-kb-v2.is-kb-article .article-hero { background: #f7f7f4; }
  .wg-kb-v2 .article-hero { padding: 112px 0 34px; }
  .wg-kb-v2 .article-hero .container { width: calc(100vw - 40px); }
  .wg-kb-v2 .article-hero .breadcrumb {
    display: flex;
    flex-wrap: nowrap;
    overflow: hidden;
    margin-bottom: 42px;
    white-space: nowrap;
  }
  .wg-kb-v2 .article-hero .breadcrumb > a:first-child,
  .wg-kb-v2 .article-hero .breadcrumb > a:first-child + .sep { display: none; }
  .wg-kb-v2 .article-hero .breadcrumb span[aria-current] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .wg-kb-v2 .article-cat,
  .wg-kb-v2 .article-meta { display: none; }
  .article-mobile-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-bottom: 26px; color: #52635d; font-size: 13px; }
  .article-mobile-meta > span:not(.article-mobile-meta__category) { display: inline-flex; align-items: center; gap: 6px; }
  .article-mobile-meta > span:not(.article-mobile-meta__category)::before { content: ""; width: 14px; height: 14px; flex: 0 0 14px; opacity: .78; background-repeat: no-repeat; background-position: center; background-size: contain; }
  .article-mobile-meta__date::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2352635d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 10h18'/%3E%3C/svg%3E"); }
  .article-mobile-meta__read::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2352635d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); }
  .article-mobile-meta__category { padding: 7px 11px; border-radius: 999px; color: #087856; background: #e7f2ed; font-weight: 700; }
  .wg-kb-v2 .article-h1 { margin-bottom: 24px; font-size: clamp(2.1rem, 9.5vw, 2.45rem); letter-spacing: -.04em !important; line-height: 1.06 !important; }
  .wg-kb-v2 .article-dek { color: #243a31; font-size: 1.1rem; line-height: 1.58; }
  .wg-kb-v2 .article-figure { width: calc(100vw - 40px); background: #f7f7f4; }
  .wg-kb-v2 .article-figure img { aspect-ratio: 16/10; border-radius: 20px; }
  .ai-summary { width: calc(100vw - 40px); margin: 18px auto 0; padding: 0; border-radius: 17px; background: #fff; }
  .ai-summary__toggle { padding: 15px 16px; }
  .ai-summary__toggle strong { font-size: 16px; }
  .ai-summary__choice { font-size: 11px; }
  .ai-summary__content { margin: 0; padding: 0 14px 14px; }
  .ai-summary__note { max-width: none; margin: 0 2px 12px; }
  .ai-summary__services { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ai-service { min-height: 44px; padding: 8px 10px; }
  .ai-service img { width: 22px; height: 22px; }
  .wg-kb-v2 .article-wrap { width: calc(100vw - 40px); padding-top: 42px; }
  .wg-kb-v2 .article-body { color: #1f312a; font-size: 17.5px; line-height: 1.7; }
  .wg-kb-v2 .article-body h2 { margin-top: 2.8rem; font-size: 1.85rem; }
  .wg-kb-v2 .article-toc { display: none; }
  .article-toc-mobile { display: block; margin: 0 0 30px; border: 1px solid var(--kb-line); border-radius: 17px; background: #fff; }
  .article-toc-mobile > summary { display: flex; min-height: 58px; align-items: center; justify-content: space-between; gap: 16px; padding: 0 16px; list-style: none; color: var(--kb-ink); cursor: pointer; }
  .article-toc-mobile > summary::-webkit-details-marker { display: none; }
  .article-toc-mobile > summary > span { font-size: 15px; font-weight: 700; }
  .article-toc-mobile > summary small { display: inline-flex; align-items: center; gap: 8px; color: var(--kb-green); font-size: 11px; font-weight: 700; }
  .article-toc-mobile > summary i { display: inline-flex; width: 22px; height: 22px; align-items: center; justify-content: center; border-radius: 50%; color: #fff; background: var(--kb-green); font-size: 16px; font-style: normal; transition: transform .2s; }
  .article-toc-mobile[open] > summary i { transform: rotate(45deg); }
  .article-toc-mobile ol { margin: 0; padding: 0 34px 18px; list-style: decimal; }
  .article-toc-mobile li + li { margin-top: 9px; }
  .article-toc-mobile a { color: #4c6259; font-size: 13px; line-height: 1.45; text-decoration: none; }
  .wg-kb-v2 .article-faq,
  .wg-kb-v2 .author-box,
  .wg-kb-v2 .article-cta-band { width: calc(100vw - 40px); }
  .wg-kb-v2 .article-related { width: calc(100vw - 40px); padding-top: 72px; }
}

@media (max-width: 340px) {
  .wg-kb-v2 .article-meta > span { width: 100%; }
  .wg-kb-v2 .article-meta > span + span::before { display: none; }
  .ai-summary__services { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .wg-kb-v2 .kb-card,
  .wg-kb-v2 .kb-card img,
  .ai-service { transition: none !important; }
}