/* =========================================================
   Mukhayyam K6 — taklimat & slide
   ========================================================= */

.mk6 {
	--g-900: #0f2a20;
	--g-800: #153a2c;
	--g-700: #1d4d3a;
	--g-600: #2a6650;
	--g-100: #e6efe9;
	--gold: #c8963a;
	--gold-200: #f1dfb8;
	--gold-50: #fbf6ea;
	--ink: #1b2620;
	--muted: #5f6d66;
	--line: #e3e0d7;
	--paper: #faf8f3;
	--card: #ffffff;
	--r: 14px;
	--sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--arab: "Amiri", "Noto Naskh Arabic", "Traditional Arabic", serif;

	color: var(--ink);
	font-family: var(--sans);
	font-size: 16px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
	text-align: left;
}
.mk6 *, .mk6 *::before, .mk6 *::after { box-sizing: border-box; }
.mk6 :where(h1, h2, h3, h4, p, ul, ol, dl, dd, blockquote, figure) { margin: 0; padding: 0; }
.mk6 :where(h1, h2, h3, h4) { font-family: var(--sans); color: inherit; letter-spacing: -0.01em; text-transform: none; }
.mk6 :where(ul, ol) { list-style: none; }
.mk6 :where(a) { color: var(--g-700); text-decoration: underline; text-underline-offset: 2px; }
.mk6 :where(button) { font: inherit; }
.mk6 :where(details > summary) { list-style: none; }
.mk6 details > summary::-webkit-details-marker { display: none; }

/* Arab */
.mk6-arab {
	font-family: var(--arab);
	direction: rtl;
	unicode-bidi: isolate;
	text-align: left;          /* ikut konteks kiri */
	font-size: 1.3em;
	line-height: 1.7;
}
.mk6-arab-sm { font-size: 1.15em; line-height: 1.5; color: var(--g-600); }
.mk6-arab-inline { font-family: var(--arab); unicode-bidi: isolate; font-size: 1.2em; }

.mk6-muted { color: var(--muted); }
.mk6-small { font-size: .875rem; }

/* ---------------------------------------------------------
   TAKLIMAT
   --------------------------------------------------------- */
.mk6-taklimat { max-width: 760px; margin: 0 auto; padding: 16px 0 40px; }

.mk6-hero {
	background: var(--g-800);
	background-image: radial-gradient(circle at 100% 0, rgba(200,150,58,.22), transparent 55%);
	color: #fff;
	border-radius: 18px;
	padding: 24px 22px 22px;
}
.mk6-kicker { font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-200); }
.mk6 .mk6-hero-t { font-size: 1.75rem; line-height: 1.2; font-weight: 700; margin: 6px 0 4px; color: #fff; }
.mk6-hero-theme { color: rgba(255,255,255,.85); font-size: 1rem; }
.mk6-hero-theme .mk6-arab-inline { color: var(--gold-200); margin-right: 6px; }

.mk6-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: rgba(255,255,255,.12); border-radius: 12px; overflow: hidden; margin: 18px 0 0; }
.mk6-facts > div { background: var(--g-800); padding: 10px 12px; }
.mk6-facts dt { font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.6); }
.mk6-facts dd { font-size: .92rem; font-weight: 600; line-height: 1.35; margin-top: 2px; }
.mk6-facts a { color: #fff; }
.mk6-hero .mk6-btn { margin-top: 16px; }

.mk6-btn {
	display: inline-flex; align-items: center; gap: 6px;
	background: var(--g-700); color: #fff !important; text-decoration: none !important;
	padding: 10px 16px; border-radius: 10px; font-weight: 600; font-size: .92rem; border: 0; cursor: pointer;
}
.mk6-btn:hover { background: var(--g-600); }
.mk6-btn-light { background: #fff; color: var(--g-800) !important; }
.mk6-btn-light:hover { background: var(--gold-50); }
.mk6-btn-sm { padding: 7px 12px; font-size: .85rem; }

/* Tab */
.mk6-tabs {
	position: sticky; top: 0; z-index: 10;
	display: grid; grid-template-columns: 1fr 1fr; gap: 4px;
	background: var(--paper); padding: 4px; margin: 16px 0;
	border: 1px solid var(--line); border-radius: 12px;
}
.mk6-tabs button {
	appearance: none; border: 0; background: transparent; color: var(--muted);
	padding: 10px 8px; border-radius: 9px; font-weight: 600; font-size: .95rem; cursor: pointer;
}
.mk6-tabs button[aria-selected="true"] { background: var(--g-800); color: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.15); }
.mk6-taklimat.is-js .mk6-panel[hidden] { display: none; }
.mk6-panel { display: flex; flex-direction: column; gap: 12px; }
.mk6-taklimat:not(.is-js) .mk6-panel + .mk6-panel { margin-top: 28px; }

/* Kad */
.mk6-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 16px 18px; }
.mk6 .mk6-card h3 { font-size: 1rem; font-weight: 700; margin-bottom: 8px; }
.mk6-card-sub { color: var(--g-600); font-weight: 600; font-size: .9rem; margin: -4px 0 8px; }
.mk6-card-alert { background: var(--gold-50); border-color: var(--gold-200); }
.mk6-card-gold { background: var(--gold-50); border-color: var(--gold-200); }
.mk6-grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.mk6-stack { display: flex; flex-direction: column; gap: 8px; }
.mk6 .mk6-h3 { font-size: 1.05rem; font-weight: 700; margin: 12px 0 0; color: var(--g-800); }
.mk6-row-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 8px; }
.mk6 .mk6-row-head h3 { font-size: 1.05rem; font-weight: 700; color: var(--g-800); }

