{"id":21192,"date":"2026-02-20T14:23:12","date_gmt":"2026-02-20T07:23:12","guid":{"rendered":"https:\/\/malangutd.com\/?page_id=21192"},"modified":"2026-05-20T17:55:07","modified_gmt":"2026-05-20T10:55:07","slug":"layar-laga-creative","status":"publish","type":"page","link":"https:\/\/malangutd.com\/en\/layar-laga-creative\/","title":{"rendered":"Layar Laga Creative"},"content":{"rendered":"\n<div id=\"mjl-photo-pro\" lang=\"id\" role=\"region\" aria-label=\"MJL Photography Pro Pricing\">\n\n<style>\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800;900&display=swap');\n\n#mjl-photo-pro {\n  --gold-light: #F3E5AB;\n  --gold: #E5C07B;\n  --gold-dark: #D4AF37;\n  --gold-glow: rgba(229, 192, 123, 0.3);\n  \n  --obsidian: #050505;\n  --surface-1: #111111;\n  --surface-2: #1a1a1a;\n  --border-light: rgba(255, 255, 255, 0.08);\n  \n  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\n  background: var(--obsidian);\n  color: #ffffff;\n  overflow-x: hidden;\n  position: relative;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n\/* SCOPED RESET *\/\n#mjl-photo-pro *, #mjl-photo-pro *::before, #mjl-photo-pro *::after {\n  box-sizing: border-box;\n}\n\n\/* --- ANIMATIONS --- *\/\n@keyframes fadeInUp {\n  from { opacity: 0; transform: translateY(20px); }\n  to { opacity: 1; transform: translateY(0); }\n}\n#mjl-photo-pro .animate-fade-in {\n  animation: fadeInUp 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;\n}\n#mjl-photo-pro .delay-1 { animation-delay: 0.1s; }\n#mjl-photo-pro .delay-2 { animation-delay: 0.2s; }\n\n\/* --- HERO SECTION --- *\/\n#mjl-photo-pro .hero {\n  min-height: 80vh;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  padding: 100px 20px;\n  background: radial-gradient(circle at top center, #1f1f1f 0%, var(--obsidian) 70%);\n  position: relative;\n}\n#mjl-photo-pro .hero::after {\n  content: '';\n  position: absolute;\n  bottom: 0; left: 0; right: 0; height: 150px;\n  background: linear-gradient(to top, var(--obsidian), transparent);\n  pointer-events: none;\n}\n#mjl-photo-pro h1 {\n  font-size: clamp(42px, 8vw, 110px);\n  font-weight: 900;\n  line-height: 1;\n  letter-spacing: -0.03em;\n  margin: 0;\n  color: #ffffff;\n  text-shadow: 0 20px 40px rgba(0,0,0,0.8);\n  position: relative;\n  z-index: 2;\n}\n#mjl-photo-pro .gold-gradient {\n  background: linear-gradient(135deg, var(--gold-light) 0%, var(--gold) 50%, var(--gold-dark) 100%);\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  background-clip: text;\n  color: transparent; \/* Fallback *\/\n  display: inline-block;\n}\n#mjl-photo-pro .hero-text {\n  max-width: 760px;\n  margin: 24px auto 0;\n  color: rgba(255,255,255,0.7);\n  font-weight: 500;\n  line-height: 1.7;\n  font-size: clamp(16px, 2vw, 20px);\n  position: relative;\n  z-index: 2;\n}\n\n\/* --- SECTION TITLES --- *\/\n#mjl-photo-pro .section-title-wrap {\n  position: relative;\n  text-align: center;\n  margin-bottom: 60px;\n  padding: 20px 0;\n}\n#mjl-photo-pro .watermark {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  font-size: clamp(60px, 15vw, 180px);\n  font-weight: 900;\n  letter-spacing: -0.04em;\n  color: transparent;\n  -webkit-text-stroke: 1.5px rgba(255, 255, 255, 0.04);\n  pointer-events: none;\n  white-space: nowrap;\n  user-select: none;\n}\n#mjl-photo-pro .section-subtitle {\n  position: relative;\n  font-size: clamp(16px, 3vw, 20px);\n  letter-spacing: 0.4em;\n  font-weight: 800;\n  color: var(--gold);\n  text-transform: uppercase;\n}\n\n\/* --- TABS --- *\/\n#mjl-photo-pro .tab-container {\n  display: flex;\n  gap: 8px;\n  background: var(--surface-1);\n  padding: 8px;\n  border-radius: 99px;\n  max-width: 600px;\n  margin: 30px auto 40px;\n  border: 1px solid var(--border-light);\n  box-shadow: 0 10px 30px rgba(0,0,0,0.5);\n}\n#mjl-photo-pro .tab {\n  flex: 1;\n  padding: 16px 20px;\n  border-radius: 99px;\n  font-weight: 800;\n  font-size: 15px;\n  letter-spacing: 0.05em;\n  text-align: center;\n  cursor: pointer;\n  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n  background: transparent;\n  color: rgba(255,255,255,0.5);\n  user-select: none;\n  border: none;\n}\n#mjl-photo-pro .tab[aria-checked=\"true\"] {\n  background: linear-gradient(135deg, var(--gold-light) 0%, var(--gold) 100%);\n  color: var(--obsidian);\n  box-shadow: 0 4px 20px var(--gold-glow);\n}\n#mjl-photo-pro .tab:focus-visible {\n  outline: 2px solid var(--gold);\n  outline-offset: 4px;\n}\n\n\/* --- PRICING GRID --- *\/\n#mjl-photo-pro .pricing-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));\n  gap: 30px;\n  max-width: 1000px;\n  margin: 0 auto;\n}\n\n#mjl-photo-pro .card {\n  background: linear-gradient(180deg, var(--surface-2) 0%, var(--surface-1) 100%);\n  border: 1px solid var(--border-light);\n  padding: 50px 40px;\n  border-radius: 32px;\n  text-align: center;\n  transition: all 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);\n  position: relative;\n  display: flex;\n  flex-direction: column;\n}\n\n@media (hover: hover) {\n  #mjl-photo-pro .card:hover {\n    transform: translateY(-10px);\n    box-shadow: 0 20px 60px rgba(0,0,0,0.8), 0 0 0 1px rgba(229, 192, 123, 0.2) inset;\n    border-color: rgba(229, 192, 123, 0.3);\n  }\n}\n\n#mjl-photo-pro .badge {\n  position: absolute;\n  top: 24px;\n  right: 24px;\n  padding: 8px 16px;\n  border-radius: 99px;\n  font-weight: 800;\n  font-size: 11px;\n  letter-spacing: 0.15em;\n  text-transform: uppercase;\n  background: rgba(229, 192, 123, 0.1);\n  color: var(--gold);\n  border: 1px solid rgba(229, 192, 123, 0.2);\n  backdrop-filter: blur(4px);\n}\n\n#mjl-photo-pro .card h3 {\n  margin: 0 0 12px;\n  font-size: 24px;\n  font-weight: 800;\n  letter-spacing: -0.02em;\n}\n#mjl-photo-pro .desc {\n  margin: 0 auto 30px;\n  color: rgba(255,255,255,0.6);\n  font-weight: 500;\n  line-height: 1.6;\n  font-size: 15px;\n}\n\n#mjl-photo-pro .price {\n  font-size: 64px;\n  font-weight: 900;\n  color: #ffffff;\n  line-height: 1;\n  letter-spacing: -0.04em;\n  margin: 0 0 16px;\n  display: flex;\n  justify-content: center;\n  align-items: flex-start;\n}\n#mjl-photo-pro .price::before {\n  content: 'Rp';\n  font-size: 20px;\n  font-weight: 700;\n  color: var(--gold);\n  margin-right: 4px;\n  margin-top: 8px;\n}\n\n\/* Compare box *\/\n#mjl-photo-pro .compare {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n  margin: auto auto 30px;\n  padding: 20px;\n  border-radius: 20px;\n  background: rgba(0,0,0,0.4);\n  border: 1px solid rgba(255,255,255,0.03);\n  text-align: left;\n  width: 100%;\n}\n#mjl-photo-pro .compare-row {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  font-size: 14px;\n  font-weight: 600;\n  color: rgba(255,255,255,0.9);\n}\n#mjl-photo-pro .compare-row .label {\n  color: rgba(255,255,255,0.5);\n  font-weight: 500;\n}\n#mjl-photo-pro .strike {\n  text-decoration: line-through;\n  color: rgba(255,255,255,0.4);\n  font-weight: 500;\n}\n#mjl-photo-pro .save {\n  color: var(--obsidian);\n  background: linear-gradient(135deg, var(--gold-light), var(--gold));\n  padding: 4px 10px;\n  border-radius: 8px;\n  font-weight: 800;\n  font-size: 12px;\n  letter-spacing: 0.05em;\n}\n\n\/* CTA button *\/\n#mjl-photo-pro .btn {\n  display: block;\n  width: 100%;\n  padding: 20px 24px;\n  border-radius: 16px;\n  font-weight: 800;\n  font-size: 15px;\n  letter-spacing: 0.05em;\n  text-transform: uppercase;\n  background: var(--surface-2);\n  color: #fff;\n  border: 1px solid var(--border-light);\n  transition: all 0.3s ease;\n  text-decoration: none;\n}\n#mjl-photo-pro .card:nth-child(2) .btn {\n  background: linear-gradient(135deg, var(--gold) 0%, var(--gold-dark) 100%);\n  color: var(--obsidian);\n  border: none;\n}\n@media (hover: hover) {\n  #mjl-photo-pro .btn:hover {\n    transform: translateY(-2px);\n    background: #fff;\n    color: var(--obsidian);\n  }\n  #mjl-photo-pro .card:nth-child(2) .btn:hover {\n    background: linear-gradient(135deg, var(--gold-light) 0%, var(--gold) 100%);\n    box-shadow: 0 10px 25px var(--gold-glow);\n  }\n}\n#mjl-photo-pro .btn:focus-visible {\n  outline: 2px solid var(--gold);\n  outline-offset: 4px;\n}\n\n\/* Section spacing *\/\n#mjl-photo-pro .section-pad {\n  padding: 60px 20px 100px;\n}\n\n\/* --- LICENSE SECTION (DARK PREMIUM OVERHAUL) --- *\/\n#mjl-photo-pro .license-section {\n  padding: 0 20px 120px;\n}\n#mjl-photo-pro .license-card {\n  max-width: 1000px;\n  margin: 0 auto;\n  display: flex;\n  flex-direction: column;\n  gap: 30px;\n  background: linear-gradient(145deg, var(--surface-1) 0%, #080808 100%);\n  color: #ffffff;\n  border-radius: 32px;\n  padding: 40px;\n  border: 1px solid var(--border-light);\n  position: relative;\n  overflow: hidden;\n  box-shadow: 0 40px 100px rgba(0,0,0,0.5);\n}\n#mjl-photo-pro .license-card::before {\n  content: '';\n  position: absolute;\n  top: 0; left: 0; bottom: 0; width: 6px;\n  background: linear-gradient(to bottom, var(--gold-light), var(--gold-dark));\n}\n@media(min-width: 900px) {\n  #mjl-photo-pro .license-card {\n    flex-direction: row;\n    align-items: center;\n    padding: 50px 60px;\n  }\n}\n#mjl-photo-pro .license-main {\n  flex: 2;\n}\n#mjl-photo-pro .license-side {\n  flex: 1;\n  text-align: left;\n}\n@media(min-width: 900px) {\n  #mjl-photo-pro .license-side {\n    text-align: center;\n    padding-left: 40px;\n    border-left: 1px solid var(--border-light);\n  }\n}\n#mjl-photo-pro .license-tag {\n  display: inline-block;\n  padding: 8px 16px;\n  font-size: 11px;\n  letter-spacing: 0.2em;\n  text-transform: uppercase;\n  font-weight: 800;\n  border-radius: 99px;\n  background: rgba(229, 192, 123, 0.1);\n  color: var(--gold);\n  border: 1px solid rgba(229, 192, 123, 0.2);\n  margin-bottom: 20px;\n}\n#mjl-photo-pro .license-headline {\n  margin: 0 0 16px;\n  font-size: clamp(24px, 3vw, 32px);\n  font-weight: 800;\n  letter-spacing: -0.02em;\n  line-height: 1.3;\n}\n#mjl-photo-pro .license-text {\n  margin: 0 0 20px;\n  font-size: 15px;\n  font-weight: 500;\n  color: rgba(255,255,255,0.6);\n  line-height: 1.7;\n}\n#mjl-photo-pro .license-list {\n  margin: 0;\n  padding-left: 20px;\n  font-size: 15px;\n  color: rgba(255,255,255,0.8);\n}\n#mjl-photo-pro .license-list li {\n  margin-bottom: 10px;\n  font-weight: 500;\n  line-height: 1.5;\n}\n#mjl-photo-pro .license-list li strong {\n  color: var(--gold);\n  font-weight: 700;\n}\n#mjl-photo-pro .license-price {\n  font-size: 48px;\n  font-weight: 900;\n  color: #fff;\n  line-height: 1;\n  margin-bottom: 8px;\n}\n#mjl-photo-pro .license-price span {\n  font-size: 16px;\n  font-weight: 600;\n  color: rgba(255,255,255,0.4);\n}\n#mjl-photo-pro .license-meta {\n  font-size: 13px;\n  font-weight: 500;\n  color: rgba(255,255,255,0.5);\n  margin-bottom: 24px;\n  line-height: 1.5;\n}\n#mjl-photo-pro .license-btn {\n  display: block;\n  width: 100%;\n  padding: 18px 24px;\n  border-radius: 16px;\n  font-weight: 800;\n  font-size: 14px;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  background: #fff;\n  color: var(--obsidian);\n  text-decoration: none;\n  transition: all 0.3s ease;\n  text-align: center;\n}\n@media (hover: hover) {\n  #mjl-photo-pro .license-btn:hover {\n    background: linear-gradient(135deg, var(--gold-light), var(--gold-dark));\n    transform: translateY(-2px);\n    box-shadow: 0 10px 25px var(--gold-glow);\n  }\n}\n#mjl-photo-pro .license-btn:focus-visible {\n  outline: 2px solid var(--gold);\n  outline-offset: 4px;\n}\n\n\/* Respect reduced motion *\/\n@media (prefers-reduced-motion: reduce) {\n  #mjl-photo-pro * {\n    animation-duration: 0.01ms !important;\n    animation-iteration-count: 1 !important;\n    transition: none !important;\n    scroll-behavior: auto !important;\n  }\n}\n<\/style>\n\n<!-- HERO -->\n<section class=\"hero animate-fade-in\" aria-labelledby=\"mjl-hero-title\">\n  <h1 id=\"mjl-hero-title\">\n    ABADI DALAM <br>\n    <span class=\"gold-gradient\">SETIAP AKSI<\/span>\n  <\/h1>\n  <p class=\"hero-text delay-1 animate-fade-in\" style=\"opacity: 0;\">\n    Dokumentasi aksi premium untuk bintang masa depan Indonesia \u2014 tajam, sinematik, dan berkelas profesional.\n  <\/p>\n<\/section>\n\n<!-- PRICING SECTION -->\n<section class=\"section-pad delay-2 animate-fade-in\" style=\"opacity: 0;\" aria-labelledby=\"mjl-pricing-title\">\n\n  <div class=\"section-title-wrap\">\n    <div class=\"watermark\" aria-hidden=\"true\">RESERVASI<\/div>\n    <div id=\"mjl-pricing-title\" class=\"section-subtitle\">PILIH KATEGORI<\/div>\n  <\/div>\n\n  <!-- Tabs as radiogroup -->\n  <div class=\"tab-container\"\n       role=\"radiogroup\"\n       aria-label=\"Kategori Tim\">\n    <button type=\"button\"\n            class=\"tab\"\n            data-mode=\"junior\"\n            role=\"radio\"\n            aria-checked=\"true\"\n            tabindex=\"0\">\n      U10 &amp; U12\n    <\/button>\n    <button type=\"button\"\n            class=\"tab\"\n            data-mode=\"senior\"\n            role=\"radio\"\n            aria-checked=\"false\"\n            tabindex=\"-1\">\n      U14 &amp; U16\n    <\/button>\n  <\/div>\n\n  <!-- Pricing cards -->\n  <div class=\"pricing-grid\" aria-label=\"Paket Harga\">\n\n    <!-- Single -->\n    <article class=\"card\" aria-label=\"Paket 1 Pertandingan\">\n      <h3><span class=\"gold-gradient\">1 Pertandingan<\/span><\/h3>\n      <p class=\"desc\">Dokumentasi penuh seluruh aksi tim Anda dalam 1 laga pilihan.<\/p>\n\n      <div class=\"price\" data-price1>135K<\/div>\n\n      <div class=\"compare\" aria-label=\"Perbandingan Paket 1 Pertandingan\">\n        <div class=\"compare-row\">\n          <span class=\"label\">Harga per laga<\/span>\n          <span data-permatch-single>135K<\/span>\n        <\/div>\n        <div class=\"compare-row\">\n          <span class=\"label\">Jika butuh 2 laga<\/span>\n          <span><span class=\"strike\" data-normal-2x>270K<\/span><\/span>\n        <\/div>\n        <div class=\"compare-row\" style=\"margin-top: 8px;\">\n          <span class=\"label\">Perbandingan<\/span>\n          <span class=\"save\" data-cta-save aria-live=\"polite\">\n            Lebih hemat di paket 2\n          <\/span>\n        <\/div>\n      <\/div>\n\n      <a href=\"https:\/\/hub.malangutd.com\/pl\/single-match-action-photo-malang-junior-league-ku-10-ku-12\"\n         class=\"btn\"\n         data-buy=\"single\"\n         target=\"_blank\"\n         rel=\"noopener noreferrer\"\n         aria-label=\"Beli Paket 1 Pertandingan\">\n        Pilih Paket\n      <\/a>\n    <\/article>\n\n    <!-- Double -->\n    <article class=\"card\" aria-label=\"Paket 2 Pertandingan\">\n      <div class=\"badge best\">BEST VALUE<\/div>\n\n      <h3><span class=\"gold-gradient\">2 Pertandingan<\/span><\/h3>\n      <p class=\"desc\">Paket paling cerdas &#038; hemat untuk dokumentasi di 2 laga pilihan.<\/p>\n\n      <div class=\"price\" data-price2>199K<\/div>\n\n      <div class=\"compare\" aria-label=\"Perbandingan Paket 2 Pertandingan\">\n        <div class=\"compare-row\">\n          <span class=\"label\">Harga normal (2\u00d71 laga)<\/span>\n          <span class=\"strike\" data-normal-double>270K<\/span>\n        <\/div>\n        <div class=\"compare-row\">\n          <span class=\"label\">Hemat<\/span>\n          <span class=\"save\" data-save-badge aria-live=\"polite\">\n            Hemat 71K (26%)\n          <\/span>\n        <\/div>\n        <div class=\"compare-row\" style=\"margin-top: 8px;\">\n          <span class=\"label\">Harga per laga<\/span>\n          <span data-permatch-double>99.5K<\/span>\n        <\/div>\n      <\/div>\n\n      <a href=\"https:\/\/hub.malangutd.com\/pl\/double-match-action-photo-malang-junior-league-ku-10-ku-12-thhd\"\n         class=\"btn\"\n         data-buy=\"double\"\n         target=\"_blank\"\n         rel=\"noopener noreferrer\"\n         aria-label=\"Beli Paket 2 Pertandingan\">\n        Ambil Penawaran\n      <\/a>\n    <\/article>\n\n  <\/div>\n\n<\/section>\n\n<!-- LICENSE SECTION: TIM MEDIA SENDIRI -->\n<section class=\"license-section\" aria-labelledby=\"mjl-license-title\">\n  <div class=\"license-card\">\n    <div class=\"license-main\">\n      <div class=\"license-tag\">TIM MEDIA INTERNAL<\/div>\n      <h2 id=\"mjl-license-title\" class=\"license-headline\">\n        <span class=\"gold-gradient\">Bawa Fotografer atau <\/span><br><span class=\"gold-gradient\">Tim Media Sendiri? <\/span>\n      <\/h2>\n      <p class=\"license-text\">\n        Bagi tim yang membawa fotografer internal ke area pertandingan,\n        wajib mendaftar Lisensi ID Pass Resmi MJL demi keamanan, pendataan, serta kepatuhan\n        protokol lapangan.\n      <\/p>\n      <ul class=\"license-list\">\n        <li>1 lisensi berlaku eksklusif untuk <strong>1 orang<\/strong> di area lapangan.<\/li>\n        <li>Briefing komprehensif aturan keselamatan &amp; batas zona peliputan.<\/li>\n        <li>Mendapatkan rompi \/ ID pass resmi MJL selama bertugas.<\/li>\n      <\/ul>\n    <\/div>\n    <div class=\"license-side\">\n      <div class=\"license-price\">200K <span>\/ laga<\/span><\/div>\n      <div class=\"license-meta\">\n        Flat fee khusus pendaftaran media internal tim.\n      <\/div>\n      <a href=\"https:\/\/hub.malangutd.com\/pl\/Photographers-Malang-Junior-League-2026\"\n         class=\"license-btn\"\n         target=\"_blank\"\n         rel=\"noopener noreferrer\"\n         aria-label=\"Daftar Lisensi Fotografer MJL\">\n        Daftar Lisensi Media\n      <\/a>\n    <\/div>\n  <\/div>\n<\/section>\n\n<script>\n(function(){\n  const root = document.getElementById('mjl-photo-pro');\n  if (!root) return;\n  if (root.dataset.mjlInit === '1') return;\n  root.dataset.mjlInit = '1';\n\n  const pricing = {\n    junior: {\n      single: 135000,\n      double: 199000,\n      linkSingle: \"https:\/\/hub.malangutd.com\/pl\/single-match-action-photo-malang-junior-league-ku-10-ku-12\",\n      linkDouble: \"https:\/\/hub.malangutd.com\/pl\/double-match-action-photo-malang-junior-league-ku-10-ku-12-thhd\"\n    },\n    senior: {\n      single: 199000,\n      double: 299000,\n      linkSingle: \"https:\/\/hub.malangutd.com\/pl\/single-match-action-photo-malang-junior-league-ku-14-ku-16-ndjk\",\n      linkDouble: \"https:\/\/hub.malangutd.com\/pl\/double-match-action-photo-malang-junior-league-ku-14-ku-16-thhd-wz2m\"\n    }\n  };\n\n  let mode = 'junior';\n\n  const tabs = root.querySelectorAll('.tab[role=\"radio\"]');\n  const p1El = root.querySelector('[data-price1]');\n  const p2El = root.querySelector('[data-price2]');\n  const buySingle = root.querySelector('[data-buy=\"single\"]');\n  const buyDouble = root.querySelector('[data-buy=\"double\"]');\n\n  const normal2xEl = root.querySelector('[data-normal-2x]');\n  const normalDoubleEl = root.querySelector('[data-normal-double]');\n  const saveBadgeEl = root.querySelector('[data-save-badge]');\n  const ctaSaveEl = root.querySelector('[data-cta-save]');\n  const perMatchSingleEl = root.querySelector('[data-permatch-single]');\n  const perMatchDoubleEl = root.querySelector('[data-permatch-double]');\n\n  if (!p1El || !p2El || !buySingle || !buyDouble ||\n      !normal2xEl || !normalDoubleEl || !saveBadgeEl ||\n      !ctaSaveEl || !perMatchSingleEl || !perMatchDoubleEl) {\n    return;\n  }\n\n  function formatK(value){\n    const k = value \/ 1000;\n    const isInt = Math.abs(k - Math.round(k)) < 1e-9;\n    if (isInt) return `${Math.round(k)}K`;\n    let n = Math.round(k * 10) \/ 10;\n    return `${n.toString().replace('.', ',')}K`.replace(',0K','K');\n  }\n\n  function pctSave(saved, normal){\n    if (!normal) return 0;\n    return Math.round((saved \/ normal) * 100);\n  }\n\n  function applyMode(m){\n    const cfg = pricing[m];\n    if (!cfg) return;\n    mode = m;\n\n    const single = cfg.single;\n    const dbl = cfg.double;\n    const normal = single * 2;\n    const saved = Math.max(0, normal - dbl);\n    const pct = pctSave(saved, normal);\n\n    p1El.textContent = formatK(single);\n    p2El.textContent = formatK(dbl);\n\n    perMatchSingleEl.textContent = formatK(single);\n    normal2xEl.textContent = formatK(normal);\n    normalDoubleEl.textContent = formatK(normal);\n    saveBadgeEl.textContent = `Hemat ${formatK(saved)} (${pct}%)`;\n    perMatchDoubleEl.textContent = formatK(Math.round(dbl \/ 2));\n    ctaSaveEl.textContent = `Hemat ${formatK(saved)} via paket 2 laga`;\n\n    buySingle.href = cfg.linkSingle;\n    buyDouble.href = cfg.linkDouble;\n  }\n\n  function setActiveTab(m){\n    tabs.forEach(tab => {\n      const active = tab.dataset.mode === m;\n      tab.setAttribute('aria-checked', active ? 'true' : 'false');\n      tab.setAttribute('tabindex', active ? '0' : '-1');\n    });\n  }\n\n  function handleTab(tab){\n    const m = tab.dataset.mode;\n    setActiveTab(m);\n    applyMode(m);\n  }\n\n  function init(){\n    const tabArray = Array.from(tabs);\n    tabArray.forEach((tab, index) => {\n      tab.addEventListener('click', () => handleTab(tab));\n      \n      tab.addEventListener('keydown', e => {\n        let newIndex = index;\n        if (e.key === 'Enter' || e.key === ' ') {\n          e.preventDefault();\n          handleTab(tab);\n        } else if (e.key === 'ArrowRight' || e.key === 'ArrowDown') {\n          e.preventDefault();\n          newIndex = (index + 1) % tabArray.length;\n          tabArray[newIndex].focus();\n          handleTab(tabArray[newIndex]);\n        } else if (e.key === 'ArrowLeft' || e.key === 'ArrowUp') {\n          e.preventDefault();\n          newIndex = (index - 1 + tabArray.length) % tabArray.length;\n          tabArray[newIndex].focus();\n          handleTab(tabArray[newIndex]);\n        }\n      });\n    });\n\n    setActiveTab('junior');\n    applyMode('junior');\n  }\n\n  if (document.readyState === 'loading') {\n    document.addEventListener('DOMContentLoaded', init, { once:true });\n  } else {\n    init();\n  }\n})();\n<\/script>\n\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>ABADI DALAM SETIAP AKSI Dokumentasi aksi premium untuk bintang masa depan Indonesia \u2014 tajam, sinematik, dan berkelas profesional. RESERVASI PILIH KATEGORI U10 &amp; U12 U14 &amp; U16 1 Pertandingan Dokumentasi penuh seluruh aksi tim Anda dalam 1 laga pilihan. 135K Harga per laga 135K Jika butuh 2 laga 270K Perbandingan Lebih hemat di paket 2 [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-21192","page","type-page","status-publish","hentry"],"blocksy_meta":[],"acf":[],"_links":{"self":[{"href":"https:\/\/malangutd.com\/en\/wp-json\/wp\/v2\/pages\/21192","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/malangutd.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/malangutd.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/malangutd.com\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/malangutd.com\/en\/wp-json\/wp\/v2\/comments?post=21192"}],"version-history":[{"count":0,"href":"https:\/\/malangutd.com\/en\/wp-json\/wp\/v2\/pages\/21192\/revisions"}],"wp:attachment":[{"href":"https:\/\/malangutd.com\/en\/wp-json\/wp\/v2\/media?parent=21192"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}