/*
 * Token & komponen dasar iuran-blocks — design-system.md v1 (Rupa, 30 Sep 2026).
 * Block hanya boleh memakai var(--io-*). Tidak ada hex di CSS block.
 */
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/plus-jakarta-sans-latin-400-normal.woff2?v=2) format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url(fonts/plus-jakarta-sans-latin-600-normal.woff2?v=2) format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url(fonts/plus-jakarta-sans-latin-700-normal.woff2?v=2) format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 800; font-display: swap; src: url(fonts/plus-jakarta-sans-latin-800-normal.woff2?v=2) format("woff2"); }

/* Font cadangan dengan metrik disetel ke Plus Jakarta Sans → teks tidak "melompat" saat font asli selesai dimuat (CLS). */
@font-face { font-family: "Plus Jakarta Sans Fallback"; src: local("Arial"), local("Helvetica"), local("Roboto"); size-adjust: 105%; ascent-override: 98.5%; descent-override: 21%; line-gap-override: 0%; }

:root {
	/* Warna (§2) */
	--io-brand-600: #0B7A57; --io-brand-700: #08603F; --io-brand-50: #E7F3EE; --io-brand-300: #7FD6B1;
	--io-navy-900: #0E2233; --io-ink: #0E2233; --io-navy-800: #162B45; --io-navy-line: #2C4463;
	--io-wa-600: #15803D; --io-wa-700: #166534; --io-accent-600: #C2410C; --io-accent-700: #9A3412; --io-accent-on-dark: #F08A5D; --io-accent-100: #FFE9DB;
	--io-peach-200: #FFD9C2;
	--io-ink-muted: #4A5A68; --io-ink-subtle: #6B7885;
	--io-on-dark: #FFFFFF; --io-on-dark-muted: #C9D6E0;
	--io-bg: #F7F6F2; --io-surface: #FFFFFF; --io-line: #DDE2DC; --io-control-border: #7A8791;
	--io-danger: #B42318; --io-danger-50: #FDEAEA; --io-warning: #B54708; --io-info: #1D5FA8; --io-info-50: #E8F0FA;
	--io-focus: var(--io-brand-600);
	--io-row-dark: rgba(255, 255, 255, .08);

	/* Tipografi (§3) */
	--io-font: "Plus Jakarta Sans", "Plus Jakarta Sans Fallback", system-ui, -apple-system, "Segoe UI", sans-serif;
	--io-fs-display: clamp(2.25rem, 1.6rem + 2.8vw, 3.5rem);
	--io-fs-h1: clamp(2rem, 1.6rem + 1.8vw, 2.75rem);
	--io-fs-h2: clamp(1.625rem, 1.35rem + 1.2vw, 2.125rem);
	--io-fs-h3: clamp(1.25rem, 1.15rem + 0.4vw, 1.375rem);
	--io-fs-body-lg: clamp(1rem, 0.95rem + 0.3vw, 1.125rem);
	--io-fs-price: clamp(1.75rem, 1.6rem + 0.5vw, 2rem);

	/* Spasi (§4) */
	--io-space-1: 4px; --io-space-2: 8px; --io-space-3: 12px; --io-space-4: 16px; --io-space-5: 24px;
	--io-space-6: 32px; --io-space-7: 48px; --io-space-8: 64px; --io-space-9: 96px;
	--io-container: 1200px; --io-prose: 720px;
	--io-gutter: 16px;
	--io-section-y: var(--io-space-7);
	--io-title-gap: var(--io-space-5);

	/* Radius & bayangan (§5) */
	--io-radius-sm: 8px; --io-radius-md: 12px; --io-radius-lg: 20px; --io-radius-full: 999px;
	--io-shadow-sm: 0 1px 2px rgba(14, 34, 51, .06);
	--io-shadow-md: 0 8px 24px rgba(14, 34, 51, .08);
	--io-shadow-lg: 0 20px 48px rgba(14, 34, 51, .14);
	--io-ease: cubic-bezier(0.2, 0, 0, 1);
	--io-navy-line: #2C4463; /* garis atas footer (design-spec aturan 8) */
	--io-ease-spring: cubic-bezier(0.34, 1.3, 0.64, 1); /* sedikit memantul (0.3.0, permintaan owner) */

	/* Alias lama (0.1.x) */
	--ib-primary: var(--io-navy-800); --ib-on-primary: var(--io-on-dark); --ib-accent: var(--io-accent-600);
	--ib-on-accent: #FFFFFF; --ib-text: var(--io-ink); --ib-muted: var(--io-ink-muted); --ib-surface: var(--io-surface);
	--ib-surface-alt: var(--io-bg); --ib-border: var(--io-line); --ib-focus: var(--io-focus); --ib-radius: var(--io-radius-lg);
	--ib-gap: var(--io-space-5); --ib-pad-x: var(--io-gutter); --ib-maxw: var(--io-container); --ib-font-size-price: var(--io-fs-price);
}
@media (min-width: 768px) { :root { --io-gutter: 32px; --io-section-y: var(--io-space-8); --io-title-gap: var(--io-space-6); } }
@media (min-width: 1025px) { :root { --io-section-y: var(--io-space-9); --io-title-gap: 40px; } }

