/* VacuumSealers Knowledge Modules (scoped) */

/* ---------- WHY ACCORDION MODULE ---------- */
.kb-why-wrap { margin: 18px 0; }
.kb-why-card{
  border:1px solid #e5e7eb;
  border-radius:18px;
  background:#fff;
  padding:22px;
  box-shadow:0 16px 40px rgba(2,6,23,.06);
}
.kb-why-title{ margin:0 0 12px; font-size:26px; }
.kb-why-grid{ display:flex; gap:18px; align-items:stretch; }
.kb-why-left{ flex:1 1 auto; min-width:0; }
.kb-why-right{ flex:0 0 260px; display:flex; align-items:center; justify-content:center; }
.kb-why-btn{
  width:100%;
  text-align:center;
  display:inline-block;
  background:#4ade80;
  color:#0f172a;
  border-radius:12px;
  padding:14px 16px;
  font-weight:700;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 10px 24px rgba(2,6,23,.10);
  text-decoration:none;
}
.kb-why-btn:hover{ filter:brightness(.98); }

.kb-acc{
  border:1px solid #e5e7eb;
  border-radius:14px;
  background:#f8fafc;
  margin:10px 0;
  overflow:hidden;
}
.kb-acc summary{
  list-style:none;
  cursor:pointer;
  padding:14px 14px;
  font-weight:600;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.kb-acc summary::-webkit-details-marker{ display:none; }
.kb-acc summary::after{ content:"▾"; color:#64748b; font-weight:800; }
.kb-acc[open] summary::after{ content:"▴"; }
.kb-acc-body{ padding:0 14px 14px; }
.kb-acc-body p{ margin:0; color:#475569; line-height:1.55; }

.kb-why-note{ margin:10px 2px 0; }
.kb-why-note a{ color:#2563eb; text-decoration:none; }
.kb-why-note a:hover{ text-decoration:underline; }
.kb-why-footer{ margin:16px 0 0; text-align:center; color:#64748b; }
.kb-why-footer a{ color:#2563eb; text-decoration:none; }
.kb-why-footer a:hover{ text-decoration:underline; }

.kb-why--soft .kb-why-card{ box-shadow:0 18px 48px rgba(2,6,23,.07); }
.kb-why--compact .kb-why-card{ padding:18px; }
.kb-why--compact .kb-why-right{ flex-basis:220px; }

@media (max-width: 980px){
  .kb-why-grid{ flex-direction:column; }
  .kb-why-right{ flex: 1 1 auto; }
}

/* ---------- SUBHUB CARDS MODULE ---------- */
.kb-subhub-cards{ margin:18px 0; }
.kb-subhub-grid{ display:grid; gap:16px; }
.kb-subhub-cards[data-kb-cols="4"] .kb-subhub-grid{ grid-template-columns:repeat(4, minmax(0, 1fr)); }
.kb-subhub-cards[data-kb-cols="3"] .kb-subhub-grid{ grid-template-columns:repeat(3, minmax(0, 1fr)); }

.kb-subhub-card{
  border:1px solid #e5e7eb;
  border-radius:16px;
  background:#fff;
  padding:16px;
  box-shadow:0 12px 30px rgba(2,6,23,.06);
  display:flex;
  flex-direction:column;
  min-height:220px;
}
.kb-subhub-head{ display:flex; gap:10px; align-items:center; margin-bottom:8px; }
.kb-subhub-ico{
  width:38px; height:38px; border-radius:12px;
  background:rgba(37,99,235,.10);
  display:flex; align-items:center; justify-content:center;
  font-size:18px;
}
.kb-subhub-title{ margin:0; font-size:18px; }
.kb-subhub-title a{ color:#0f172a; text-decoration:none; }
.kb-subhub-title a:hover{ text-decoration:underline; }
.kb-subhub-text{ margin:8px 0 10px; color:#64748b; font-size:14px; line-height:1.55; }
.kb-subhub-links{ margin:0; padding-left:18px; color:#64748b; font-size:14px; }
.kb-subhub-links li{ margin:6px 0; }
.kb-subhub-links a{ color:#2563eb; text-decoration:none; }
.kb-subhub-links a:hover{ text-decoration:underline; }
.kb-subhub-btn{ margin-top:auto; padding-top:10px; color:#2563eb; font-weight:700; text-decoration:none; }
.kb-subhub-btn:hover{ text-decoration:underline; }

@media (max-width: 980px){
  .kb-subhub-cards[data-kb-cols="4"] .kb-subhub-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px){
  .kb-subhub-grid{ grid-template-columns:1fr !important; }
}

/* ---------- HANDIGE GIDSEN MODULE ---------- */
.kb-guides{ margin:18px 0; border:1px solid #e5e7eb; border-radius:16px; background:#fff; padding:18px; box-shadow:0 12px 30px rgba(2,6,23,.05); }
.kb-guideshead{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.kb-guides-title{ margin:0; font-size:18px; }
.kb-guideslinks{ display:flex; align-items:center; justify-content:flex-end; gap:8px; flex-wrap:wrap; text-align:right; }
.kb-guides-sep{ color:#94a3b8; font-weight:600; }
.kb-guides-all{ color:#2563eb; font-weight:700; text-decoration:none; }
.kb-guides-all:hover{ text-decoration:underline; }
.kb-guidesgrid{ display:grid; gap:14px; }
.kb-guides[data-kb-cols="4"] .kb-guidesgrid{ grid-template-columns:repeat(4, minmax(0, 1fr)); }
.kb-guides[data-kb-cols="3"] .kb-guidesgrid{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
.kb-guides[data-kb-cols="2"] .kb-guidesgrid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
.kb-guides[data-kb-cols="1"] .kb-guidesgrid{ grid-template-columns:1fr; }

.kb-guidecard{ border:1px solid #e5e7eb; border-radius:14px; overflow:hidden; background:#fff; box-shadow:0 10px 26px rgba(2,6,23,.05); display:flex; flex-direction:column; }
.kb-guideimg img{ width:100%; height:120px; object-fit:cover; display:block; background:#f1f5f9; }
.kb-guideimg--ph{ width:100%; height:120px; background:#f1f5f9; }
.kb-guidebody{ padding:12px; display:flex; flex-direction:column; gap:8px; }
.kb-guidetitle{ margin:0; font-size:15px; line-height:1.25; }
.kb-guidetitle a{ color:#0f172a; text-decoration:none; }
.kb-guidetitle a:hover{ text-decoration:underline; }
.kb-guidebullets{ margin:0; padding-left:18px; color:#64748b; font-size:13px; }
.kb-guidebullets li{ margin:5px 0; }
.kb-guidecta{ margin-top:auto; color:#2563eb; font-weight:700; text-decoration:none; }
.kb-guidecta:hover{ text-decoration:underline; }

@media (max-width:980px){ .kb-guides[data-kb-cols="4"] .kb-guidesgrid{ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:620px){ .kb-guidesgrid{ grid-template-columns:1fr !important; } }

/* ---------- VERTOUWEN & TRANSPARANTIE (HOMEPAGE) ---------- */
.kb-trust{ margin:18px 0; }
.kb-trust-card{
  border:1px solid #e5e7eb;
  border-radius:16px;
  background:#fff;
  padding:18px;
  box-shadow:0 12px 30px rgba(2,6,23,.05);
}
.kb-trust-title{ margin:0 0 10px; font-size:20px; }
.kb-trust-list{ margin:0; padding-left:18px; color:#475569; line-height:1.6; }
.kb-trust-list li{ margin:8px 0; }
.kb-trust-ctas{ margin-top:12px; display:flex; flex-wrap:wrap; gap:10px; }
.kb-trust-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid #e5e7eb;
  background:#fff;
  color:#0f172a;
  font-weight:800;
  text-decoration:none;
}
.kb-trust-btn--primary{
background: #f1f5f9; /* Lichtgrijs/blauw */
  border-color: #cbd5e1; /* Iets donkerdere rand voor definitie */
  color: #0f172a; /* Donkere tekst voor leesbaarheid */
}
.kb-trust-btn:hover{ text-decoration:underline; }
.kb-trust-btn--primary:hover{
  background: #e2e8f0; /* Iets donkerder bij hover */
}

.kb-trust--soft .kb-trust-card{ background:#f8fafc; }

/* ---------- A–Z MODULE ---------- */
.kb-az{ margin:18px 0; }
.kb-az-head{ border:1px solid #e5e7eb; border-radius:16px; padding:16px; background:#fff; box-shadow:0 12px 30px rgba(2,6,23,.05); }
.kb-az-title{ margin:0 0 10px; font-size:22px; }
.kb-az-nav{ display:flex; flex-wrap:wrap; gap:10px; }
.kb-az-nav a{ color:#2563eb; font-weight:700; text-decoration:none; padding:6px 10px; border:1px solid #e5e7eb; border-radius:999px; background:#fff; }
.kb-az-nav a:hover{ text-decoration:underline; }
.kb-az-groups{ margin-top:14px; display:grid; gap:14px; }
.kb-az-group{ border:1px solid #e5e7eb; border-radius:16px; padding:14px; background:#fff; }
.kb-az-letter{ margin:0 0 8px; font-size:18px; }
.kb-az-list{ margin:0; padding-left:18px; }
.kb-az-list li{ margin:6px 0; }
.kb-az-list a{ color:#0f172a; text-decoration:none; }
.kb-az-list a:hover{ color:#2563eb; text-decoration:underline; }

/* ---------- SUBHUB TEMPLATE ---------- */
.kb-subhub{ margin:18px 0; }
.kb-subhub-hero{ border:1px solid #e5e7eb; border-radius:18px; background:#fff; padding:22px; box-shadow:0 16px 40px rgba(2,6,23,.06); display:flex; gap:18px; align-items:flex-start; justify-content:space-between; flex-wrap:wrap; }
.kb-subhub-h1{ margin:0; font-size:34px; line-height:1.1; }
.kb-subhub-updated{ margin-top:6px; color:#64748b; font-size:13px; }
.kb-subhub-intro{ margin:12px 0 0; color:#475569; line-height:1.6; max-width:780px; }
.kb-subhub-cta{ display:inline-block; background:#0f172a; color:#fff; padding:12px 14px; border-radius:12px; text-decoration:none; font-weight:800; }
.kb-subhub-cta:hover{ filter:brightness(.98); }

.kb-subhub-sections{ margin-top:14px; }
.kb-subhub-grid2{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; margin-bottom:14px; }
.kb-subhub-box{ border:1px solid #e5e7eb; border-radius:16px; padding:16px; background:#fff; box-shadow:0 12px 30px rgba(2,6,23,.05); }
.kb-subhub-box h2{ margin:0 0 10px; font-size:18px; }
.kb-subhub-box ul{ margin:0; padding-left:18px; }
.kb-subhub-box li{ margin:6px 0; }
.kb-subhub-box a{ color:#0f172a; text-decoration:none; }
.kb-subhub-box a:hover{ color:#2563eb; text-decoration:underline; }
.kb-subhub-muted{ margin:0; color:#64748b; }

.kb-subhub-subtopics{ display:grid; gap:12px; }
.kb-subhub-subtopic h3{ margin:0 0 6px; font-size:15px; }

.kb-subhub-related-grid{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:12px; }
.kb-subhub-related-card{ border:1px solid #e5e7eb; border-radius:14px; padding:12px; background:#fff; text-decoration:none; box-shadow:0 10px 24px rgba(2,6,23,.05); }
.kb-subhub-related-card:hover{ border-color:#cbd5e1; }
.kb-subhub-related-title{ color:#0f172a; font-weight:800; }

@media (max-width:980px){
  .kb-subhub-grid2{ grid-template-columns:1fr; }
  .kb-subhub-related-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width:620px){
  .kb-subhub-related-grid{ grid-template-columns:1fr; }
}
