/* (ak) 11 Nov 2026 — hero posisi "konsultasi → solusi → bina · hos · jalankan" + susunan bernafas E (audit puas hati 11 Nov).
   Dijana bersama blok (ak) dalam tools/k8-html.py; data tajuk = data/hero-tajuk.json. */

/* kicker tiga langkah */
.mk-kicker-ak > span:not(.mk-pa) { white-space: nowrap; }
.mk-kicker-ak .mk-pa { margin: 0 .5em; color: var(--ais); opacity: .7; }
.f-teater-kicker.mk-kicker-ak span { margin: 0; }
.f-teater-kicker.mk-kicker-ak .mk-pa { margin: 0 .45em; }

/* tajuk desktop: baris utama + ayat sokongan kecil + baris aksen "Built and run in Malaysia." (warna aksen, saiz tajuk) */
/* lajur kiri (--f2-kiri) bertindih ±40 px dengan peranti kanan (wow-f.css f2-jalur) → tajuk + lead berhenti 56 px sebelum hujung lajur */
@media (min-width: 961px) { html.wf .hero-teks .h-hero.h-hero-ak { max-width: calc(100vw * var(--f2-kiri) - 56px); } html.wf .hero-teks .hero-lead { max-width: min(32em, calc(100vw * var(--f2-kiri) - 56px)); }
  html.wf .h-hero.h-hero-ak { font-size: min(calc(.8 * clamp(2.4rem, min(calc(100vw * var(--f2-kiri) / 8.6), 7.4vh), 4.5rem)), calc((100vw * var(--f2-kiri) - 56px) / 10.4)); } /* baris terpanjang ("Built and run in Malaysia.", "From one conversation") ≈ 9.9em → satu baris */ }
.h-hero-ak .baris-sub { font-size: .44em; line-height: 1.3; letter-spacing: -.012em; margin: .42em 0 .36em; padding-bottom: .05em; }
.h-hero-ak .baris-sub .kata { background: none; color: #D6DDEA; -webkit-text-fill-color: #D6DDEA; }
@media (prefers-reduced-motion: no-preference) {
  .js .sedia .h-hero-ak .baris:nth-child(3) .kata { transition-delay: 300ms; }
  .js .sedia .h-hero-ak .baris:nth-child(4) .kata { transition-delay: 380ms; }
}

/* lead satu ayat, tidak masuk kawasan peranti */


/* baris fakta di depan "Systems delivered for" */
/* (am) 12 Nov: label panjang = huruf biasa Instrument Sans 14 px (bukan mono huruf besar) */
.hero-klien .mk-fakta { display: flex; flex-wrap: wrap; align-items: center; font: 500 14px/1.4 var(--sans); letter-spacing: 0; text-transform: none; color: var(--label-gelap); }
.hero-klien .mk-fakta span { white-space: nowrap; }
.hero-klien .mk-fakta span + span::before { content: "·"; margin: 0 .7em; }
.hero-klien .mk-fakta + .mk-klien-label { margin-left: 4px; padding-left: 22px; border-left: 1px solid var(--ais-garis); }
@media (min-width: 961px) { .hero-klien:has(.mk-fakta) { max-width: none; } }
@media (max-width: 960px) { .hero-klien .mk-fakta { display: none; } .hero-klien .mk-fakta + .mk-klien-label { margin-left: 0; padding-left: 0; border-left: 0; } }

/* teater telefon/tablet: baris aksen sendiri; ayat sokongan disorok ≤ 600 (skrin pertama: peranti + Talk + bukti mesti muat — gate-safari-iphone) */
.f-teater-h1.mk-h1-ak .f-redup { display: block; }
.f-teater-h1.mk-h1-ak .f-sub { display: block; font-size: .5em; line-height: 1.25; letter-spacing: -.012em; margin: .3em 0 .2em; color: #D6DDEA; }
@media (max-width: 600px) { .f-teater-h1.mk-h1-ak .f-sub { display: none; } }

/* telefon ≤ 600: kicker padat (EN satu baris di 393), tajuk sedikit rapat; telefon rendah (Safari iPhone 393×659): ayat kapsyen peranti disorok
   (label klien + nama sistem kekal) supaya peranti + Talk + bukti MOF muat dalam skrin pertama */
@media (max-width: 600px) {
  html.wf .f-teater-kicker.mk-kicker-ak { font-size: var(--label-fs); letter-spacing: .07em; line-height: 1.35; }
  html.wf .f-teater-bukti { line-height: 1.35; } /* (am) label 12 px: baris rapat supaya peranti + Talk + bukti kekal dalam 393×659 */
  html.wf .f-teater-h1.mk-h1-ak { line-height: .98; }
}
@media (max-width: 600px) and (max-height: 700px) {
  html.wf .f-teater .f2-meta { display: none; }
  /* BM: kicker + tajuk aksen 2 baris (≈ +30 px berbanding EN) → label status/klien kapsyen juga disorok; nama sistem kekal */
  html.wf:lang(ms) .f-teater .f2-plat { display: none; }
}

/* (al) 11 Nov 2026, arahan penyelaras: tajuk desktop 47 px → ±58 px (ruang kosong besar di bawah butang). Baris utama dibenar balut (text-wrap: balance,
   tiada perkataan yatim), had 3.6rem dan 6.4vh supaya teks + butang muat skrin 1280×720 / 1366×768 tanpa langgar peranti (ukur: tindih 0, BM bawah butang
   627 / 628 / 745 / 590 px @1280 / 1366 / 1440 / 1920). ≤ 1180 kekal formula (ak) (1024×768 BM tak muat). */
@media (min-width: 1181px) {
  html.wf .h-hero.h-hero-ak { font-size: min(clamp(2.4rem, min(calc(100vw * var(--f2-kiri) / 8.6), 7.4vh), 4.5rem), 3.6rem, 6.4vh); }
  html.wf .h-hero.h-hero-ak .baris { text-wrap: balance; }
}

/* (am) 12 Nov 2026 — tajuk pendek (varian dengan `saiz` dalam data/hero-tajuk.json): saiz ikut lebar lajur ÷ --am-d (had 72 px, had tinggi 8.4vh),
   baris aksen "Built and run in Malaysia." kekal warna aksen + saiz tajuk, boleh berbalut 2 baris (seimbang). Telefon ≤ 600: --am-t px. */
@media (min-width: 961px) {
  html.wf .h-hero.h-hero-ak.h-hero-am { font-size: clamp(2.4rem, min(calc((100vw * var(--f2-kiri) - 56px) / var(--am-d)), 8.4vh), 4.5rem); line-height: 1; }
  html.wf:lang(ms) .h-hero.h-hero-ak.h-hero-am { font-size: clamp(2.4rem, min(calc((100vw * var(--f2-kiri) - 56px) / var(--am-dm)), 8.4vh), 4.5rem); }
}
.h-hero-am .kata { text-wrap: balance; }
@media (max-width: 600px) { html.wf .f-teater-h1.mk-h1-ak.h-hero-am { font-size: var(--am-t); line-height: 1.02; }
  html.wf:lang(ms) .f-teater-h1.mk-h1-ak.h-hero-am { font-size: var(--am-tm); } }
/* telefon tinggi (≥ 700 px, cth 390×844 / 360×740): ruang lebih → saiz lebih besar; Safari iPhone dengan bar (393×659) kekal --am-t */
@media (max-width: 600px) and (min-height: 700px) { html.wf .f-teater-h1.mk-h1-ak.h-hero-am { font-size: var(--am-t2); }
  html.wf:lang(ms) .f-teater-h1.mk-h1-ak.h-hero-am { font-size: var(--am-tm2); } }