/* ---------- Dasar ---------- */
.io-page.io-page, .ib-header.ib-header, .ib-footer.ib-footer, .ib-harga.ib-harga, [class*="wp-block-iuran-"] { font-family: var(--io-font); color: var(--io-ink); }
.io-container.io-container, .ib-container.ib-container { max-width: var(--io-container); margin-inline: auto; padding-inline: var(--io-gutter); box-sizing: border-box; width: 100%; }
.io-sr-only.io-sr-only, .ib-sr-only.ib-sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.io-section.io-section { padding-block: var(--io-section-y); letter-spacing: 0; }
/* Aturan 12 (review pra-produksi #11): section berurutan dengan latar sama → section kedua tanpa padding atas (jarak tidak dobel). */
.io-section--bg + .io-section--bg.io-section--bg, .io-section--surface + .io-section--surface.io-section--surface, .io-section--navy + .io-section--navy.io-section--navy, .io-section--bg + :is(script, style, link) + .io-section--bg.io-section--bg, .io-section--surface + :is(script, style, link) + .io-section--surface.io-section--surface { padding-top: 0; }
/* Font (design-spec aturan 10): kerning & ligatur selalu aktif; file woff2 tanpa hinting. 0.8.0: pasangan kerning bawaan f→t (+30 unit, celah "Daf tarkan") dinolkan di file woff2 (OFL, tanpa Reserved Font Name); ?v=2 memaksa unduh ulang. */
.io-section.io-section, .ib-header.ib-header, .ib-footer.ib-footer, .io-reg.io-reg, .io-page.io-page { font-kerning: normal; font-feature-settings: "kern" 1, "liga" 1; }
/* Perisai tema (review #4 #5 #11): elemen tanpa class di dalam block kita tidak ikut margin/indent/tracking tema.
   Aturan class kita di bawah (dan di CSS block) tetap menang karena dimuat sesudahnya. */
:is(.io-section, .ib-header, .ib-footer, .io-reg.io-reg) :where(h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, figure, address, blockquote, fieldset, legend) { margin-top: 0; margin-bottom: 0; letter-spacing: 0; }
:is(.io-section, .ib-header, .ib-footer, .io-reg.io-reg) :where(ul, ol) { margin-left: 0; margin-right: 0; padding-left: 0; padding-inline-start: 0; }
.ib-header.ib-header, .ib-footer.ib-footer, .io-reg.io-reg { letter-spacing: 0; }
/* Section navy terakhir sebelum footer (navy): beri napas + garis footer (design-spec aturan 8). */
.io-section--navy.io-section--navy:last-child { padding-bottom: calc(var(--io-section-y) + var(--io-space-6)); }
.io-section--bg.io-section--bg { background: var(--io-bg); }
.io-section--surface.io-section--surface { background: var(--io-surface); }
.io-section--navy.io-section--navy { background: var(--io-navy-800); color: var(--io-on-dark); --io-focus: var(--io-brand-300); }
.io-section.io-section *, .io-page.io-page * { box-sizing: border-box; }