/* Senarai */
.mk6-list { display: flex; flex-direction: column; gap: 6px; }
.mk6-list li { position: relative; padding-left: 18px; }
.mk6 ul.mk6-list > li::before { content: ""; position: absolute; left: 3px; top: .62em; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); }
.mk6 ol.mk6-list { counter-reset: mk6; }
.mk6 ol.mk6-list > li { counter-increment: mk6; padding-left: 28px; }
.mk6 ol.mk6-list > li::before { content: counter(mk6); position: absolute; left: 0; top: .15em; width: 20px; height: 20px; border-radius: 50%; background: var(--g-100); color: var(--g-700); font-size: .72rem; font-weight: 700; display: grid; place-items: center; }
.mk6 ol.mk6-ayat { counter-reset: mk6 102; }
.mk6-ayat li { padding-left: 34px !important; }
.mk6-ayat li::before { width: 26px !important; }

.mk6-kv li { display: flex; justify-content: space-between; gap: 16px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.mk6-kv li:last-child { border-bottom: 0; }
.mk6-kv span { color: var(--muted); }
.mk6-kv strong { text-align: right; font-weight: 600; }

/* Blok lipat */
.mk6-fold { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.mk6-fold > summary { display: flex; align-items: center; gap: 10px; padding: 14px 16px; cursor: pointer; user-select: none; }
.mk6-fold > summary:hover { background: #fcfbf8; }
.mk6-fold-t { flex: 1; font-weight: 600; }
.mk6-fold-m { font-size: .8rem; font-weight: 600; color: var(--g-700); background: var(--g-100); padding: 2px 9px; border-radius: 999px; }
.mk6-fold-i { width: 9px; height: 9px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg) translateY(-3px); transition: transform .2s; flex: none; }
.mk6-fold[open] > summary .mk6-fold-i { transform: rotate(-135deg) translateY(-2px); }
.mk6-fold-b { padding: 4px 16px 16px; border-top: 1px solid var(--line); padding-top: 14px; }
.mk6-fold-b > * + * { margin-top: 10px; }

/* Senarai semak */
.mk6-check li { border-bottom: 1px solid var(--line); }
.mk6-check li:last-child { border-bottom: 0; }
.mk6-check label { display: flex; gap: 12px; align-items: flex-start; padding: 10px 0; cursor: pointer; }
.mk6-check input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--g-700); flex: none; }
.mk6-check input:checked + span { color: var(--muted); text-decoration: line-through; text-decoration-color: rgba(0,0,0,.3); }

