/* Halaman Tentang Bisnis, Fitur, Monetisasi.
   Memakai variabel dan komponen tema yang sudah ada (.section, .sec-head, .feat, .calc, .btn, .chip).
   Semua kelas baru berawalan wmb- dan hanya dimuat di tiga halaman ini. */

.wmb-switch,.wmb-toc{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1.25rem}
.wmb-switch a.chip,.wmb-toc a.chip{text-decoration:none}
.wmb-toc{margin-top:.75rem}
.wmb-toc a.chip{font-size:.9rem;padding:.4rem .9rem}

/* Label status */
.wmb-tag{display:inline-block;flex:none;padding:.18rem .7rem;border-radius:999px;font:600 .78rem/1.5 var(--body);letter-spacing:.01em;white-space:nowrap}
.wmb-tag.is-aktif{background:var(--espresso);color:var(--cream)}
.wmb-tag.is-perlu{background:var(--amber-2);color:var(--espresso)}
.wmb-tag.is-rencana{border:1.5px dashed var(--espresso);color:var(--espresso)}
.wmb-top{display:flex;justify-content:space-between;align-items:flex-start;gap:.6rem;margin-bottom:.9rem}
.wmb-legend{display:flex;gap:.6rem 1.25rem;flex-wrap:wrap;align-items:center;margin-top:1rem;font-size:.92rem;color:var(--muted)}
.wmb-legend span.i{display:inline-flex;align-items:center;gap:.45rem}