.io-eyebrow.io-eyebrow { margin: 0 0 10px; font-size: 13px; font-weight: 700; line-height: 1.4; letter-spacing: .06em; text-transform: uppercase; color: var(--io-brand-600); }
.io-section--navy .io-eyebrow.io-eyebrow { color: var(--io-peach-200); }
.io-h1.io-h1, .io-h2.io-h2, .io-h3.io-h3, .io-display.io-display { margin: 0; color: inherit; font-family: var(--io-font); }
.io-display.io-display { font-size: var(--io-fs-display); font-weight: 800; line-height: 1.05; letter-spacing: -.015em; }
.io-h1.io-h1 { font-size: var(--io-fs-h1); font-weight: 800; line-height: 1.1; letter-spacing: -.015em; }
.io-h2.io-h2 { font-size: var(--io-fs-h2); font-weight: 700; line-height: 1.15; letter-spacing: -.015em; }
.io-h3.io-h3 { font-size: var(--io-fs-h3); font-weight: 700; line-height: 1.3; }
.io-lead.io-lead { margin: var(--io-space-3) 0 0; font-size: var(--io-fs-body-lg); line-height: 1.6; color: var(--io-ink-muted); }
.io-section--navy .io-lead.io-lead { color: var(--io-on-dark-muted); }
.io-small.io-small { font-size: 14px; line-height: 1.5; }
.io-section-head.io-section-head { margin-bottom: var(--io-title-gap); max-width: 760px; }
.io-section-head--split.io-section-head--split { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--io-space-3) var(--io-space-6); max-width: none; }
.io-section-head--split.io-section-head--split > div { max-width: 760px; }