/* Giliran pembentang */
.mk6-turn > summary { gap: 12px; }
.mk6-turn-n { width: 34px; height: 34px; border-radius: 10px; background: var(--g-800); color: #fff; font-weight: 700; display: grid; place-items: center; flex: none; }
.mk6-turn-t { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.mk6-turn-t strong { font-weight: 600; line-height: 1.3; }
.mk6-turn-t small { color: var(--muted); font-size: .82rem; }
.mk6-turn-m { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--g-700); }
.mk6-skrip { display: flex; flex-direction: column; gap: 12px; }
.mk6-skrip li { border-left: 3px solid var(--gold); padding-left: 12px; }
.mk6-skrip-n { display: block; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--gold); font-weight: 700; }
.mk6-skrip p { color: var(--muted); font-size: .92rem; margin-top: 2px; }

.mk6-table-wrap { overflow-x: auto; }
.mk6-table { width: 100%; border-collapse: collapse; font-size: .9rem; margin: 0; }
.mk6-table th, .mk6-table td { padding: 9px 8px; border: 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; background: none; }
.mk6-table th { font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.mk6-table td:first-child { color: var(--muted); width: 28px; }
.mk6-table .mk6-arab { margin-top: 2px; }

.mk6-lead { font-size: 1.05rem; font-weight: 600; }
.mk6-label { font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); font-weight: 700; }
.mk6-quote { border-left: 3px solid var(--g-600); background: var(--paper); padding: 10px 14px; border-radius: 0 10px 10px 0; font-style: normal; }
.mk6-foot { text-align: center; color: var(--muted); font-size: .8rem; margin-top: 24px; }

/* ---------------------------------------------------------
   SLIDE DECK
   Saiz asas (font-size) ditetapkan oleh JS mengikut lebar.
   Reka bentuk berasaskan kanvas 1280×720 @ 20px.
   --------------------------------------------------------- */
.mk6-deck {
	--s-bg: #10261d;
	--s-bg2: #163427;
	--s-ink: #f5f1e6;
	--s-muted: #a9b8b0;
	--s-gold: #e0b45a;
	--s-card: rgba(255,255,255,.055);
	--s-line: rgba(255,255,255,.1);

	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	background: var(--s-bg);
	background-image: radial-gradient(ellipse at 85% 0%, rgba(224,180,90,.12), transparent 50%), radial-gradient(ellipse at 0% 100%, rgba(42,102,80,.35), transparent 55%);
	color: var(--s-ink);
	border-radius: 16px;
	overflow: hidden;
	font-size: 12px; /* ditimpa oleh JS */
	line-height: 1.45;
	outline: none;
	user-select: none;
	margin: 0;
}
.mk6-deck:focus-visible { box-shadow: 0 0 0 3px var(--gold); }
.mk6-deck-stage { position: absolute; inset: 0; }

.mk6-s {
	position: absolute; inset: 0;
	display: flex; flex-direction: column;
	padding: 3em 4.5em 4.2em;
	opacity: 0; visibility: hidden;
	transition: opacity .3s ease, visibility .3s;
}
.mk6-s.is-active { opacity: 1; visibility: visible; }
.mk6-s-body { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: .9em; max-width: 54em; }
.mk6-s-tengah .mk6-s-body { align-items: center; text-align: center; margin: 0 auto; }
.mk6-s-tengah .mk6-arab { text-align: center; }

/* Tag pembentang */
.mk6-s-tag { display: inline-flex; align-items: center; gap: .6em; align-self: flex-start; font-size: .75em; font-weight: 600; color: var(--s-muted); letter-spacing: .02em; }
.mk6-s-tengah .mk6-s-tag { align-self: center; }
.mk6-s-tag-n { width: 1.9em; height: 1.9em; border-radius: .5em; background: var(--s-gold); color: var(--s-bg); display: grid; place-items: center; font-weight: 800; }
.mk6-s-tag-l { color: var(--s-gold); text-transform: uppercase; letter-spacing: .1em; font-size: .9em; }
.mk6-s-tag-l::before { content: "·"; margin-right: .6em; color: var(--s-muted); }