/* Teks & tata letak */
.wmb-two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3rem);align-items:start}
.wmb-h{margin:clamp(2rem,4vw,3rem) 0 1rem;font-size:clamp(1.3rem,2.4vw,1.7rem)}
.wmb-lead{color:var(--muted);max-width:68ch}
.wmb-note{border-left:4px solid var(--amber-2);background:var(--card);padding:1rem 1.25rem;border-radius:0 16px 16px 0;color:var(--muted);margin:1.5rem 0 0}
.wmb-note strong{color:var(--espresso)}
.wmb-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:1rem}
.wmb-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.3rem}
.wmb-card h3{margin-bottom:.4rem}
.wmb-card p{margin:0;color:var(--muted);font-size:.98rem}
.wmb-card .sol{margin-top:.8rem;padding-top:.8rem;border-top:1px solid var(--line);color:var(--espresso)}
.wmb-card .sol b{color:var(--amber)}
.feat .wmb-more{margin-top:.8rem;padding-top:.8rem;border-top:1px solid var(--line);font-size:.93rem}
.feat:hover .wmb-more{border-color:rgba(255,255,255,.2)}
.wmb-list{margin:0;padding:0;list-style:none;display:grid;gap:.6rem}
.wmb-list li{position:relative;padding-left:1.4rem}
.wmb-list li::before{content:"";position:absolute;left:0;top:.62em;width:.5rem;height:.5rem;transform:rotate(45deg);background:var(--amber-2)}
.wmb-vm{background:var(--espresso);color:var(--cream);border-radius:var(--r);padding:1.5rem}
.wmb-vm h3{color:#fff}
.wmb-vm p{margin:0;color:#e4d7c3}

/* Tabel */
.wmb-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.wmb-table{width:100%;border-collapse:collapse;min-width:620px;font-size:.98rem}
.wmb-table th,.wmb-table td{text-align:left;padding:.85rem 1rem;border-bottom:1px solid var(--line);vertical-align:top}
.wmb-table thead th{background:var(--cream-2);font:600 .9rem var(--body);color:var(--espresso)}
.wmb-table tbody tr:last-child td{border-bottom:0}
.wmb-table tbody td:first-child{font-weight:600;white-space:nowrap}
.wmb-table.is-wrap tbody td:first-child{white-space:normal}
.wmb-table td:last-child .wmb-tag{margin:0}

/* Arsitektur */
.wmb-arch{display:grid;gap:.75rem}
.wmb-layer{position:relative;display:grid;grid-template-columns:190px 1fr;gap:1rem;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:1rem 1.2rem}
.wmb-layer:not(:first-child)::before{content:"";position:absolute;top:-.76rem;left:2.2rem;height:.76rem;border-left:2px solid var(--espresso)}
.wmb-layer h3{margin:0;font-size:1.05rem}
.wmb-layer h3 small{display:block;margin-top:.1rem;font:400 .85rem var(--body);color:var(--muted)}
.wmb-layer.is-ext{background:transparent;border-style:dashed}
.wmb-chips{display:flex;flex-wrap:wrap;gap:.4rem}
.wmb-chips span{padding:.3rem .85rem;border-radius:999px;background:var(--cream-2);font-size:.92rem;font-weight:500}
.wmb-ext-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-top:.75rem}
.wmb-ext-grid .wmb-card{border-style:dashed;background:transparent}
.wmb-flow{counter-reset:f;list-style:none;margin:0;padding:0;display:grid;gap:.9rem;max-width:760px}
.wmb-flow li{counter-increment:f;position:relative;padding-left:3.1rem;min-height:2.2rem}
.wmb-flow li::before{content:counter(f);position:absolute;left:0;top:0;width:2.2rem;height:2.2rem;border-radius:50%;display:grid;place-items:center;background:var(--amber);color:#fff;font:700 .95rem var(--head)}

/* SWOT */
.wmb-swot{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.wmb-sw{background:var(--card);border:1px solid var(--line);border-top:6px solid var(--espresso);border-radius:var(--r);padding:1.4rem}
.wmb-sw.is-w{border-top-color:var(--sand)}
.wmb-sw.is-o{border-top-color:var(--amber-2)}
.wmb-sw.is-t{border-top-color:var(--amber)}
.wmb-sw .l{font:700 2.6rem/1 var(--head);color:var(--amber);letter-spacing:-.03em}
.wmb-sw h3{margin:.3rem 0 .6rem}
.wmb-sw .wmb-list{color:var(--muted)}
.wmb-strat{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.wmb-strat div{padding:1rem 1.2rem;border:1px solid var(--line);border-radius:16px;background:var(--cream-2)}
.wmb-strat b{display:block;font-family:var(--head);color:var(--amber);margin-bottom:.15rem}

/* Business Model Canvas */
.wmb-bmc{display:grid;grid-template-columns:repeat(10,1fr);gap:.75rem}
.wmb-b{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:1.1rem 1.15rem;font-size:.95rem}
.wmb-b h3{font-size:1.02rem;margin-bottom:.1rem}
.wmb-b .n{display:block;font:600 .78rem var(--body);color:var(--amber);letter-spacing:.04em;text-transform:uppercase;margin-bottom:.5rem}
.wmb-b p{margin:0;color:var(--muted)}
.wmb-b.kp{grid-column:1/3;grid-row:1/3}
.wmb-b.ka{grid-column:3/5;grid-row:1}
.wmb-b.kr{grid-column:3/5;grid-row:2}
.wmb-b.vp{grid-column:5/7;grid-row:1/3;background:var(--espresso);border-color:var(--espresso)}
.wmb-b.vp h3{color:#fff}
.wmb-b.vp .n{color:var(--amber-2)}
.wmb-b.vp p{color:#e4d7c3}
.wmb-b.cr{grid-column:7/9;grid-row:1}
.wmb-b.ch{grid-column:7/9;grid-row:2}
.wmb-b.cs{grid-column:9/11;grid-row:1/3}
.wmb-b.co{grid-column:1/6;grid-row:3}
.wmb-b.re{grid-column:6/11;grid-row:3}

/* CTA */
.wmb-cta{background:var(--espresso);color:var(--cream);border-radius:34px;padding:clamp(2rem,5vw,3.5rem);display:grid;gap:.5rem;justify-items:start}
.wmb-cta h2{color:#fff;margin-bottom:.2rem}
.wmb-cta p{color:#e4d7c3}
.wmb-cta .btn-ghost{border-color:var(--cream);color:var(--cream)}
.wmb-cta .btn-ghost:hover{background:var(--cream);color:var(--espresso)}

/* Paket harga */
.wmb-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;align-items:stretch}
.wmb-plan{display:flex;flex-direction:column;gap:.5rem;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.6rem;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.wmb-plan:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.wmb-plan .sub{color:var(--muted);font-size:.92rem;margin:0}
.wmb-plan.is-rec{background:var(--espresso);border-color:var(--espresso);color:var(--cream)}
.wmb-plan.is-rec h3,.wmb-plan.is-rec .wmb-price{color:#fff}
.wmb-plan.is-rec .sub,.wmb-plan.is-rec .goal{color:#d8c9b3}
.wmb-plan.is-rec .wmb-tag.is-rencana{border-color:var(--cream);color:var(--cream)}
.wmb-price{font:700 2.3rem/1 var(--head);color:var(--espresso);letter-spacing:-.03em;margin:.4rem 0}
.wmb-price small{font:500 1rem var(--body);opacity:.7;letter-spacing:0}
.wmb-plan ul{list-style:none;margin:.4rem 0;padding:0;display:grid;gap:.45rem}
.wmb-plan li{position:relative;padding-left:1.4rem}
.wmb-plan li::before{content:"";position:absolute;left:0;top:.62em;width:.5rem;height:.5rem;transform:rotate(45deg);background:var(--amber-2)}
.wmb-plan .goal{margin:auto 0 0;padding-top:.8rem;font-size:.92rem;color:var(--muted)}

/* Tahapan implementasi */
.wmb-steps{counter-reset:s;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.wmb-steps li{counter-increment:s;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.3rem}
.wmb-steps li::before{content:counter(s);display:grid;place-items:center;width:2.2rem;height:2.2rem;border-radius:50%;background:var(--amber);color:#fff;font:700 .95rem var(--head);margin-bottom:.8rem}
.wmb-steps h3{font-size:1.05rem}
.wmb-steps p{margin:0;color:var(--muted);font-size:.96rem}

/* Responsif */
@media (max-width:1100px){
  .wmb-bmc{grid-template-columns:1fr 1fr}
  .wmb-b.kp,.wmb-b.ka,.wmb-b.kr,.wmb-b.vp,.wmb-b.cr,.wmb-b.ch,.wmb-b.cs,.wmb-b.co,.wmb-b.re{grid-column:auto;grid-row:auto}
  .wmb-b.vp{order:-1;grid-column:1/-1}
  .wmb-steps{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .wmb-plans{grid-template-columns:1fr}
}
@media (max-width:860px){
  .wmb-two,.wmb-swot,.wmb-strat,.wmb-ext-grid{grid-template-columns:1fr}
  .wmb-layer{grid-template-columns:1fr;gap:.6rem}
}
@media (max-width:620px){
  .wmb-bmc,.wmb-steps{grid-template-columns:1fr}
  .wmb-cta{border-radius:26px}
}

/* Tambahan */
.wmb-stack{display:grid;gap:1rem}
.wmb-top .feat-ic{margin-bottom:0}
.wmb-top h3{margin:0}
.wmb-card .wmb-top{margin-bottom:.6rem}
.wmb-card .wmb-top h3{margin:0}