/* Komik — garis tinta tebal, titik halftone, balon kata, warna primer cerah */
.fam-kartun { --bw: 3px; --card: #fff; --sec-y: clamp(44px, 6vw, 88px); background-color: var(--bg); background-image: radial-gradient(color-mix(in oklab, var(--ink) 9%, transparent) 1.2px, transparent 1.6px); background-size: 12px 12px; }
.fam-kartun .display, .fam-kartun .h1, .fam-kartun .h2 { letter-spacing: .02em; line-height: 1; }
.fam-kartun .h2 { font-size: clamp(2rem, 1.3rem + 3vw, 3.8rem); text-shadow: 3px 3px 0 var(--accent); }
.fam-kartun .h2 em, .fam-kartun .h1 em { font-style: normal; color: var(--primary-text); }
.fam-kartun .eyebrow { width: fit-content; padding: 4px 10px; border: var(--bw) solid var(--ink); background: #fff59d; color: #111; font-family: var(--font-head), sans-serif; font-size: 1rem; letter-spacing: .04em; }
.fam-kartun .btn { border: var(--bw) solid var(--ink); border-radius: 10px; box-shadow: 4px 4px 0 var(--ink); font-family: var(--font-head), sans-serif; font-size: 1.15rem; letter-spacing: .04em; }
.fam-kartun .btn:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--ink); }
.fam-kartun .btn--ghost { --btn-bg: #fff; --btn-ink: #111; }
.fam-kartun .icon-btn { border: var(--bw) solid var(--ink); background: #fff; color: #111; }
.fam-kartun .hdr { background: var(--primary); color: var(--on-primary); border-bottom: var(--bw) solid var(--ink); }
.fam-kartun .hdr.is-scrolled { border-bottom-color: var(--ink); }
.fam-kartun .brand__mark { border: var(--bw) solid var(--ink); background: #ffd400; color: #111; border-radius: 50%; }
.fam-kartun .brand__name { font-family: var(--font-head), sans-serif; font-size: 1.5rem; letter-spacing: .03em; }
.fam-kartun .nav__a { color: var(--on-primary); font-family: var(--font-head), sans-serif; font-size: 1.15rem; letter-spacing: .04em; }
.fam-kartun .nav__a:hover { background: rgb(0 0 0 / .12); color: var(--on-primary); }
.fam-kartun .nav__a.is-active::after { height: 4px; background: #ffd400; }
.fam-kartun .hdr .mnav { background: var(--primary); }
.fam-kartun .marquee { border-block: var(--bw) solid var(--ink); background: #ffd400; color: #111; }
.fam-kartun .marquee__item { font-family: var(--font-head), sans-serif; font-size: 1.4rem; letter-spacing: .04em; }
.fam-kartun .marquee__item::after { content: "★"; color: #d00000; }
.fam-kartun .feat, .fam-kartun .tcard, .fam-kartun .step, .fam-kartun .cinfo { border: var(--bw) solid var(--ink); border-radius: 8px; background: #fff; color: #111; --muted: #444; box-shadow: 5px 5px 0 var(--ink); }
.fam-kartun .feat__t, .fam-kartun .step__t { font-family: var(--font-head), sans-serif; font-size: 1.4rem; letter-spacing: .02em; }
.fam-kartun .feat__ic { border: var(--bw) solid var(--ink); border-radius: 50%; background: #ffd400; color: #111; }
.fam-kartun .step__n { border: var(--bw) solid var(--ink); font-family: var(--font-head), sans-serif; }
.fam-kartun .tchat__b { border: var(--bw) solid var(--ink); border-radius: 26px; padding: 16px 20px; background: #fff; color: #111; --muted: #444; }
.fam-kartun .tchat__m.is-r .tchat__b { border: var(--bw) solid var(--ink); background: #fff59d; }
.fam-kartun .about-banner { border: var(--bw) solid var(--ink); box-shadow: 6px 6px 0 var(--ink); background: #fff; color: #111; --muted: #444; }
.fam-kartun .faq__i { border: var(--bw) solid var(--ink); border-radius: 8px; padding-inline: 16px; margin-bottom: 10px; background: #fff; color: #111; }
.fam-kartun .faq { border: 0; }
.fam-kartun .cta { border: var(--bw) solid var(--ink); box-shadow: 8px 8px 0 var(--ink); }
.fam-kartun .cat, .fam-kartun .gitem { border: var(--bw) solid var(--ink); box-shadow: 4px 4px 0 var(--ink); }
.fam-kartun .badge { border: 2px solid var(--ink); background: #ffd400; color: #111; }
.fam-kartun .ftr--card .ftr__panel { border: var(--bw) solid var(--ink); background: #fff; color: #111; --muted: #444; }
.fam-kartun .ftr--card .ftr__cta { border: var(--bw) solid var(--ink); box-shadow: 6px 6px 0 var(--ink); }
.fam-kartun .phead--band { border-block: var(--bw) solid var(--ink); }
.fam-kartun .input, .fam-kartun .select, .fam-kartun .textarea { border: var(--bw) solid var(--ink); }
.fam-kartun .wa-float { border: var(--bw) solid #111; box-shadow: 4px 4px 0 #111; }