.mk6-s-kicker { font-size: .75em; letter-spacing: .18em; text-transform: uppercase; color: var(--s-gold); }
.mk6 .mk6-s-title { font-size: 2.2em; line-height: 1.15; font-weight: 700; color: var(--s-ink); letter-spacing: -.015em; }
.mk6 h1.mk6-s-title { font-size: 2.8em; }
.mk6-s-sub { color: var(--s-muted); font-size: 1em; }
.mk6-s-lead { font-size: 1.3em; line-height: 1.5; color: var(--s-ink); max-width: 36em; }
.mk6-s-accent { font-size: 1.2em; line-height: 1.45; color: var(--s-gold); font-weight: 600; max-width: 38em; }
.mk6-s-muted { font-size: .85em; color: var(--s-muted); }
.mk6-s-trans { color: var(--s-muted); font-size: 1em; max-width: 40em; }

.mk6-s .mk6-arab { color: var(--s-gold); }
.mk6-s .mk6-arab-xl { font-size: 3.4em; line-height: 1.4; }
.mk6-s .mk6-arab-lg { font-size: 2.2em; line-height: 1.3; }
.mk6-s .mk6-arab-md { font-size: 1.9em; line-height: 1.6; }
.mk6-s .mk6-arab-sm { font-size: 1.25em; line-height: 1.4; color: var(--s-gold); }

.mk6-s-quote { border-left: .2em solid var(--s-gold); padding: .3em 0 .3em 1.2em; }

.mk6-s-list { display: flex; flex-direction: column; gap: .7em; font-size: 1.15em; }
.mk6-s-list li { position: relative; padding-left: 1.3em; }
.mk6-s-list li::before { content: ""; position: absolute; left: 0; top: .55em; width: .45em; height: .45em; border-radius: 50%; background: var(--s-gold); }
.mk6-s-list-2 { display: grid; grid-template-columns: 1fr 1fr; gap: .8em 2.5em; }

.mk6-s-cards { display: grid; gap: .8em; }
.mk6-s-cards-2 { grid-template-columns: 1fr 1fr; }
.mk6-s-cards-3 { grid-template-columns: repeat(3, 1fr); }
.mk6-s-card { background: var(--s-card); border: 1px solid var(--s-line); border-radius: .8em; padding: 1em 1.2em; display: flex; flex-direction: column; gap: .25em; }
.mk6-s-card-row { flex-direction: row; gap: 1em; align-items: flex-start; }
.mk6-s-card strong { font-size: 1.05em; color: var(--s-ink); }
.mk6-s-card p { color: var(--s-muted); font-size: .9em; line-height: 1.45; }
.mk6-s .mk6-num { width: 1.8em; height: 1.8em; border-radius: 50%; background: rgba(224,180,90,.15); color: var(--s-gold); font-weight: 800; font-size: .9em; display: grid; place-items: center; flex: none; }

.mk6-s-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8em; align-items: end; }
.mk6-s-step { background: var(--s-card); border: 1px solid var(--s-line); border-radius: .8em; padding: 1.1em; text-align: center; display: flex; flex-direction: column; align-items: center; gap: .2em; }
.mk6-s-step .mk6-arab { text-align: center; }
.mk6-s-step-1 { min-height: 8.5em; }
.mk6-s-step-2 { min-height: 10.5em; }
.mk6-s-step-3 { min-height: 12.5em; background: rgba(224,180,90,.12); border-color: rgba(224,180,90,.4); }
.mk6-s-step strong { letter-spacing: .14em; font-size: .95em; }
.mk6-s-step span { color: var(--s-muted); font-size: .85em; }

/* Nota pembentang */
.mk6-s-nota { display: none; }
.mk6-deck.show-notes .mk6-s.is-active .mk6-s-nota {
	display: block; position: absolute; left: 1.5em; right: 1.5em; bottom: 3.4em;
	background: rgba(0,0,0,.72); backdrop-filter: blur(6px);
	border: 1px solid var(--s-line); border-radius: .7em;
	padding: .8em 1em; font-size: .85em; color: var(--s-ink); z-index: 3;
}
.mk6-s-nota strong { color: var(--s-gold); }

