/* Trust-page components: info box, stamp. Shared across About + policy pages. */
.trust-box{
  background:var(--c-bg-alt);
  border:1px solid var(--c-border);
  border-radius:var(--radius-lg);
  padding:var(--s-5);
  margin:var(--s-5) 0;
}
.trust-box-head{
  display:flex;justify-content:space-between;align-items:center;gap:var(--s-3);
  flex-wrap:wrap;margin-bottom:var(--s-4);
  padding-bottom:var(--s-3);border-bottom:1px solid var(--c-border);
}
.trust-box-name{
  font-family:var(--f-display);font-size:1.15rem;font-weight:700;color:var(--c-primary-dark);
}
.trust-box-badge{
  font-size:.78rem;font-weight:600;color:var(--c-primary);
  background:var(--c-surface);border:1px solid var(--c-border);
  padding:5px 12px;border-radius:20px;
}
.trust-box-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s-4);
}
.trust-item{display:flex;flex-direction:column;gap:4px}
.trust-label{
  font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--c-text-muted);font-weight:700;
  display:inline-flex;align-items:center;gap:6px;
}
.trust-label .ic{width:14px;height:14px;color:var(--c-primary);flex:none}
.trust-value{font-size:.92rem;color:var(--c-text-primary);line-height:1.5}
.trust-stamp{
  font-size:.82rem;color:var(--c-text-muted);line-height:1.7;
  border-top:1px solid var(--c-border);padding-top:var(--s-3);margin-top:var(--s-5);
}
.trust-stamp-label{font-weight:700;color:var(--c-text-soft)}
@media (max-width:560px){
  .trust-box-grid{grid-template-columns:1fr}
}

/* Checklist (used on Kontak "sebelum menghubungi") */
.check-list{list-style:none;padding-left:0;margin:var(--s-3) 0}
.check-list li{
  position:relative;padding-left:1.8em;margin-bottom:.5em;line-height:1.6;
}
.check-list li::before{
  content:"";position:absolute;left:0;top:.15em;
  width:1.15em;height:1.15em;border-radius:50%;
  background:var(--c-primary);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/0.8em no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/0.8em no-repeat;
}
.tool-box h2 .ic{vertical-align:-4px;color:var(--c-primary);margin-right:6px}
.tool-box .muted .ic{vertical-align:-3px;color:var(--c-primary)}

/* Callout box (privacy highlight, key notes) */
.callout{
  border-radius:var(--radius-lg);padding:var(--s-4) var(--s-5);
  margin:var(--s-4) 0;border:1px solid var(--c-border);background:var(--c-bg-alt);
}
.callout-good{
  border-color:#cfe6d8;background:#eef6f0;
}
.callout-title{
  display:flex;align-items:center;gap:8px;font-weight:700;
  color:var(--c-primary-dark);margin-bottom:6px;
}
.callout-good .callout-title{color:#2c5c42}
.callout-good .callout-title .ic{color:#2f7d4f;flex:none}
.callout p{margin:0;font-size:.92rem;line-height:1.7;color:var(--c-text-soft)}

/* Warning callout (yellow) */
.callout-warn{border-color:#efc98a;background:#fbeecb;border-left:4px solid #d68a1a}
.callout-warn .callout-title{color:#8a5d0f}
.callout-warn .callout-title .ic{color:#d68a1a;flex:none}

/* Table of contents box */
.toc-box{
  background:var(--c-bg-alt);border:1px solid var(--c-border);
  border-radius:var(--radius-lg);padding:var(--s-4) var(--s-5);margin:var(--s-5) 0;
}
.toc-box-title{
  font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--c-text-muted);font-weight:700;margin-bottom:var(--s-3);
}
.toc-list{margin:0;padding-left:1.4em;columns:2;column-gap:var(--s-5)}
.toc-list li{margin-bottom:.4em;break-inside:avoid}
.toc-list a{color:var(--c-primary);text-decoration:none}
.toc-list a:hover{text-decoration:underline}
@media (max-width:560px){ .toc-list{columns:1} }

/* Source cards (references page) */
.src-cards{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-3);margin:var(--s-4) 0}
.src-card{
  background:var(--c-surface);border:1px solid var(--c-border);
  border-left:3px solid var(--c-primary);border-radius:var(--radius);padding:var(--s-4);
}
.src-card-name{
  display:flex;align-items:center;gap:7px;font-weight:700;color:var(--c-primary-dark);
  margin-bottom:var(--s-3);font-size:.98rem;
}
.src-card-name .ic{color:var(--c-primary);flex:none}
.src-row{display:flex;gap:var(--s-2);padding:3px 0;font-size:.85rem;line-height:1.5}
.src-k{
  flex:none;width:78px;color:var(--c-text-muted);font-weight:600;
  font-size:.7rem;letter-spacing:.04em;text-transform:uppercase;padding-top:2px;
}
.src-v{color:var(--c-text-primary)}
@media (max-width:560px){ .src-cards{grid-template-columns:1fr} }

/* Info callout (blue — methodology principles) */
.callout-info{border-color:#bcd6ec;background:#eef4fa;border-left:4px solid #3f7cb8}
.callout-info .callout-title{color:#2a5a86}
.callout-info .callout-title .ic{color:#3f7cb8;flex:none}

/* Methodology: process flow + weton equation chips */
.mtd-flow{
  display:flex;align-items:center;flex-wrap:wrap;gap:8px;
  background:var(--c-bg-alt);border:1px solid var(--c-border);
  border-radius:var(--radius-lg);padding:var(--s-4);margin:var(--s-3) 0 var(--s-4);
}
.mtd-flow-step{
  background:var(--c-surface);border:1px solid var(--c-border);
  border-radius:20px;padding:6px 14px;font-size:.82rem;font-weight:600;color:var(--c-primary-dark);
}
.mtd-flow-arr{display:flex;color:var(--c-text-muted)}
.mtd-flow-arr .ic{width:16px;height:16px}
.mtd-eq{
  display:flex;align-items:center;justify-content:center;gap:var(--s-3);flex-wrap:wrap;
  margin:var(--s-4) 0;
}
.mtd-chip{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-width:78px;padding:12px 16px;border-radius:var(--radius-lg);
  background:var(--c-surface);border:1px solid var(--c-border);
}
.mtd-chip-hl{background:var(--c-primary);border-color:var(--c-primary)}
.mtd-chip-n{font-family:var(--f-display);font-size:1.6rem;font-weight:700;color:var(--c-primary-dark);line-height:1}
.mtd-chip-hl .mtd-chip-n{color:#fff}
.mtd-chip-l{font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;color:var(--c-text-muted);margin-top:4px}
.mtd-chip-hl .mtd-chip-l{color:#f0e3d2}
.mtd-op{font-family:var(--f-display);font-size:1.5rem;font-weight:700;color:var(--c-text-muted)}
@media (max-width:560px){ .mtd-flow{justify-content:center} }