/* ---------- Tombol (§6) ---------- */
.io-btn.io-btn, .ib-btn.ib-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: var(--io-space-2);
	min-height: 48px; padding: 0 20px; border-radius: var(--io-radius-md); border: 1.5px solid transparent;
	font-family: var(--io-font); font-size: 16px; font-weight: 600; line-height: 1.2; text-decoration: none; cursor: pointer;
	transition: background-color .15s ease, opacity .15s ease; box-sizing: border-box;
}
a.io-btn.io-btn.io-btn, a.ib-btn.ib-btn.ib-btn { text-decoration: none; }
.io-btn--primary.io-btn--primary, .ib-btn.ib-btn { background: var(--io-accent-600); color: #FFFFFF; }
a.io-btn--primary.io-btn--primary.io-btn--primary, a.io-btn--primary.io-btn--primary.io-btn--primary:visited, a.ib-btn.ib-btn.ib-btn, a.ib-btn.ib-btn.ib-btn:visited { color: #FFFFFF; }
.io-btn--primary.io-btn--primary:hover, .ib-btn.ib-btn:hover { background: var(--io-accent-700); color: #FFFFFF; }
.io-btn--primary.io-btn--primary:active { transform: translateY(1px); }
.io-btn--dark.io-btn--dark { background: var(--io-accent-on-dark); color: var(--io-navy-800); }
/* 0.17.3 (owner): semua tombol ke WhatsApp = hijau WA yang serasi dengan hijau brand; putih di atasnya 5,0:1 (AA). */
.io-btn--wa.io-btn--wa { background: var(--io-wa-600, #15803D); color: #FFFFFF; }
a.io-btn--wa.io-btn--wa.io-btn--wa, a.io-btn--wa.io-btn--wa.io-btn--wa:visited { color: #FFFFFF; }
.io-btn--wa.io-btn--wa:hover { background: var(--io-wa-700, #166534); color: #FFFFFF; }
.io-btn--wa.io-btn--wa:active { transform: translateY(1px); }
a.io-btn--dark.io-btn--dark.io-btn--dark, a.io-btn--dark.io-btn--dark.io-btn--dark:visited { color: var(--io-navy-800); }
.io-btn--dark.io-btn--dark:hover { opacity: .9; }
.io-btn--secondary.io-btn--secondary, .ib-btn--ghost.ib-btn--ghost { background: var(--io-surface); color: var(--io-ink); border-color: var(--io-control-border); }
a.io-btn--secondary.io-btn--secondary.io-btn--secondary, a.io-btn--secondary.io-btn--secondary.io-btn--secondary:visited, a.ib-btn.ib-btn--ghost.ib-btn--ghost, a.ib-btn.ib-btn--ghost.ib-btn--ghost:visited { color: var(--io-ink); }
.io-btn--secondary.io-btn--secondary:hover, .ib-btn--ghost.ib-btn--ghost:hover { background: var(--io-brand-50); }
.io-btn--outline-dark.io-btn--outline-dark { background: transparent; color: var(--io-on-dark); border-color: var(--io-on-dark-muted); }
a.io-btn--outline-dark.io-btn--outline-dark.io-btn--outline-dark, a.io-btn--outline-dark.io-btn--outline-dark.io-btn--outline-dark:visited { color: var(--io-on-dark); }
.io-btn--outline-dark.io-btn--outline-dark:hover { background: rgba(255, 255, 255, .08); border-color: var(--io-on-dark); }
.io-btn--lg.io-btn--lg { min-height: 56px; font-size: 17px; }
.io-link.io-link { color: var(--io-brand-600); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; display: inline-flex; align-items: center; min-height: 44px; gap: 6px; }
a.io-link.io-link:hover { color: var(--io-brand-700); }
.io-section--navy .io-link.io-link { color: var(--io-on-dark); }
.io-page.io-page a:focus-visible, .io-page.io-page button:focus-visible, .io-page.io-page summary:focus-visible, .io-page.io-page input:focus-visible, .ib-header.ib-header a:focus-visible, .ib-header.ib-header button:focus-visible, .ib-footer.ib-footer a:focus-visible, .ib-harga.ib-harga a:focus-visible, .io-btn.io-btn:focus-visible {
	outline: 3px solid var(--io-focus); outline-offset: 2px;
}
.io-icon.io-icon { flex: none; }
.io-iconbox.io-iconbox {
	display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px;
	border-radius: var(--io-radius-md); background: var(--io-brand-50); color: var(--io-brand-600); flex: none;
}
@media (min-width: 1025px) { .io-iconbox.io-iconbox { width: 48px; height: 48px; } }

/* ---------- Badge (§6) ---------- */
.io-badge.io-badge { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border-radius: var(--io-radius-full); font-size: 13px; font-weight: 700; line-height: 1.5; white-space: nowrap; }
.io-badge.io-badge::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.io-badge--success.io-badge--success { background: var(--io-brand-50); color: var(--io-brand-700); }
.io-badge--pending.io-badge--pending, .io-badge--highlight.io-badge--highlight { background: var(--io-accent-100); color: var(--io-accent-700); }
.io-badge--danger.io-badge--danger { background: var(--io-danger-50); color: var(--io-danger); }
/* 0.11.0 (§D.6): "Segera hadir" — netral, tanpa titik status, 11px. */
.io-badge--soon.io-badge--soon { background: var(--io-bg); color: var(--io-ink-muted); border: 1px solid var(--io-line); font-size: 11px; padding: 1px 8px; vertical-align: middle; }
.io-badge--soon.io-badge--soon::before { display: none; }
/* Tautan tab baru (§D.2): ikon kecil di tombol. */
.io-ext.io-ext { flex: none; }

/* ---------- Card (§6) ---------- */
.io-card.io-card { background: var(--io-surface); border: 1px solid var(--io-line); border-radius: var(--io-radius-lg); padding: var(--io-space-4); }
@media (min-width: 1025px) { .io-card.io-card { padding: var(--io-space-5); } }

/* ---------- Reveal (§8): satu per section, bukan hero ---------- */
.io-reveal-on .io-reveal.io-reveal { opacity: 0; transform: translateY(8px); transition: opacity .25s var(--io-ease), transform .25s var(--io-ease); }
.io-reveal-on .io-reveal.io-reveal.is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	.io-reveal-on .io-reveal.io-reveal { opacity: 1; transform: none; transition: none; }
	.io-btn.io-btn, .ib-btn.ib-btn { transition: none; }
}

.ib-admin-notice.ib-admin-notice { margin-block: 12px; }
.ib-editor-notice.ib-editor-notice { padding: 12px 16px; border: 1px dashed var(--io-warning); background: var(--io-accent-100); color: var(--io-accent-700); border-radius: 8px; font-size: 14px; }

/* ---------- Tata letak Kanvas ---------- */
body.io-page.io-page { margin: 0; background: var(--io-surface); font-family: var(--io-font); color: var(--io-ink); font-size: 16px; line-height: 1.6; -webkit-text-size-adjust: 100%; }
body.io-page.io-page main { display: block; }
body.io-page.io-page main:focus { outline: none; }
body.io-page.io-page main > * { margin-block: 0; }
.io-skip.io-skip { position: absolute; left: 8px; top: -100px; z-index: 1000; padding: 12px 16px; background: var(--io-surface); color: var(--io-ink); border-radius: var(--io-radius-md); box-shadow: var(--io-shadow-md); font-weight: 600; }
.io-skip.io-skip:focus { top: 8px; outline: 3px solid var(--io-focus); outline-offset: 2px; }

/* Font & atribut hidden: jangan ditimpa gaya tema. */
.io-page.io-page :where(h1, h2, h3, h4, h5, h6, p, li, a, button, summary, input, label, address), [class*="wp-block-iuran-"] :where(h1, h2, h3, h4, h5, h6, p, li, a, button, summary, input, label, address), .ib-header.ib-header :where(h1, h2, h3, p, li, a, button), .ib-footer.ib-footer :where(h1, h2, h3, p, li, a, address) { font-family: var(--io-font); }
.io-page.io-page [hidden], [class*="wp-block-iuran-"] [hidden], .io-calc.io-calc [hidden], .io-badge.io-badge[hidden] { display: none !important; }

/* Reset daftar: tema (mis. Kadence) memberi margin/padding kiri pada ul/ol/li. */
.io-section.io-section :where(ul, ol), .ib-header.ib-header :where(ul, ol), .ib-footer.ib-footer :where(ul, ol), .io-calc.io-calc :where(ul, ol) { margin-left: 0; margin-right: 0; padding-left: 0; }
.io-section.io-section :where(li), .ib-header.ib-header :where(li), .ib-footer.ib-footer :where(li), .io-calc.io-calc :where(li) { margin-left: 0; }

/* ============================================================
   Gerak 0.3.0 (permintaan owner: ripple, smooth, bounce).
   Hanya opacity/transform; semua mati di prefers-reduced-motion.
   ============================================================ */
@media (prefers-reduced-motion: no-preference) {
	html:has(.ib-header, .io-section.io-section) { scroll-behavior: smooth; }
}
/* Anchor #harga/#fitur/#faq tidak tertutup header sticky. */
.io-section.io-section[id], [class*="wp-block-iuran-"][id], #konten { scroll-margin-top: 88px; }

/* Ripple tombol */
.io-btn.io-btn, .ib-btn.ib-btn { position: relative; overflow: hidden; isolation: isolate; }
.io-ripple.io-ripple {
	position: absolute; z-index: -1; left: 0; top: 0; width: 16px; height: 16px; margin: -8px 0 0 -8px; border-radius: 50%;
	background: currentColor; opacity: .28; pointer-events: none; transform: scale(0);
	animation: io-ripple .2s var(--io-ease) forwards;
}
@keyframes io-ripple { to { transform: scale(var(--io-ripple-s, 20)); opacity: 0; } }

/* Ikon panah di tombol "melaju" saat hover */
.io-btn .io-icon.io-icon { transition: transform .2s var(--io-ease); }
.io-btn:hover .io-icon.io-icon, .io-btn:focus-visible .io-icon.io-icon { transform: translateX(3px); }

/* Kartu masuk berurutan dengan pantulan kecil (stagger lewat --i dari site.js) */
.io-reveal-on .io-reveal.io-reveal :where(.io-audience__card, .io-fitur__card, .ib-harga__card, .io-langkah__item, .io-faq__item) {
	opacity: 0; transform: translateY(16px) scale(.98);
	transition: opacity .3s var(--io-ease), transform .5s var(--io-ease-spring);
	transition-delay: calc(var(--i, 0) * 70ms);
}
.io-reveal-on .io-reveal.io-reveal.is-in :where(.io-audience__card, .io-fitur__card, .ib-harga__card, .io-langkah__item, .io-faq__item) { opacity: 1; transform: none; }
.io-reveal-on .io-reveal.io-reveal.is-done :where(.io-audience__card, .io-fitur__card, .ib-harga__card, .io-langkah__item, .io-faq__item) { transition-delay: 0s; }

/* Badge "Lebih hemat" memantul saat paket termurah berganti */
.io-pop.io-pop { animation: io-pop .45s var(--io-ease-spring); }
@keyframes io-pop { 0% { transform: scale(.7); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }

/* Mockup hero: progress terisi, grafik tumbuh, titik dekor mengambang (≤5 detik, lalu diam) */
.io-mockup__progress.io-mockup__progress span { transform-origin: left center; animation: io-grow-x .6s .3s var(--io-ease) both; }
.io-mockup__bars.io-mockup__bars span { transform-origin: bottom center; animation: io-grow-y .5s var(--io-ease) both; }
.io-mockup__bars.io-mockup__bars span:nth-child(1) { animation-delay: .45s; }
.io-mockup__bars.io-mockup__bars span:nth-child(2) { animation-delay: .53s; }
.io-mockup__bars.io-mockup__bars span:nth-child(3) { animation-delay: .61s; }
.io-mockup__bars.io-mockup__bars span:nth-child(4) { animation-delay: .69s; }
.io-mockup__bars.io-mockup__bars span:nth-child(5) { animation-delay: .77s; }
.io-mockup__list .io-badge.io-badge { animation: io-fade-up .3s var(--io-ease) both; }
.io-mockup__list li:nth-child(1) .io-badge.io-badge { animation-delay: .5s; }
.io-mockup__list li:nth-child(2) .io-badge.io-badge { animation-delay: .6s; }
.io-mockup__list li:nth-child(3) .io-badge.io-badge { animation-delay: .7s; }
.io-mockup__list li:nth-child(4) .io-badge.io-badge { animation-delay: .8s; }
.io-mockup__dot--navy.io-mockup__dot--navy { animation: io-float 2.4s ease-in-out .6s 1 reverse both; }
@keyframes io-fade-up { from { opacity: 0; transform: translateY(4px); } }
@keyframes io-grow-x { from { transform: scaleX(0); } }
@keyframes io-grow-y { from { transform: scaleY(0); } }
@keyframes io-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

@media (prefers-reduced-motion: reduce) {
	.io-ripple.io-ripple { display: none; }
	.io-btn .io-icon.io-icon { transition: none; }
	.io-btn:hover .io-icon.io-icon { transform: none; }
	.io-reveal-on .io-reveal.io-reveal :where(.io-audience__card, .io-fitur__card, .ib-harga__card, .io-langkah__item, .io-faq__item) { opacity: 1; transform: none; transition: none; }
	.io-pop.io-pop, .io-mockup__progress.io-mockup__progress span, .io-mockup__bars.io-mockup__bars span, .io-mockup__list .io-badge.io-badge, .io-mockup__dot--navy.io-mockup__dot--navy { animation: none; }
}

/* Tautan teks biasa (tanpa class) di dalam block iuran: brand-600 + garis bawah, tidak ikut warna tema (review v6 #1). */
.io-section.io-section a:not([class]), .io-cs.io-cs a:not([class]), .io-reg.io-reg a:not([class]), .io-nf.io-nf a:not([class]) { color: var(--io-brand-600); text-decoration: underline; text-underline-offset: 3px; }
.io-section.io-section a:not([class]):hover, .io-cs.io-cs a:not([class]):hover, .io-reg.io-reg a:not([class]):hover, .io-nf.io-nf a:not([class]):hover { color: var(--io-brand-700); }
.io-section--navy.io-section--navy a:not([class]) { color: var(--io-on-dark); }

/* Teks bebas dari editor (mis. "Cerita kami" di Tentang): kolom kontainer, baris maks. 68ch. */
.io-prose.io-prose { box-sizing: border-box; width: 100%; max-width: var(--io-container); margin: 0 auto; padding: var(--io-section-y) var(--io-gutter); color: var(--io-ink); line-height: 1.7; }
.io-prose.io-prose > * { max-width: 68ch; margin: 0 0 var(--io-space-3); }
.io-prose.io-prose > h2 { font-size: var(--io-fs-h2); font-weight: 800; line-height: 1.2; margin-bottom: var(--io-space-4); }