/* Bar kawalan */
.mk6-deck-progress { position: absolute; left: 0; right: 0; top: 0; height: 3px; background: rgba(255,255,255,.06); z-index: 4; }
.mk6-deck-progress span { display: block; height: 100%; width: 0; background: var(--s-gold); transition: width .3s; }
.mk6-deck-bar {
	position: absolute; right: 1em; bottom: .9em; z-index: 4;
	display: flex; align-items: center; gap: .35em;
	font-size: max(.8em, 11px);
	opacity: .55; transition: opacity .2s;
}
.mk6-deck:hover .mk6-deck-bar, .mk6-deck:focus-within .mk6-deck-bar { opacity: 1; }
.mk6-deck-btn {
	appearance: none; background: rgba(255,255,255,.08); color: var(--s-ink); border: 1px solid var(--s-line);
	border-radius: .6em; min-width: 2.4em; height: 2.4em; padding: 0 .6em; cursor: pointer; line-height: 1; font-size: 1em;
}
.mk6-deck-btn:hover { background: rgba(255,255,255,.18); }
.mk6-deck-btn[aria-pressed="true"] { background: var(--s-gold); color: var(--s-bg); border-color: var(--s-gold); }
.mk6-deck-txt { font-weight: 600; font-size: .85em; }
.mk6-deck-count { color: var(--s-muted); min-width: 4em; text-align: center; font-variant-numeric: tabular-nums; }

/* Skrin penuh & mod pembentangan */
.mk6-deck:fullscreen { border-radius: 0; aspect-ratio: auto; width: 100vw; height: 100vh; }
body.mk6-present { margin: 0; background: #000; height: 100vh; overflow: hidden; }
body.mk6-present .mk6-deck { border-radius: 0; aspect-ratio: auto; width: 100vw; height: 100vh; }
.mk6-deck:fullscreen .mk6-s-body, body.mk6-present .mk6-s-body { margin-left: auto; margin-right: auto; width: 100%; max-width: 58em; }

/* Mod tindan (skrin sempit / telefon) */
.mk6-deck.is-stacked {
	aspect-ratio: auto; background: none; border-radius: 0; overflow: visible; font-size: 14px !important;
}
.mk6-deck.is-stacked .mk6-deck-stage { position: static; display: flex; flex-direction: column; gap: 12px; }
.mk6-deck.is-stacked .mk6-s {
	position: relative; opacity: 1; visibility: visible; padding: 18px 18px 16px;
	background: var(--s-bg); background-image: radial-gradient(ellipse at 100% 0%, rgba(224,180,90,.12), transparent 60%);
	border-radius: 14px; gap: 12px;
}
.mk6-deck.is-stacked .mk6-s::after { content: attr(data-n); position: absolute; top: 14px; right: 16px; font-size: 12px; color: var(--s-muted); font-weight: 700; }
.mk6-deck.is-stacked .mk6-s-body { gap: 10px; }
.mk6-deck.is-stacked .mk6-s-title { font-size: 1.45em; }
.mk6-deck.is-stacked h1.mk6-s-title { font-size: 1.7em; }
.mk6-deck.is-stacked .mk6-s-lead, .mk6-deck.is-stacked .mk6-s-accent { font-size: 1.1em; }
.mk6-deck.is-stacked .mk6-arab-xl { font-size: 2.4em; }
.mk6-deck.is-stacked .mk6-arab-md { font-size: 1.45em; }
.mk6-deck.is-stacked .mk6-s-cards-2, .mk6-deck.is-stacked .mk6-s-cards-3, .mk6-deck.is-stacked .mk6-s-list-2 { grid-template-columns: 1fr; }
.mk6-deck.is-stacked .mk6-s-steps { grid-template-columns: 1fr; }
.mk6-deck.is-stacked .mk6-s-step { min-height: 0; }
.mk6-deck.is-stacked .mk6-s-nota { display: block; position: static; background: rgba(255,255,255,.06); border-radius: 10px; padding: 10px 12px; font-size: .9em; color: var(--s-muted); }
.mk6-deck.is-stacked .mk6-deck-bar, .mk6-deck.is-stacked .mk6-deck-progress { display: none; }

/* Halaman slide (shortcode) */
.mk6-slide-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 0 0 14px; font-family: var(--sans); }
.mk6-hint { color: #5f6d66; font-size: .875rem; }

@media (max-width: 480px) {
	.mk6-facts { grid-template-columns: 1fr; }
	.mk6 .mk6-hero-t { font-size: 1.5rem; }
	.mk6-row-head { flex-wrap: wrap; }
}

/* Teks Arab dalam ayat BM */
.mk6 .mk6-ar { font-family: var(--arab); font-size: 1.1em; unicode-bidi: isolate; }
.mk6-s-tengah .mk6-arab-md { font-size: 1.65em; max-width: 30em; }
.mk6 .mk6-ar-nw { white-space: nowrap; }

/* =========================================================
   v1.2 — Halaman sendiri (tanpa tema)
   ========================================================= */
html:has(body.mk6-page) { background: #f4f2ec; }
body.mk6-page { margin: 0; background: #f4f2ec; min-height: 100vh; display: flex; flex-direction: column; }
body.mk6-page > .mk6-taklimat { width: 100%; padding-left: 16px; padding-right: 16px; }
.mk6 .mk6-ico { width: 1.15em; height: 1.15em; flex: none; }

/* Bar atas */
.mk6-bar { position: sticky; top: 0; z-index: 20; background: rgba(244,242,236,.92); backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid var(--line); }
.mk6-bar-in { max-width: 1180px; margin: 0 auto; padding: 10px 16px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; }
.mk6 .mk6-bar-back { justify-self: start; text-decoration: none; font-weight: 600; color: var(--g-800); padding: 6px 4px; }
.mk6-bar-t { font-weight: 700; color: var(--g-900); }
.mk6 .mk6-bar-act { justify-self: end; text-decoration: none; font-weight: 600; font-size: .9rem; color: #fff; background: var(--g-800); padding: 8px 14px; border-radius: 9px; }
.mk6 .mk6-bar-act:hover { background: var(--g-700); }
body.mk6-page .mk6-tabs { top: 58px; }
.mk6-pagefoot { margin-top: auto; text-align: center; color: var(--muted); font-size: .8rem; padding: 28px 16px 24px; }
.mk6-pagefoot a { color: inherit; }

/* Muka depan */
.mk6-home {
	flex: 1;
	background: var(--g-900);
	background-image:
		radial-gradient(ellipse 70% 60% at 100% 0%, rgba(224,180,90,.20), transparent 60%),
		radial-gradient(ellipse 60% 50% at 0% 100%, rgba(42,102,80,.45), transparent 60%);
	color: #fff;
	display: flex; align-items: center;
	padding: clamp(32px, 7vh, 80px) 16px;
}
body.mk6-page-home .mk6-pagefoot { background: var(--g-900); color: rgba(255,255,255,.45); margin-top: 0; }
.mk6-home-in { width: 100%; max-width: 1040px; margin: 0 auto; }
.mk6-home-head { margin-bottom: clamp(28px, 5vh, 48px); }
.mk6-home .mk6-kicker { color: var(--gold-200); }
.mk6 .mk6-home-t { font-size: clamp(2.6rem, 7vw, 4.6rem); line-height: 1; font-weight: 800; letter-spacing: -.03em; color: #fff; margin: 10px 0 6px; }
.mk6-home-area { color: rgba(255,255,255,.7); font-size: 1.05rem; font-weight: 500; }
.mk6-home-theme { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; margin-top: 18px; font-size: 1.15rem; color: rgba(255,255,255,.9); }
.mk6-home-theme .mk6-arab-inline { color: #e0b45a; font-size: 1.6em; }
.mk6-home-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.mk6-home-meta li { font-size: .9rem; font-weight: 600; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); padding: 6px 12px; border-radius: 999px; }
.mk6-home-meta a { color: #fff; text-decoration: none; }
.mk6-home-meta a::after { content: " ↗"; opacity: .6; }
.mk6-home-meta .mk6-countdown { background: #e0b45a; color: var(--g-900); border-color: #e0b45a; }

.mk6-home-cards { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 760px) { .mk6-home-cards { grid-template-columns: 1fr 1fr; gap: 20px; } }
.mk6-hcard {
	background: #fbf9f4; color: var(--ink); border-radius: 20px; padding: 26px 24px 24px;
	display: flex; flex-direction: column; gap: 10px;
	box-shadow: 0 20px 50px -20px rgba(0,0,0,.5);
}
.mk6-hcard-ico { width: 48px; height: 48px; border-radius: 14px; background: var(--g-800); color: #e0b45a; display: grid; place-items: center; margin-bottom: 6px; }
.mk6-hcard-ico .mk6-ico { width: 26px; height: 26px; }
.mk6 .mk6-hcard h2 { font-size: 1.6rem; font-weight: 800; letter-spacing: -.02em; color: var(--g-900); }
.mk6-hcard p { color: var(--muted); }
.mk6-hcard .mk6-hcard-sub { color: var(--g-700); font-weight: 600; }
.mk6-hcard-sub .mk6-arab-inline { color: var(--gold); margin-right: 6px; }
.mk6-hcard-act { display: flex; flex-wrap: wrap; gap: 10px; margin-top: auto; padding-top: 12px; }
.mk6 .mk6-hbtn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	padding: 12px 18px; border-radius: 12px; font-weight: 700; font-size: .98rem;
	text-decoration: none; color: var(--g-800); background: transparent; border: 1.5px solid var(--line);
	transition: background .15s, border-color .15s, transform .15s;
}
.mk6 .mk6-hbtn:hover { border-color: var(--g-700); }
.mk6 .mk6-hbtn-main { background: var(--g-800); border-color: var(--g-800); color: #fff; flex: 1 1 auto; }
.mk6 .mk6-hbtn-main:hover { background: var(--g-700); border-color: var(--g-700); transform: translateY(-1px); }
.mk6-home-wa { margin-top: 22px; text-align: center; }
.mk6-home-wa a { color: rgba(255,255,255,.8); font-weight: 600; }

/* Taklimat — paparan laptop */
.mk6-cols { display: flex; flex-direction: column; gap: 12px; }
.mk6-col { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.mk6 .mk6-h3-gap { margin-top: 8px; }
@media (min-width: 1024px) {
	.mk6-taklimat { max-width: 1180px; }
	.mk6-hero { padding: 30px 32px 28px; display: grid; grid-template-columns: 1fr 1.35fr; gap: 8px 40px; align-items: end; }
	.mk6-hero > .mk6-kicker, .mk6-hero > .mk6-hero-t, .mk6-hero > .mk6-hero-theme { grid-column: 1; }
	.mk6 .mk6-hero-t { font-size: 2.3rem; }
	.mk6-facts { grid-column: 2; grid-row: 1 / span 4; margin: 0; align-self: center; }
	.mk6-hero > .mk6-btn { grid-column: 1; justify-self: start; }
	.mk6-tabs { max-width: 520px; }
	.mk6-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
	.mk6-panel .mk6-grid-2 { grid-template-columns: 1fr 1fr; }
	.mk6-panel .mk6-col:first-child .mk6-grid-2 { grid-template-columns: 1fr; }
}
@media (min-width: 1280px) {
	.mk6 { font-size: 16.5px; }
}

/* ---------- Slide: elemen baharu ---------- */
.mk6-s-tag-solo::before { content: none !important; }
.mk6-s-tag-solo { font-size: .95em; }
.mk6-s-list-sm { font-size: 1em; gap: .5em; }
.mk6-s-list-2.mk6-s-list-sm { gap: .55em 2.5em; }
.mk6-s-card .mk6-s-list-sm { font-size: .9em; margin-top: .5em; color: var(--s-ink); }
.mk6-s-card .mk6-s-card-sub { color: var(--s-gold); font-size: .85em; }

.mk6-s-fakta { display: grid; grid-template-columns: repeat(2, 1fr); gap: .8em; margin: 0; }
.mk6-s-fakta > div { background: var(--s-card); border: 1px solid var(--s-line); border-radius: .8em; padding: .9em 1.2em; }
.mk6-s-fakta dt { font-size: .7em; letter-spacing: .14em; text-transform: uppercase; color: var(--s-muted); }
.mk6-s-fakta dd { font-size: 1.35em; font-weight: 700; margin: .15em 0 0; color: var(--s-ink); }

.mk6-s-kv { display: flex; flex-direction: column; border-top: 1px solid var(--s-line); }
.mk6-s-kv li { display: flex; justify-content: space-between; align-items: baseline; gap: 2em; padding: .7em 0; border-bottom: 1px solid var(--s-line); font-size: 1.05em; }
.mk6-s-kv span { color: var(--s-ink); }
.mk6-s-kv strong { color: var(--s-gold); font-weight: 600; text-align: right; white-space: nowrap; }

.mk6-s-giliran { display: flex; flex-direction: column; gap: .5em; }
.mk6-s-giliran li { display: flex; align-items: center; gap: 1em; background: var(--s-card); border: 1px solid var(--s-line); border-radius: .7em; padding: .6em 1em; }
.mk6-s-giliran .mk6-s-tag-n { font-size: .9em; }
.mk6-s-g-t { flex: 1; display: flex; flex-direction: column; }
.mk6-s-g-t strong { font-size: 1em; }
.mk6-s-g-t small { color: var(--s-muted); font-size: .78em; }
.mk6-s-g-m { color: var(--s-gold); font-weight: 700; font-variant-numeric: tabular-nums; }

.mk6-deck-taklimat .mk6-s-steps { margin-top: .4em; }
.mk6-deck-taklimat .mk6-s-step-1 { min-height: 4.5em; }
.mk6-deck-taklimat .mk6-s-step-2 { min-height: 5.5em; }
.mk6-deck-taklimat .mk6-s-step-3 { min-height: 6.5em; }
.mk6-deck-taklimat .mk6-s-step { padding: .6em; }
.mk6-deck-taklimat .mk6-s-step .mk6-arab-lg { font-size: 1.6em; }
.mk6-deck-taklimat .mk6-s-step span { display: none; }

/* Pautan ke laman utama di dalam dek */
.mk6-deck-head { display: none; }
.mk6 .mk6-deck-home {
	position: absolute; left: 1em; bottom: .9em; z-index: 4;
	font-size: max(.75em, 11px); font-weight: 600; text-decoration: none;
	color: var(--s-muted); padding: .5em .8em; border-radius: .6em;
	opacity: .5; transition: opacity .2s, background .2s;
}
.mk6 .mk6-deck-home:hover { opacity: 1; background: rgba(255,255,255,.08); color: var(--s-ink); }
.mk6-deck:fullscreen .mk6-deck-home { display: none; }

/* Mod pembentangan di telefon: tindan & boleh skrol */
body.mk6-present.mk6-scroll { height: auto; overflow: auto; background: #f4f2ec; }
body.mk6-present.mk6-scroll .mk6-deck { width: auto; height: auto; padding: 0 12px 24px; }
.mk6-deck.is-stacked .mk6-deck-head {
	display: flex; justify-content: space-between; align-items: center; gap: 12px;
	position: sticky; top: 0; z-index: 5; margin: 0 -12px 12px; padding: 12px 16px;
	background: rgba(244,242,236,.94); backdrop-filter: blur(8px); border-bottom: 1px solid #e3e0d7;
	font-size: 14px; color: #1b2620;
}
.mk6-deck.is-stacked .mk6-deck-head a { color: #153a2c; font-weight: 600; text-decoration: none; }
.mk6-deck.is-stacked .mk6-deck-head span { color: #5f6d66; font-weight: 600; }
.mk6-deck.is-stacked .mk6-deck-home { display: none; }
.mk6-deck.is-stacked .mk6-s-fakta { grid-template-columns: 1fr 1fr; }
.mk6-deck.is-stacked .mk6-s-fakta dd { font-size: 1.05em; }
.mk6-deck.is-stacked .mk6-s-kv li { flex-direction: column; gap: 2px; }
.mk6-deck.is-stacked .mk6-s-kv strong { text-align: left; white-space: normal; }
body.mk6-page .mk6, body.mk6-present .mk6 { box-sizing: border-box; }
.mk6-s-cards-2 .mk6-s-card .mk6-s-list-sm { font-size: 1em; }
.mk6-s-cards-2 .mk6-s-card > strong { font-size: 1.15em; }
@media (max-width: 600px) { .mk6 .mk6-bar-act { display: none; } }