/* HBT FORCE — hbt.css (diisi section demi section) */

/* ══════════════════════════════════════════════════════════════
   FASA 7 — HEADER · FOOTER · CTA  (27 Okt 2026)
   Prefix .breakdance supaya menang ke atas CSS element Breakdance
   (fail ni dimuat SELEPAS CSS Breakdance).
   ══════════════════════════════════════════════════════════════ */
:root{
  --hbt-gold:#D4AF37;--hbt-ink:#0E0F11;--hbt-on-dark:#F1F1EF;--hbt-on-dark-2:rgba(241,241,239,.72);
  --hbt-gold-shine:linear-gradient(180deg,#f9e6a3 0%,#d4af37 45%,#a8791f 100%);
  --hbt-gold-text:linear-gradient(180deg,#e9c55c 0%,#c99a2e 48%,#8f701d 100%);
  --hbt-gold-line:linear-gradient(90deg,transparent 0%,#D4AF37 14%,#fff3c4 50%,#D4AF37 86%,transparent 100%);
  --hbt-e:cubic-bezier(.16,1,.3,1);
  --hbt-fd:'Archivo HBT','Noto Sans SC',sans-serif;--hbt-fb:'Inter HBT','Noto Sans SC',sans-serif;
}
/* teks emas dalam tajuk (<span class="mute">) */
.mute{background:var(--hbt-gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-bottom:.08em}
.hbt-cta .mute,.hbt-ft .mute{background:var(--hbt-gold-shine);-webkit-background-clip:text;background-clip:text}
/* tagline italic (klien 27 Okt) — sandaran kalau control Style tiada */
.breakdance .hbt-tagline{font-style:italic}

/* ── HEADER ─────────────────────────────────────────── */
.breakdance .bde-header-builder.hbt-nav{position:sticky;top:var(--wp-admin--admin-bar--height,0px);z-index:900;
  border-bottom:1px solid rgba(241,241,239,.14)}
.hbt-nav::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;z-index:3;pointer-events:none;background:var(--hbt-gold-line)}
.breakdance .hbt-brand{margin-right:auto}
@media(min-width:1120px){.breakdance .hbt-brand{flex-shrink:0}.breakdance .hbt-brand__name,.breakdance .hbt-brand__tag{white-space:nowrap}}
/* saiz brand berperingkat ikut design (1120–1220px) */
@media(min-width:1120px) and (max-width:1220px){
  .breakdance .hbt-brand{gap:13px}
  .breakdance img.hbt-brand__mark{height:60px}
  .breakdance .hbt-brand__name{font-size:19.2px}
  .breakdance .hbt-brand__tag{font-size:10.4px;letter-spacing:.12em}
}
@media(min-width:1221px){.breakdance .hbt-brand__name{font-size:22.4px}.breakdance .hbt-brand__tag{font-size:11.84px;letter-spacing:.14em}}

/* Menu desktop (≥1120px). Burger ≤1119px = Mobile Menu Breakdance. */
@media(min-width:1120px){
  .breakdance .hbt-menu .breakdance-menu-list{align-items:center;gap:8px}
  .breakdance .hbt-menu .breakdance-menu-item>.breakdance-menu-link{position:relative;overflow:hidden;
    display:inline-flex;align-items:center;height:35px;line-height:1;padding:0 9px;border-radius:10px;
    font-family:var(--hbt-fd);font-weight:600;font-size:16px;letter-spacing:0;text-transform:uppercase;
    color:var(--hbt-on-dark-2);white-space:nowrap;
    transition:color .3s var(--hbt-e),background .3s var(--hbt-e),box-shadow .35s var(--hbt-e)}
  .breakdance .hbt-menu .breakdance-menu-item>.breakdance-menu-link:hover{color:var(--hbt-on-dark)}
  /* pil emas — page semasa */
  .breakdance .hbt-menu .current-menu-item>.breakdance-menu-link{background:var(--hbt-gold-shine);color:var(--hbt-ink);
    box-shadow:0 8px 20px -10px rgba(212,175,55,.6);padding:0 12px;margin:0 -3px}
  .breakdance .hbt-menu .current-menu-item>.breakdance-menu-link::after{content:'';position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.65) 48%,transparent 66%);
    transform:translateX(-140%);transition:transform .85s var(--hbt-e)}
  .breakdance .hbt-menu .current-menu-item>.breakdance-menu-link:hover{color:var(--hbt-ink)}
  .breakdance .hbt-menu .current-menu-item>.breakdance-menu-link:hover::after{transform:translateX(140%)}
}
@media(min-width:1120px) and (max-width:1366px){.breakdance .hbt-menu .breakdance-menu-list{gap:4px}
  .breakdance .hbt-menu .current-menu-item>.breakdance-menu-link{margin:0;padding:0 9px}}
@media(min-width:1120px) and (max-width:1160px){.breakdance .hbt-menu .breakdance-menu-item>.breakdance-menu-link{font-size:11.5px;padding:0 5px}}
@media(min-width:1161px) and (max-width:1220px){.breakdance .hbt-menu .breakdance-menu-item>.breakdance-menu-link{font-size:12px;padding:0 6px}}
@media(min-width:1221px) and (max-width:1260px){.breakdance .hbt-menu .breakdance-menu-item>.breakdance-menu-link{font-size:12.5px;padding:0 5px}}
@media(min-width:1261px) and (max-width:1299px){.breakdance .hbt-menu .breakdance-menu-item>.breakdance-menu-link{font-size:13px;padding:0 6px}}
@media(min-width:1300px) and (max-width:1366px){.breakdance .hbt-menu .breakdance-menu-item>.breakdance-menu-link{font-size:14px;padding:0 7px}}
/* Item Language switcher Polylang (jika masih ada dalam menu) — tak dipakai */
.breakdance .hbt-menu .lang-item{display:none!important}

/* Butang carian (bulat 40px) + overlay */
.breakdance .hbt-search .search-form__button--full-screen{width:40px;height:40px;padding:0;border-radius:50%;
  display:grid;place-items:center;color:var(--hbt-on-dark);background:rgba(241,241,239,.06);
  border:1px solid rgba(241,241,239,.14);cursor:pointer;
  transition:background .35s var(--hbt-e),color .35s var(--hbt-e),border-color .35s var(--hbt-e)}
.breakdance .hbt-search .search-form__button--full-screen:hover{background:var(--hbt-gold-shine);color:var(--hbt-ink);border-color:transparent}
.breakdance .hbt-search .search-form__button--full-screen svg{width:17px;height:17px;min-width:0}
.breakdance .hbt-search .search-form__lightbox-bg{background:rgba(9,10,8,.74);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.breakdance .hbt-search .search-form__lightbox-container{width:min(720px,88vw);margin:0 auto;gap:14px;
  background:#F7F7F5;border:0;border-radius:999px;padding:12px 30px;box-shadow:0 40px 90px -30px rgba(0,0,0,.5)}
.breakdance .hbt-search .search-form__lightbox-container:focus-within{border:0;box-shadow:0 40px 90px -30px rgba(0,0,0,.5)}
.breakdance .hbt-search .search-form__lightbox-container .search-form__field{background:transparent;border:0;outline:0;
  font-family:var(--hbt-fb);font-size:1.2rem;color:var(--hbt-ink)}
.breakdance .hbt-search .search-form__lightbox-container .search-form__field::placeholder{color:rgba(14,15,17,.4)}
.breakdance .hbt-search .search-form__lightbox-button{color:#5B5D62}
.breakdance .hbt-search .search-form__lightbox-close{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
  font-size:18px;background:rgba(241,241,239,.12);color:var(--hbt-on-dark);transition:background .3s var(--hbt-e),color .3s var(--hbt-e)}
.breakdance .hbt-search .search-form__lightbox-close:hover{background:var(--hbt-gold);color:var(--hbt-ink)}

/* Pil bahasa (dropdown) — Code Block 🧩 01-header-pil-bahasa.php */
.hbt-lang{position:relative;width:86px;height:40px;z-index:5;font-family:var(--hbt-fb)}
.hbt-lang__btn{position:absolute;left:0;right:0;z-index:1;display:none;align-items:center;height:36px;
  padding:0 14px;border:0;border-radius:9px;background:transparent;font:inherit;font-size:.7rem;font-weight:500;
  letter-spacing:.1em;color:var(--hbt-on-dark-2);text-decoration:none;white-space:nowrap;cursor:pointer;
  -webkit-tap-highlight-color:transparent}
.hbt-lang__btn[lang^="zh"]{letter-spacing:0;font-size:.75rem}
.hbt-lang__btn.is-active{display:flex;top:0;height:40px;padding:0 30px 0 16px;border-radius:999px;
  border:1px solid rgba(241,241,239,.16);background:rgba(241,241,239,.06);color:var(--hbt-on-dark);font-weight:600}
.hbt-lang__btn.is-active::after{content:'';position:absolute;right:14px;top:50%;width:6px;height:6px;
  border-right:1.5px solid var(--hbt-gold);border-bottom:1.5px solid var(--hbt-gold);
  transform:translateY(-70%) rotate(45deg);transition:transform .3s var(--hbt-e)}
.hbt-lang::after{content:'';position:absolute;left:-6px;right:-6px;top:40px;height:94px;border-radius:12px;
  background:#141416;border:1px solid rgba(212,175,55,.32);box-shadow:0 18px 40px -16px rgba(0,0,0,.6);display:none;z-index:0}
.hbt-lang:is(:hover,:focus-within)::after,.hbt-lang:is(:hover,:focus-within) .hbt-lang__btn{display:flex}
.hbt-lang:is(:hover,:focus-within)::after{display:block}
.hbt-lang:is(:hover,:focus-within) .hbt-lang__btn.is-active::after{transform:translateY(-30%) rotate(-135deg)}
.hbt-lang__btn[data-pos="1"]{top:47px}
.hbt-lang__btn[data-pos="2"]{top:87px}
.hbt-lang a.hbt-lang__btn:hover{color:var(--hbt-gold);background:rgba(241,241,239,.05)}
@media(min-width:921px) and (max-width:1000px){.hbt-lang{width:74px}.hbt-lang__btn.is-active{padding:0 24px 0 12px}.hbt-lang__btn.is-active::after{right:10px}}
@media(max-width:640px){.breakdance .hbt-lang{display:none}}

/* ── CTA (Global Block) ─────────────────────────────── */
.breakdance .bde-section.hbt-cta{overflow:hidden;isolation:isolate}
.breakdance .hbt-cta>.section-container{position:static}
.breakdance .hbt-cta .hbt-cta-fx{position:absolute;inset:0;margin:0;width:auto;max-width:none;pointer-events:none;z-index:0}
.breakdance .hbt-cta .hbt-cta-in{position:relative;z-index:1}
.hbt-cta-line{position:absolute;left:0;right:0;top:0;height:2px;z-index:3;background:var(--hbt-gold-line)}
.hbt-cta-grid{position:absolute;inset:0;
  background-image:linear-gradient(rgba(241,241,239,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(241,241,239,.06) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.85),transparent 82%);mask-image:linear-gradient(180deg,rgba(0,0,0,.85),transparent 82%)}
.hbt-cta-grid::after{content:'';position:absolute;right:-14%;bottom:-22%;width:56%;height:76%;
  background:linear-gradient(135deg,transparent 46%,rgba(212,175,55,.14) 50%,transparent 54%);filter:blur(1px)}
/* radar (juga dipakai Sectors Home, Fasa 9) */
.radar{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:max(150%,1500px);aspect-ratio:1/1;
  z-index:0;pointer-events:none;opacity:.4;
  -webkit-mask-image:radial-gradient(circle,#000 62%,transparent 94%);mask-image:radial-gradient(circle,#000 62%,transparent 94%)}
.radar__ring{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(241,241,239,.12)}
.radar__ring--2{inset:14%}.radar__ring--3{inset:30%}.radar__ring--4{inset:44%}
.radar__sweep{position:absolute;inset:0;border-radius:50%;transform-origin:center;
  background:conic-gradient(from 0deg,rgba(212,175,55,.6) 0deg,transparent 34deg,transparent 360deg);
  animation:hbtRadar 10s linear infinite}
@keyframes hbtRadar{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.radar__sweep{animation:none}}

/* ── FOOTER ─────────────────────────────────────────── */
.breakdance .hbt-ft>.section-container::before{content:'';position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--hbt-gold),transparent);opacity:.7}
.breakdance .hbt-ft .mute{display:block}
.hbt-ft-ct{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:12px;color:var(--hbt-on-dark-2)}
.hbt-ft-ct li{display:flex;gap:14px;align-items:flex-start;font-size:17px;line-height:1.55}
.hbt-ft-ct svg{width:20px;height:20px;flex:0 0 auto;margin-top:3px;color:var(--hbt-gold)}
.hbt-ft-ct a{color:var(--hbt-on-dark);text-decoration:none;transition:color .3s}
.hbt-ft-ct a:hover{color:var(--hbt-gold)}
.hbt-ft-ct i{font-style:normal;opacity:.4;margin:0 10px}
.hbt-ft-ct address{font-style:normal;max-width:44ch}
.hbt-ft-so{display:flex;flex-wrap:wrap;gap:12px}
.hbt-ft-so a{width:50px;height:50px;border-radius:12px;display:grid;place-items:center;
  background:rgba(212,175,55,.12);color:var(--hbt-gold);transition:background .3s,color .3s}
.hbt-ft-so a:hover{background:var(--hbt-gold-shine);color:var(--hbt-ink)}
.hbt-ft-so svg{width:20px;height:20px}
.breakdance .hbt-ft-b{width:100%;margin-top:clamp(44px,5vw,64px);padding-top:24px;border-top:1px dashed rgba(241,241,239,.14)}
/* Fasa 7 — pembetulan selepas ujian (27 Okt) */
.breakdance .hbt-lang a.hbt-lang__btn{color:var(--hbt-on-dark-2)}
.breakdance .hbt-lang a.hbt-lang__btn:hover{color:var(--hbt-gold);background:rgba(241,241,239,.05)}
@media(max-width:1119px){.breakdance .hbt-nav .hbt-menu{order:3}.breakdance .hbt-nav .hbt-nav__right{margin-left:auto}}

/* Fasa 7 — padanan dengan rujukan v1-fullblack (27 Okt) */
/* Lebar & gutter container ikut design (.wrap 1380px, gutter clamp) — Global Settings masih 1120/20/100 */
:root{--bde-section-width:1380px;--bde-section-horizontal-padding:clamp(22px,4.5vw,56px);--bde-section-vertical-padding:clamp(104px,13vw,180px)}
.breakdance .hbt-nav{--bde-header-width:1380px}
.breakdance .hbt-nav .bde-header-builder__container{padding-left:clamp(22px,4.5vw,56px);padding-right:clamp(22px,4.5vw,56px)}
/* Saiz brand berperingkat — sama dengan style.css rujukan */
@media(min-width:1101px) and (max-width:1119px){
  .breakdance img.hbt-brand__mark{height:60px}.breakdance .hbt-brand{gap:13px}
  .breakdance .hbt-brand__name{font-size:19.2px}.breakdance .hbt-brand__tag{font-size:10.4px;letter-spacing:.12em}}
@media(min-width:1001px) and (max-width:1100px){
  .breakdance img.hbt-brand__mark{height:44px}.breakdance .hbt-brand{gap:10px}
  .breakdance .hbt-brand__name{font-size:14.4px}.breakdance .hbt-brand__tag{font-size:8.64px;letter-spacing:.05em}}
@media(min-width:921px) and (max-width:1000px){
  .breakdance img.hbt-brand__mark{height:40px}.breakdance .hbt-brand{gap:8px}
  .breakdance .hbt-brand__name{font-size:13.6px}.breakdance .hbt-brand__tag{font-size:8.64px;letter-spacing:.03em}}
@media(max-width:920px){
  .breakdance img.hbt-brand__mark{height:54px}.breakdance .hbt-brand{gap:12px}
  .breakdance .hbt-brand__name{font-size:16.96px}.breakdance .hbt-brand__tag{font-size:10px;letter-spacing:.14em}}

/* Fasa 7 — padanan v1-fullblack, pusingan 2 (27 Okt) */
/* tinggi nav: padding 18px semua saiz (Desktop 103px · ≤920 91px) */
.breakdance .hbt-nav .bde-header-builder__container{padding-top:18px;padding-bottom:18px}
/* butang carian & pil bahasa sebaris (Search Form asal 52px tinggi) */
.breakdance .hbt-search{height:40px;width:40px;display:flex;align-items:center;justify-content:center}
/* jarak ikon kanan ikut rujukan */
@media(max-width:920px){.breakdance .hbt-nav .bde-header-builder__container{gap:14px}.breakdance .hbt-nav__right{gap:14px}}
@media(min-width:921px) and (max-width:1100px){.breakdance .hbt-nav .bde-header-builder__container{gap:6px}.breakdance .hbt-nav__right{gap:6px}}
@media(min-width:1101px) and (max-width:1119px){.breakdance .hbt-nav .bde-header-builder__container{gap:8px}}
/* burger 24×2px, jarak 5px (rujukan .burger) */
.breakdance .hbt-menu .breakdance-menu{--toggle-layer-width:24px;--toggle-layer-height:2px;--toggle-layer-spacing:5px;--toggle-layer-border-radius:2px;--toggle-padding:6px;--toggle-layer-color:#F1F1EF;--toggle-layer-color-active:#F1F1EF}
/* Panel menu mobile ikut rujukan (.menu ≤1199px) */
@media(max-width:1119px){
  .breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-list{width:min(300px,80vw);padding:40px;gap:14px;justify-content:center;
    background:linear-gradient(180deg,#0A0A0C 0%,#000 100%);border-left:1px solid rgba(241,241,239,.14)}
  .breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-list>.breakdance-menu-item{border:0;width:100%}
  .breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-item>.breakdance-menu-link{border:0;border-radius:10px;padding:11px 15px;
    justify-content:center;text-align:center;line-height:1.7;background:transparent;box-shadow:none;
    font-family:var(--hbt-fd);font-weight:600;font-size:14.72px;letter-spacing:.1em;text-transform:uppercase;color:var(--hbt-on-dark-2);
    transition:color .3s var(--hbt-e),background .3s var(--hbt-e)}
  .breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-item>.breakdance-menu-link:hover{color:var(--hbt-on-dark)}
  .breakdance .hbt-menu .breakdance-menu--offcanvas .current-menu-item>.breakdance-menu-link{background:var(--hbt-gold-shine);color:var(--hbt-ink);
    box-shadow:0 8px 20px -10px rgba(212,175,55,.6)}
  .breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-topbar{position:absolute;top:0;left:0;right:0;padding:0;border:0;background:none;min-height:0}
  .breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-topbar-logo{display:none}
  .breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-close-button{position:absolute;top:22px;right:22px;width:44px;height:44px;padding:0;
    border:0;border-radius:50%;display:grid;place-items:center;font-size:24px;line-height:1;cursor:pointer;
    background:rgba(241,241,239,.12);color:var(--hbt-on-dark);transition:background .3s var(--hbt-e),color .3s var(--hbt-e)}
  .breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-close-button:hover{background:var(--hbt-gold);color:var(--hbt-ink)}
}
/* Pil bahasa 3 segmen dalam menu burger (≤640px) */
.hbt-lang-li{display:none;list-style:none}
@media(max-width:640px){.breakdance .hbt-menu .hbt-lang-li{display:flex;justify-content:center;width:100%;margin-top:26px;border:0}}
.hbt-lang-m{position:relative;display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;align-items:center;padding:4px;border-radius:999px;
  background:rgba(241,241,239,.06);border:1px solid rgba(241,241,239,.14)}
.hbt-lang-m__thumb{position:absolute;top:4px;left:4px;bottom:4px;width:calc((100% - 8px) / 3);border-radius:999px;z-index:0;
  background:var(--hbt-gold-shine);transition:transform .4s var(--hbt-e)}
.hbt-lang-m[data-active="ms"] .hbt-lang-m__thumb{transform:translateX(100%)}
.hbt-lang-m[data-active="zh"] .hbt-lang-m__thumb{transform:translateX(200%)}
.breakdance .hbt-lang-m__btn{position:relative;z-index:1;padding:6px 12px;border-radius:999px;text-align:center;white-space:nowrap;text-decoration:none;
  font-family:var(--hbt-fb);font-size:.625rem;font-weight:500;letter-spacing:.1em;line-height:1.7;color:rgba(241,241,239,.6);transition:color .35s var(--hbt-e)}
.breakdance .hbt-lang-m__btn[lang^="zh"]{letter-spacing:0;font-size:.7rem}
.breakdance .hbt-lang-m__btn.is-active{color:var(--hbt-ink);font-weight:700}
.breakdance a.hbt-lang-m__btn:hover{color:var(--hbt-gold)}
/* pusingan 3: butang ✕ panel + jarak ikon telefon */
@media(max-width:1119px){
  .breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-close-button{width:44px!important;height:44px!important;padding:0!important;top:22px!important;right:22px!important}
  .breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-close-button::before{width:15px!important;height:2px!important;background:var(--hbt-on-dark)!important}
  .breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-close-button::after{width:2px!important;height:15px!important;background:var(--hbt-on-dark)!important}
  .breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-close-button:hover::before,
  .breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-close-button:hover::after{background:var(--hbt-ink)!important}
}
@media(max-width:640px){.breakdance .hbt-nav__right>.bde-code-block{display:none}}
@media(max-width:1119px){.breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-close-button::before{left:14.5px!important}.breakdance .hbt-menu .breakdance-menu--offcanvas .breakdance-menu-close-button::after{top:14.5px!important}}
/* pusingan 4: overlay carian ikut rujukan (.search-ov) — ikon garis 2px, kotak 720×68, butang ✕ */
.hbt-search{--hbt-ic-search:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M21 21l-4.3-4.3' stroke-linecap='round'/%3E%3C/svg%3E")}
.breakdance .hbt-search .search-form__button--full-screen svg,.breakdance .hbt-search .search-form__lightbox-button svg{display:none}
.breakdance .hbt-search .search-form__button--full-screen::before,.breakdance .hbt-search .search-form__lightbox-button::before{content:'';display:block;
  width:18px;height:18px;background:currentColor;-webkit-mask:var(--hbt-ic-search) center/contain no-repeat;mask:var(--hbt-ic-search) center/contain no-repeat}
.breakdance .hbt-search .search-form__lightbox-container{gap:18px;padding:22px 30px}
.breakdance .hbt-search .search-form__lightbox-button{flex:0 0 22px;width:22px;height:22px;padding:0;background:none;border:0;color:#5B5D62}
.breakdance .hbt-search .search-form__lightbox-button::before{width:22px;height:22px}
.breakdance .hbt-search .search-form__lightbox-container .search-form__field{height:24px;padding:0;line-height:24px}
.breakdance .hbt-search .search-form__lightbox-close{top:calc(clamp(20px,3vw,40px) + var(--wp-admin--admin-bar--height,0px));right:clamp(20px,3vw,40px)}
.breakdance .hbt-search .search-form__lightbox-close svg{width:13px;height:13px;min-width:0}
/* ── FOOTER v2 — susun atur + tipografi penuh ikut .ft3 rujukan (27 Okt) ── */
.breakdance .bde-section.hbt-ft{background:radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%);color:var(--hbt-on-dark-2)}
.breakdance .hbt-ft>.section-container{padding-top:clamp(60px,6vw,84px);padding-bottom:30px;display:block}
.breakdance .hbt-ft-top{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,80px);align-items:stretch;width:100%}
.breakdance .hbt-ft-l{display:block}
.breakdance .hbt-ft-r{display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-start;text-align:right}
.breakdance .hbt-ft-brand{display:inline-flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:16px;width:auto;max-width:100%;color:var(--hbt-on-dark);text-decoration:none}
.breakdance .hbt-ft-logo,.breakdance img.hbt-ft-logo{width:100px;height:100px;object-fit:contain;flex:0 1 auto}
.breakdance .hbt-ft-name{display:block;margin:0;font-family:var(--hbt-fd);font-weight:800;font-size:32px;letter-spacing:-.03em;line-height:1.1;color:var(--hbt-on-dark)}
.breakdance .hbt-ft-tag{display:block;margin:4px 0 0;font-family:var(--hbt-fb);font-weight:600;font-size:16px;line-height:1.7;letter-spacing:.12em;text-transform:uppercase;font-style:italic;color:var(--hbt-gold)}
.breakdance .hbt-ft-k{display:block;margin:0;font-family:var(--hbt-fb);font-weight:600;font-size:13px;line-height:1.7;letter-spacing:.1em;text-transform:uppercase;color:var(--hbt-gold)}
.breakdance .hbt-ft-t{margin:8px 0 22px;font-family:var(--hbt-fd);font-weight:800;letter-spacing:-.045em;line-height:.98;color:var(--hbt-on-dark);font-size:clamp(2.4rem,4.6vw,4.4rem)}
.breakdance .hbt-ft-r .hbt-ft-so{justify-content:flex-end}
.breakdance .hbt-ft-b{margin-top:clamp(44px,5vw,64px);padding-top:24px;border-top:1px dashed rgba(241,241,239,.14)}
.breakdance .hbt-ft-copy{margin:0;font-family:var(--hbt-fb);font-size:14px;line-height:1.7;color:rgba(241,241,239,.45)}
@media(max-width:900px){
  .breakdance .hbt-ft-top{grid-template-columns:1fr;align-items:start}
  .breakdance .hbt-ft-r{align-items:flex-start;text-align:left}
  .breakdance .hbt-ft-r .hbt-ft-so{justify-content:flex-start}
  .breakdance .hbt-ft-logo,.breakdance img.hbt-ft-logo{width:72px;height:72px}
  .breakdance .hbt-ft-name{font-size:22px}
  .breakdance .hbt-ft-tag{font-size:12.5px}
  .hbt-ft-ct li{font-size:16px}
}

/* FOOTER fix (27 Okt 2026): Wrapper Link = baris, Code Block = block, teks brand tak paksa 100% */
.breakdance .hbt-ft-brand>.bde-div{display:block;width:auto;min-width:0;flex:0 1 auto}
.breakdance .hbt-ft-l>.bde-code-block,.breakdance .hbt-ft-r>.bde-code-block{display:block}
.breakdance .hbt-ft-b{display:block}

/* ── CTA v2 (27 Okt 2026) — ukur dari prototype FINAL (section.cta) ───────── */
.breakdance .bde-section.hbt-cta{position:relative;background:linear-gradient(109.6deg,rgba(5,5,6,.95) 11.2%,#35373B 78.9%);
  border-radius:18px 18px 0 0;text-align:center;color:var(--hbt-on-dark-2)}
.breakdance .hbt-cta>.section-container{display:block}
.breakdance .hbt-cta .hbt-cta-in{display:block;width:100%;max-width:calc(1100px - 2 * clamp(22px,4.5vw,56px));margin:0 auto}
.breakdance .hbt-cta-k{display:block;margin:0;font-family:var(--hbt-fb);font-weight:500;font-size:14px;line-height:1.7;
  letter-spacing:.14em;text-transform:uppercase;font-style:italic;color:var(--hbt-gold)}
.breakdance .hbt-cta-t{margin:26px 0 0;font-family:var(--hbt-fd);font-weight:800;font-size:clamp(2.6rem,6.6vw,5.8rem);
  line-height:.88;letter-spacing:-.038em;color:var(--hbt-on-dark)}
html:not([lang^="en"]) .breakdance .hbt-cta-t{text-wrap:balance}
html[lang^="zh"] .breakdance .hbt-cta-t{letter-spacing:0;line-height:1.12}
.hbt-cta-b{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:46px}
@media(max-width:600px){.breakdance .hbt-cta-k{font-size:12px;letter-spacing:.1em}}
/* butang (sama .btn prototype) */
.hbt-btn{position:relative;display:inline-flex;align-items:center;gap:12px;padding:15px 28px;border:0;border-radius:10px;
  font-family:var(--hbt-fb);font-size:15px;font-weight:600;line-height:1.7;letter-spacing:0;text-transform:uppercase;white-space:nowrap;
  text-decoration:none;cursor:pointer;overflow:hidden;isolation:isolate;will-change:transform}
.hbt-btn::before{content:'';position:absolute;inset:0;background:linear-gradient(109.6deg,rgba(5,5,6,.95) 11.2%,#35373B 78.9%);transform:scaleX(0);transform-origin:left;
  transition:transform .6s var(--hbt-e);z-index:-1}
.hbt-btn:hover::before,.hbt-btn:focus-visible::before{transform:scaleX(1)}
.hbt-btn:hover,.hbt-btn:focus-visible{color:var(--hbt-gold);box-shadow:inset 0 0 0 1px rgba(212,175,55,.55)}
.hbt-btn .ar{transition:transform .5s var(--hbt-e)}
.hbt-btn:hover .ar{transform:translateX(7px)}
.hbt-btn__wa{display:inline-flex;align-items:center}
.hbt-btn__wa svg{width:18px;height:18px;display:block}
.hbt-btn--gold{background:var(--hbt-gold-shine);color:var(--hbt-ink)}
.hbt-btn--gold::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.65) 48%,transparent 66%);
  transform:translateX(-140%);transition:transform .85s var(--hbt-e)}
.hbt-btn--gold:hover::after{transform:translateX(140%)}
.hbt-btn--o-light{background:transparent;color:var(--hbt-on-dark);box-shadow:inset 0 0 0 2px rgba(241,241,239,.4)}
@media(max-width:480px){.hbt-btn{padding:14px 20px;gap:10px}}
/* CTA fix: tengah + Code Block block + tinggi baris kicker = baris 16px prototype */
.breakdance .hbt-cta .hbt-cta-in,.breakdance .hbt-cta .hbt-cta-k,.breakdance .hbt-cta .hbt-cta-t{text-align:center}
.breakdance .hbt-cta-in>.bde-code-block{display:block}
.breakdance .hbt-cta-k{line-height:27.2px}
/* Butang: menang ke atas `.breakdance a` (warna Links Breakdance) */
.breakdance a.hbt-btn--gold{color:var(--hbt-ink)}
.breakdance a.hbt-btn--o-light{color:var(--hbt-on-dark)}
.breakdance a.hbt-btn:hover,.breakdance a.hbt-btn:focus-visible{color:var(--hbt-gold)}
/* Hover butang dalam section GELAP (prototype: [data-theme="dark"] .btn — style.css 1670–1673):
   sapuan On Dark, teks Text, tiada garis. Section gelap Breakdance = .hbt-cta, .hbt-ft, atau tambah class .hbt-dark (Fasa 9/10). */
:is(.hbt-cta,.hbt-ft,.hbt-dark) .hbt-btn::before{background:var(--hbt-on-dark)}
.breakdance :is(.hbt-cta,.hbt-ft,.hbt-dark) a.hbt-btn:hover,.breakdance :is(.hbt-cta,.hbt-ft,.hbt-dark) a.hbt-btn:focus-visible{color:var(--hbt-ink);box-shadow:none}

/* ══════════════════════════════════════════════════════════════
   FASA 8 — Global Blocks item loop (27 Okt 2026)
   Port 1:1 dari prototype FINAL (v1-fullblack) css/style.css.
   ══════════════════════════════════════════════════════════════ */

/* ── Sector Card (style.css 787–825, 1883–1887) — diukur Playwright 1440px ──
   Section Sectors (Fasa 9) mesti ada class hbt-dark → hover butang On Dark. */
.breakdance .hbt-sec{width:100%;height:100%;display:flex;flex-direction:column;align-items:stretch;
  border:1px solid transparent;border-radius:18px;overflow:hidden;
  background:radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%) padding-box,
             linear-gradient(180deg,#f9e6a3 0%,#d4af37 45%,#a8791f 100%) border-box}
.breakdance .hbt-sec__media{display:block;position:relative;width:100%;aspect-ratio:16/9;overflow:hidden}
.breakdance .hbt-rv{position:absolute;inset:0;overflow:hidden;clip-path:inset(0 0 0% 0)}
.breakdance .hbt-rv>.bde-image,.breakdance .hbt-rv .breakdance-image,
.breakdance .hbt-rv .breakdance-image-container,.breakdance .hbt-rv .breakdance-image-clip{position:static;overflow:visible;max-width:none}
.breakdance .hbt-rv img{position:absolute;inset:0;width:100%;height:112%;max-width:none;object-fit:cover;
  will-change:transform;filter:saturate(1.05) contrast(1.05) brightness(.94)}
.breakdance .hbt-sec__body{flex:1;display:flex;flex-direction:column;align-items:stretch;width:100%;
  padding:clamp(24px,2.6vw,32px);color:rgba(241,241,239,.72)}
.breakdance .hbt-sec__meta{margin:0 0 12px;color:var(--hbt-gold);font-family:var(--hbt-fb);font-weight:500;
  font-size:13px;line-height:27.2px;letter-spacing:.06em;text-transform:uppercase;font-variant-numeric:tabular-nums}
.breakdance .hbt-sec__t{color:var(--hbt-on-dark);margin:0 0 12px;font-family:var(--hbt-fd);font-weight:800;
  font-size:clamp(1.2rem,1.8vw,1.5rem);line-height:1.05;letter-spacing:-.025em}
.breakdance .hbt-sec__d{max-width:38ch;margin:0 0 26px;font-family:var(--hbt-fb);font-size:17px;line-height:1.55;color:rgba(241,241,239,.72)}
.breakdance .hbt-sec__b{display:block;margin-top:auto;align-self:flex-start}
@media(max-width:600px){.breakdance .hbt-sec__meta{font-size:12px;letter-spacing:.04em}}

/* ── Logo Cell (Clients: style.css 1305–1323, 1784–1786, 1913–1914 · Partners: 1374–1390, 1940–1942) ──
   Default = Clients. Section Partners (Fasa 9) beri class hbt-prt → logo ikut .prt__logo.
   Garis atas/kiri grid diletak pada Repeater Field (Fasa 9). */
.breakdance .hbt-lc{width:100%;height:100%;border-right:1px solid rgba(14,15,17,.14);border-bottom:1px solid rgba(14,15,17,.14);
  padding:clamp(20px,2vw,26px) clamp(14px,1.4vw,20px);display:flex;flex-direction:column;
  align-items:center;text-align:center;gap:14px;transition:background .4s var(--hbt-e)}
.breakdance .hbt-lc:hover{background:rgba(212,175,55,.07)}
.breakdance .hbt-lc__logo{width:100%;height:112px;display:grid;place-items:center;border-radius:6px}
.breakdance .hbt-lc__cb{display:contents}
.breakdance .hbt-lc__logo .bde-image,.breakdance .hbt-lc__logo .breakdance-image,
.breakdance .hbt-lc__logo .breakdance-image-container,.breakdance .hbt-lc__logo .breakdance-image-clip{display:contents}
.breakdance .hbt-lc__logo img{height:80px;width:auto;max-width:80%;max-height:none;object-fit:contain}
.breakdance .hbt-lc__n{font-family:var(--hbt-fb);font-size:15px;line-height:1.35;letter-spacing:0;color:#5B5D62;min-height:calc(1.45em*2);text-align:center}
@media(max-width:700px){.breakdance .hbt-lc__logo{height:90px}.breakdance .hbt-lc__logo img{height:62px}}
@media(max-width:600px){.breakdance .hbt-lc__n{font-size:14px}}
/* Partners */
.breakdance .hbt-prt .hbt-lc__logo{height:clamp(120px,17vw,168px)}
.breakdance .hbt-prt .hbt-lc__logo img{height:auto;width:auto;max-width:88%;max-height:78%}

/* ── Licence Card (style.css 1469–1477, 1924–1938) — diukur Playwright 1440px. Tiada hover (Desa). ──
   Lebar kad clamp(178px,20vw,244px) = tetapan slider Repeater Field (Fasa 9). */
.breakdance .hbt-lic{width:100%;display:flex;flex-direction:column;align-items:stretch;gap:0;margin:0;
  background:#fff;border:1px solid rgba(212,175,55,.45);border-radius:10px;padding:12px 12px 16px}
.breakdance .hbt-lic .bde-image,.breakdance .hbt-lic .breakdance-image,
.breakdance .hbt-lic .breakdance-image-container,.breakdance .hbt-lic .breakdance-image-clip{display:block;width:100%;max-width:none;overflow:visible}
.breakdance .hbt-lic img{display:block;width:100%;height:auto;max-width:none;aspect-ratio:3/4;object-fit:cover;object-position:top center;
  border-radius:4px;box-shadow:inset 0 0 0 1px rgba(14,15,17,.14);filter:grayscale(.28)}
.breakdance .hbt-lic__n{margin-top:14px;padding:0 4px;font-family:var(--hbt-fd);font-weight:700;letter-spacing:-.02em;
  font-size:16px;line-height:1.3;color:var(--hbt-ink)}
.breakdance .hbt-lic__m{margin-top:4px;padding:0 4px;font-family:var(--hbt-fb);font-weight:500;font-size:12px;line-height:1.35;
  letter-spacing:.04em;text-transform:uppercase;font-variant-numeric:tabular-nums;color:#5B5D62}

/* ── Branch Data (style.css 1113, 1265–1282, 1893–1911) ──
   Desktop: tersorok (data untuk peta). ≤700px: rel kad swipe — container Repeater Field (Fasa 9) beri ID branchData + class hbt-brd.
   Baris tel + Directions (.hbt-brd__row) ditambah hbt.js (Fasa 9). */
.breakdance .hbt-brd{display:none}
.breakdance .hbt-brd__i .hbt-brd__tel{display:none}
@media(max-width:700px){
  .breakdance .hbt-brd__i{width:100%;height:100%;display:flex;flex-direction:column;position:relative;overflow:hidden;
    padding:20px 20px 18px 22px;border-radius:10px;background:#F7F7F5;
    border:1px solid rgba(14,15,17,.08);transition:border-color .3s var(--hbt-e),box-shadow .3s var(--hbt-e)}
  .breakdance .hbt-brd__i::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--hbt-gold-shine)}
  .breakdance .hbt-brd__i.is-on{border-color:rgba(212,175,55,.65);box-shadow:0 14px 34px -22px rgba(14,15,17,.45)}
  .breakdance .hbt-brd__tag{font-family:var(--hbt-fb);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
    color:#8F701D;margin-bottom:8px;line-height:1.7}
  .breakdance .hbt-brd__name{font-family:var(--hbt-fd);font-weight:800;font-size:19px;letter-spacing:-.03em;line-height:1.1;color:var(--hbt-ink)}
  .breakdance .hbt-brd__addr{margin-top:10px;font-family:var(--hbt-fb);font-size:15px;line-height:1.6;color:#5B5D62}
  .breakdance .hbt-brd__row{margin-top:14px;padding-top:12px;border-top:1px solid rgba(14,15,17,.08);
    display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
  .breakdance a.hbt-brd__telv{font-family:var(--hbt-fb);font-size:15px;color:var(--hbt-ink);text-decoration:none}
  .breakdance .hbt-brd__telv small{font-size:11px;opacity:.5;margin-left:4px}
  .breakdance a.hbt-brd__go{display:inline-flex;align-items:center;gap:6px;margin-left:auto;color:#8F701D;font-family:var(--hbt-fb);
    font-size:13px;font-weight:500;letter-spacing:0;text-transform:uppercase;text-decoration:none}
}
.breakdance .hbt-brd__cb{display:block;width:100%}

/* ── Office Card (contact.css 47–55, 96–102) — diukur Playwright 1440px ──
   Grid 4/3/2/1 lajur = Repeater Field (Fasa 10, Contact). */
.breakdance .hbt-of__cb{display:block;width:100%;height:100%}
.breakdance .hbt-of__i{height:100%;background:#fff;border:1px solid rgba(212,175,55,.45);border-radius:18px;padding:22px 22px 18px;
  display:flex;flex-direction:column;font-family:var(--hbt-fb);font-size:17px;line-height:1.7;color:#5B5D62}
.breakdance .hbt-of__tg{display:block;font-size:12px;line-height:1.7;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:#8F701D}
.breakdance .hbt-of__n{margin:6px 0 0;font-family:var(--hbt-fd);font-weight:800;font-size:19px;letter-spacing:-.02em;color:var(--hbt-ink);line-height:1.2}
.breakdance .hbt-of__a{margin:8px 0 16px;font-size:15px;line-height:1.55;color:#5B5D62}
.breakdance .hbt-of__ft{margin-top:auto;padding-top:14px;border-top:1px solid rgba(14,15,17,.14);display:flex;align-items:center;gap:10px;font-size:15px;line-height:1.7}
.breakdance a.hbt-of__t{color:var(--hbt-ink);text-decoration:none}
.breakdance a.hbt-of__go{margin-left:auto;font-size:13px;font-weight:600;text-transform:uppercase;color:#8F701D;text-decoration:none}
.breakdance .hbt-of__go .ar{transition:transform .35s var(--hbt-e)}
.breakdance .hbt-of__go:hover .ar{transform:translateX(4px)}
.breakdance .hbt-of__i.is-hq{background:radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%);border-color:var(--hbt-gold);box-shadow:none}
.breakdance .hbt-of__i.is-hq .hbt-of__tg{color:var(--hbt-gold)}
.breakdance .hbt-of__i.is-hq .hbt-of__n{color:var(--hbt-on-dark)}
.breakdance .hbt-of__i.is-hq .hbt-of__a{color:var(--hbt-on-dark-2)}
.breakdance .hbt-of__i.is-hq .hbt-of__ft{border-top-color:rgba(241,241,239,.14)}
.breakdance .hbt-of__i.is-hq a.hbt-of__t{color:var(--hbt-on-dark)}
.breakdance .hbt-of__i.is-hq a.hbt-of__go{color:var(--hbt-gold)}

/* ── Person Card (about.css 92–103, 157–167) — diukur Playwright 1440px ──
   Default = Board (3 lajur). Pane Management (Fasa 10) beri class hbt-team → saiz kecil. */
.breakdance .hbt-pk__cb{display:block;width:100%}
.breakdance .hbt-pk{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:9/10;background:linear-gradient(180deg,#F2EFE7,#E9E4D8)}
.breakdance .hbt-pk__img{display:block;width:100%;height:100%;max-width:none;object-fit:cover}
.breakdance .hbt-pk__face{position:absolute;inset:0;display:grid;place-items:center;color:rgba(14,15,17,.14)}
.breakdance .hbt-pk__face svg{width:34%;margin-top:-12%}
.breakdance .hbt-pk__t{position:absolute;left:0;right:0;bottom:0;padding:90px 28px 26px;color:#fff;font-family:var(--hbt-fb);line-height:1.7;
  background:linear-gradient(180deg,rgba(14,15,17,0) 0%,rgba(14,15,17,.35) 45%,rgba(14,15,17,.72) 100%)}
.breakdance .hbt-pk__t b{display:block;font-family:var(--hbt-fd);font-weight:800;letter-spacing:-.025em;font-size:clamp(1.15rem,1.7vw,1.6rem);line-height:1.15}
.breakdance .hbt-pk__t span{display:block;margin-top:6px;font-size:17px;color:rgba(255,255,255,.82)}
.breakdance .hbt-pk__t span.tbc{color:var(--hbt-gold)}
.breakdance .hbt-team .hbt-pk__t{padding:70px 22px 20px}
.breakdance .hbt-team .hbt-pk__t b{font-size:clamp(1rem,1.3vw,1.2rem)}
@media(max-width:560px){
  .breakdance .hbt-pk__t b{font-size:1.25rem}
  .breakdance .hbt-team .hbt-pk__t{padding:50px 14px 14px}
  .breakdance .hbt-team .hbt-pk__t b{font-size:17px}
}

/* ── Side Link + Event Link (services.css 62–78, 128 · gallery.css 111–116, 151–154) — diukur Playwright 1440px ──
   Panel hitam (Petrol 1, radius 22px, padding 10px, gap 6px; Gallery max-height 420px + scroll) = Fasa 10. */
.breakdance .hbt-side__cb,.breakdance .hbt-gl-link__cb{display:block;width:100%}
.breakdance a.hbt-side,.breakdance a.hbt-gl-link{position:relative;display:flex;align-items:center;
  padding:15px 40px 15px 18px;border-radius:14px;font-family:var(--hbt-fb);font-size:17px;font-weight:500;
  color:var(--hbt-on-dark-2);text-decoration:none;transition:background .35s,color .3s,box-shadow .35s}
.breakdance a.hbt-side{justify-content:space-between;line-height:1.7;white-space:nowrap}
html:not([lang^="en"]) .breakdance a.hbt-side{white-space:normal;line-height:1.3}
.breakdance a.hbt-gl-link{line-height:1.3}
.breakdance a.hbt-side::after,.breakdance a.hbt-gl-link::after{content:'\2192';position:absolute;right:16px;top:50%;margin-top:-.75em;line-height:1.5;
  opacity:0;transform:translateX(-6px);transition:opacity .3s,transform .4s var(--hbt-e)}
.breakdance a.hbt-side:hover,.breakdance a.hbt-gl-link:hover{background:rgba(255,255,255,.06);color:var(--hbt-on-dark)}
.breakdance a.hbt-side.on,.breakdance a.hbt-gl-link.on{background:var(--hbt-gold-shine);color:var(--hbt-ink);font-weight:600;
  box-shadow:0 10px 24px -12px rgba(212,175,55,.55)}
.breakdance a.hbt-side.on::after,.breakdance a.hbt-gl-link.on::after{opacity:1;transform:none}

/* ── Service Article (services.css 19–21, 33–44, 79–128 · training.css 20–31) — diukur Playwright 1440px ──
   Jarak antara artikel (.sv-i + .sv-i: padding-top + garis atas) = Fasa 10 (item wrapper Repeater). */
.breakdance .hbt-svi__cb{display:block;width:100%}
.breakdance .hbt-svi{padding-bottom:clamp(64px,8vw,110px);scroll-margin-top:calc(var(--hbt-nav-h,100px) + 28px);
  display:grid;grid-template-columns:1fr clamp(150px,16vw,220px);column-gap:clamp(22px,2.6vw,36px);row-gap:0;
  grid-template-areas:"t img" "p img" "f f" "c c";grid-template-rows:auto 1fr auto auto;align-items:start}
.breakdance .hbt-svi__b{display:contents}
.breakdance .hbt-svi__t{grid-area:t;align-self:start;margin:4px 0 0;font-family:var(--hbt-fd);font-weight:800;letter-spacing:-.035em;
  line-height:1.02;color:var(--hbt-ink);font-size:clamp(1.8rem,3.2vw,2.8rem)}
.breakdance .hbt-svi__img{grid-area:img;aspect-ratio:1/1;margin:0;border-radius:20px;overflow:hidden}
.breakdance .hbt-svi__img img{display:block;width:100%;height:100%;max-width:none;object-fit:cover}
.breakdance .hbt-svi__b>p{grid-area:p;align-self:start;margin:14px 0 0;font-family:var(--hbt-fb);font-size:17px;line-height:1.7;color:#5B5D62}
.breakdance .hbt-svi__b>ul{grid-area:f;list-style:none;padding:0;margin:30px 0 0}
.breakdance .hbt-svi__b>ul li{display:flex;gap:12px;align-items:baseline;padding:11px 0;border-bottom:1px solid rgba(14,15,17,.14);
  color:var(--hbt-ink);font-family:var(--hbt-fb);font-size:17px;line-height:1.5;margin:0}
.breakdance .hbt-svi__b>ul li:first-child{border-top:1px solid rgba(14,15,17,.14)}
.breakdance .hbt-svi__b>ul li::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--hbt-gold);flex:0 0 auto;transform:translateY(-2px)}
.breakdance .hbt-svi__cta{grid-area:c;margin-top:30px;display:flex;gap:12px;flex-wrap:wrap}
@media(max-width:900px){
  .breakdance .hbt-svi{grid-template-columns:1fr;grid-template-areas:"img" "t" "p" "f" "c";grid-template-rows:none}
  .breakdance .hbt-svi__img{aspect-ratio:16/10;margin-bottom:22px}
}
/* butang WhatsApp outline emas (.sv-btn-o) */
.breakdance a.hbt-btn--o-gold{background:transparent;color:#8F701D;box-shadow:inset 0 0 0 1.5px var(--hbt-gold)}
.breakdance .hbt-btn--o-gold::before{background:var(--hbt-gold-shine)}
.breakdance a.hbt-btn--o-gold:hover,.breakdance a.hbt-btn--o-gold:focus-visible{color:var(--hbt-ink);box-shadow:inset 0 0 0 1.5px var(--hbt-gold)}
/* CCTV: senarai projek (.sv-proj) */
.breakdance .hbt-svi#cctv{grid-template-areas:"t img" "p img" "f f" "pr pr" "c c"}
@media(max-width:900px){.breakdance .hbt-svi#cctv{grid-template-areas:"img" "t" "p" "f" "pr" "c"}}
.breakdance .hbt-svi .sv-proj{grid-area:pr;padding:0;border:0;border-radius:0;background:none;margin:30px 0 6px}
.breakdance .hbt-svi .sv-proj b{display:block;font-family:var(--hbt-fd);font-weight:800;color:var(--hbt-ink);font-size:18px;letter-spacing:-.01em;margin-bottom:14px}
.breakdance .hbt-svi .sv-proj ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr;gap:12px}
.breakdance .hbt-svi .sv-proj li{position:relative;padding-left:36px;font-family:var(--hbt-fb);font-size:16px;line-height:24px;color:#5B5D62}
.breakdance .hbt-svi .sv-proj li::before{content:'';position:absolute;left:0;top:0;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1.5px var(--hbt-gold)}
.breakdance .hbt-svi .sv-proj li::after{content:'';position:absolute;left:9.5px;top:6px;width:5px;height:9px;border:solid #8F701D;border-width:0 2px 2px 0;transform:rotate(45deg)}
/* Training: modul (.tr-mods / .tr-mod) */
.breakdance .hbt-svi .tr-mods{grid-area:f;margin-top:26px}
.breakdance .hbt-svi .tr-mods>b{display:block;font-family:var(--hbt-fd);font-weight:800;font-size:18px;color:var(--hbt-ink);margin-bottom:14px}
.breakdance .hbt-svi .tr-mod{list-style:none;padding:0;margin:0;counter-reset:m;display:grid;grid-template-columns:1fr 1fr;gap:0 28px;border-top:1px solid rgba(14,15,17,.14)}
.breakdance .hbt-svi .tr-mod li{counter-increment:m;display:flex;gap:12px;align-items:baseline;padding:11px 0;border-bottom:1px solid rgba(14,15,17,.14);
  font-family:var(--hbt-fb);font-size:16px;line-height:1.45;color:var(--hbt-ink)}
.breakdance .hbt-svi .tr-mod li::before{content:counter(m,decimal-leading-zero);font-family:var(--hbt-fd);font-weight:800;font-size:14px;color:#8F701D;flex:0 0 22px}
@media(max-width:600px){.breakdance .hbt-svi .tr-mod{grid-template-columns:1fr}}
@media(min-width:901px){.breakdance .hbt-svi#electronic{grid-template-areas:"t img" "f img"}.breakdance .hbt-svi#electronic .tr-mod{grid-template-columns:1fr}}

/* ── Article Card (articles.css 15–32, 87) — diukur Playwright 1440px ── */
.breakdance .hbt-at__cb{display:block;width:100%;height:100%}
.breakdance .hbt-at{height:100%;display:flex;flex-direction:column;border:1px solid rgba(212,175,55,.45);border-radius:22px;overflow:hidden;background:#fff;
  font-family:var(--hbt-fb);font-size:17px;line-height:1.7;color:#5B5D62;transition:box-shadow .4s var(--hbt-e),transform .4s var(--hbt-e)}
.breakdance .hbt-at:hover{box-shadow:0 22px 44px -26px rgba(14,15,17,.35);transform:translateY(-3px)}
.breakdance .hbt-at__img{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:#F7F7F5}
.breakdance .hbt-at__img img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform .7s var(--hbt-e)}
.breakdance .hbt-at:hover .hbt-at__img img{transform:scale(1.04)}
.breakdance .hbt-at__cat{position:absolute;top:16px;right:16px;z-index:1;background:var(--hbt-gold-shine);color:var(--hbt-ink);font-size:12px;line-height:1.7;
  font-weight:600;text-transform:uppercase;letter-spacing:.06em;padding:7px 12px;border-radius:999px}
.breakdance .hbt-at__b{display:flex;flex-direction:column;gap:12px;padding:24px 24px 26px;flex:1}
.breakdance .hbt-at__m{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font-size:14px;line-height:1.7;color:#5B5D62}
.breakdance .hbt-at__t{margin:0;font-family:var(--hbt-fd);font-weight:800;font-size:clamp(1.2rem,1.6vw,1.4rem);letter-spacing:-.02em;line-height:1.2;color:var(--hbt-ink)}
.breakdance .hbt-at__t a{color:inherit;text-decoration:none;transition:color .3s}
.breakdance .hbt-at__t a:hover{color:#C99A2E}
.breakdance .hbt-at__d{margin:0;font-size:17px;line-height:1.6;color:#5B5D62}
.breakdance a.hbt-at__go{margin-top:auto;padding-top:6px;display:flex;align-items:center;gap:10px;font-size:15px;line-height:1.7;font-weight:600;
  text-transform:uppercase;color:#8F701D;text-decoration:none}
.breakdance .hbt-at__go .ar{transition:transform .5s var(--hbt-e)}
.breakdance .hbt-at__go:hover .ar{transform:translateX(6px)}

/* ── Event (gallery.css 16–21, 53–54, 91–94, 104–129) — diukur Playwright 1440 + 390px ──
   Garis pemisah antara event (.gl-ev + .gl-ev) = Fasa 10 (item wrapper Post Loop). Lightbox = hbt.js Fasa 10. */
.breakdance .hbt-gl-ev__cb{display:block;width:100%}
.breakdance .hbt-gl-ev{padding-bottom:clamp(56px,6vw,90px);scroll-margin-top:calc(var(--hbt-nav-h,100px) + 28px)}
.breakdance .hbt-gl-ev__t{margin:0;font-family:var(--hbt-fd);font-weight:800;letter-spacing:-.035em;line-height:1.02;color:var(--hbt-ink);font-size:clamp(1.8rem,3.2vw,2.8rem)}
.breakdance .hbt-gl-ev__g{margin-top:26px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.breakdance .hbt-gl-i{display:block;position:relative;margin:0;aspect-ratio:1/1;border-radius:20px;overflow:hidden;background:#F7F7F5}
.breakdance .hbt-gl-i img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform .6s var(--hbt-e)}
.breakdance .hbt-gl-i:hover img{transform:scale(1.04)}
.breakdance .hbt-gl-i::after{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 0 var(--hbt-gold);transition:box-shadow .3s}
.breakdance .hbt-gl-i:hover::after{box-shadow:inset 0 0 0 2px var(--hbt-gold)}
@media(max-width:900px){
  .breakdance .hbt-gl-ev__g{gap:8px;margin-top:18px}
  .breakdance .hbt-gl-i{border-radius:12px}
}

/* ══════════════════════════════════════════════════════════════
   FASA 9 — TEMPLATE HOME (28 Okt 2026)
   Port 1:1 dari prototype FINAL (v1-fullblack) css/style.css, diukur Playwright 1440 + 390px.
   ══════════════════════════════════════════════════════════════ */

/* ── Kursor custom (style.css 155–165) — elemen dicipta hbt.js ── */
.hbt-cur{position:fixed;top:0;left:0;width:7px;height:7px;border-radius:50%;background:#D4AF37;
  pointer-events:none;z-index:9999;transform:translate(-50%,-50%)}
.hbt-ring{position:fixed;top:0;left:0;width:36px;height:36px;border-radius:50%;
  border:1px solid rgba(212,175,55,.6);pointer-events:none;z-index:9998;transform:translate(-50%,-50%);
  transition:width .35s var(--hbt-e),height .35s var(--hbt-e),background .35s}
.hbt-ring.on{width:78px;height:78px;background:rgba(212,175,55,.16)}
.hbt-cur,.hbt-ring{opacity:0}
.cur-live .hbt-cur,.cur-live .hbt-ring{opacity:1}
@media(hover:none){.hbt-cur,.hbt-ring{display:none}}

/* ── 1 · Loader (style.css 170–176, 998, 1004, 1578–1617, 2157) — Code Block 01-loader.php ── */
.breakdance .bde-code-block.hbt-load-cb{display:block}
.load{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;
  background:radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%);
  font-family:var(--hbt-fb);font-size:16px;font-weight:400;line-height:1.7;color:#5B5D62}
.load__w{width:min(460px,80vw);text-align:center}
.load__logo-wrap{position:relative;display:inline-block;isolation:isolate}
.load img.load__logo{position:relative;z-index:1;display:block;width:auto;max-width:100%;height:clamp(130px,20vw,210px);margin:0 auto;
  filter:drop-shadow(0 0 2px rgba(212,175,55,.4)) drop-shadow(0 0 18px rgba(212,175,55,.18))}
/* cahaya lembut berdenyut */
.load__logo-wrap::before{content:'';position:absolute;z-index:0;left:50%;top:50%;
  width:180%;height:180%;transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(circle,rgba(212,175,55,.13) 0%,rgba(212,175,55,.04) 40%,transparent 64%);
  animation:hbtGlow 3.2s ease-in-out infinite}
/* kilauan melintas ikut bentuk logo (mask = fail logo, path relatif ke hbt.css) */
.load__logo-wrap::after{content:'';position:absolute;z-index:2;inset:0;pointer-events:none;
  -webkit-mask:url(hbt-logo-loader.webp) center/contain no-repeat;mask:url(hbt-logo-loader.webp) center/contain no-repeat;
  background:linear-gradient(112deg,transparent 38%,rgba(255,243,196,.18) 46%,rgba(255,248,220,.75) 50%,rgba(255,243,196,.18) 54%,transparent 62%);
  background-size:260% 100%;background-repeat:no-repeat;mix-blend-mode:screen;
  animation:hbtSheen 3.6s cubic-bezier(.4,0,.2,1) infinite}
@keyframes hbtGlow{0%,100%{opacity:.7}50%{opacity:1}}
@keyframes hbtSheen{0%{background-position:140% 0}55%,100%{background-position:-40% 0}}
.load__name{margin-top:26px;font-family:var(--hbt-fd);font-weight:800;color:#F1F1EF;
  font-size:clamp(1.35rem,3.2vw,2.15rem);letter-spacing:-.035em;line-height:1.05}
.load__tag{margin-top:12px;font-family:var(--hbt-fb);font-size:11px;font-weight:500;line-height:1.7;
  text-transform:uppercase;letter-spacing:.24em;font-style:italic;font-variant-numeric:tabular-nums;color:#D4AF37}
.load__row{margin-top:34px;display:flex;justify-content:space-between;align-items:baseline;
  font-family:var(--hbt-fb);font-size:9px;font-weight:500;line-height:1.7;text-transform:uppercase;
  letter-spacing:.2em;font-variant-numeric:tabular-nums;color:rgba(241,241,239,.5)}
.load__n{font-weight:500;font-size:12px;letter-spacing:.1em;line-height:1;color:#F1F1EF}
.load__b{position:relative;overflow:hidden;height:2px;margin-top:10px;background:rgba(255,255,255,.18)}
.load__b span{position:absolute;inset:0;background:#D4AF37;transform-origin:left;transform:scaleX(0)}
.fail .load{display:none!important}
@media(prefers-reduced-motion:reduce){
  .load{display:none}
  .load__logo-wrap::before,.load__logo-wrap::after{animation:none}
  .load__logo-wrap::after{display:none}
}

/* ── Section bungkus Code Block Home (Breakdance paksa Code Block dalam Section): tiada padding/lebar ── */
.breakdance .bde-section:is(.hbt-load-sec,.hbt-hero-sec)>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block:is(.hbt-load-cb,.hbt-hero-cb){display:block;width:100%}

/* tinggi nav (= --nav-h prototype, style.css 96, 1530, 1542, 1552) */
:root{--hbt-nav-h:100px}
@media(min-width:921px) and (max-width:1100px){:root{--hbt-nav-h:85px}}
@media(min-width:1101px) and (max-width:1220px){:root{--hbt-nav-h:97px}}
@media(min-width:1221px){:root{--hbt-nav-h:103px}}

/* ── 2 · Hero (style.css 372–475, 991–1005, 1638–1665, 1782–1795, 1830–1838, 2051–2058) — Code Block 02-hero.php ── */
.hbt-hero-sec .hero{position:relative;min-height:calc(100svh - var(--hbt-nav-h));
  display:flex;flex-direction:column;justify-content:flex-end;
  padding-bottom:clamp(24px,3.5vw,48px);overflow:hidden;isolation:isolate;background:#fff;
  font-family:var(--hbt-fb);font-size:16px;font-weight:400;line-height:1.7;color:#5B5D62;text-align:left}
.hbt-hero-sec .hero__bg{position:absolute;inset:-8% 0;z-index:-4}
.breakdance .hbt-hero-sec .hero__bg img{display:block;width:100%;height:100%;max-width:100%;object-fit:cover;object-position:60% 25%;will-change:transform}
@media(min-width:901px){
  .hbt-hero-sec .hero__bg{left:22%}
  .breakdance .hbt-hero-sec .hero__bg img{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22%);mask-image:linear-gradient(90deg,transparent 0,#000 22%)}
}
.hbt-hero-sec .hero__scrim{position:absolute;inset:0;z-index:-3;pointer-events:none;
  background:linear-gradient(180deg,transparent 70%,rgba(10,10,12,.18) 100%)}
.hbt-hero-sec .hero__fade{position:absolute;inset:0;z-index:-2;pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.92) 30%,rgba(255,255,255,.55) 42%,
  rgba(255,255,255,.15) 50%,rgba(255,255,255,0) 56%)}
@media(max-width:900px){
  .hbt-hero-sec .hero__fade{background:linear-gradient(90deg,
    rgba(255,255,255,.95) 0%,rgba(255,255,255,.9) 50%,rgba(255,255,255,.72) 80%,rgba(255,255,255,.55) 100%)}
}
.hbt-hero-sec .hero__glow{position:absolute;top:-15%;left:-10%;width:55vw;height:55vw;z-index:-1;pointer-events:none;
  background:radial-gradient(circle,rgba(212,175,55,.28),transparent 62%);mix-blend-mode:screen;filter:blur(30px);opacity:.9}
.hbt-hero-sec .hero__top{flex:1;display:flex;align-items:center;padding-top:clamp(48px,7vw,84px)}
.hbt-hero-sec .hero__wrap{margin:0;max-width:none;padding:0 clamp(22px,4.5vw,56px)}
.hbt-hero-sec .hero__wrap2{max-width:1380px;margin:0 auto;padding:0 clamp(22px,4.5vw,56px)}
.breakdance .hbt-hero-sec h1.hero__say{margin:26px 0 0;padding:0;max-width:16ch;font-family:var(--hbt-fd);font-weight:800;
  color:#0E0F11;letter-spacing:-.038em;line-height:.97;font-size:clamp(2.4rem,5.9vw,5.1rem);text-align:left;text-transform:none}
.hbt-hero-sec .hero__accent{display:inline-block;padding-bottom:.3em;margin-bottom:-.3em;padding-right:.06em;margin-right:-.06em;
  background:var(--hbt-gold-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.breakdance .hbt-hero-sec p.hero__sub{margin:24px 0 0;max-width:44ch;color:#5B5D62;font-size:1.06rem;line-height:1.7;font-weight:400}
.hbt-hero-sec .hero__cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:36px}
/* butang ke-2 hero: berisi charcoal Petrol 3 + teks Brand; hover sapuan Gold Shine + teks Text (style.css 1662–1665) */
.breakdance .hbt-hero-sec a.hbt-btn--hero2{background:linear-gradient(109.6deg,rgba(5,5,6,.95) 11.2%,#35373B 78.9%);color:var(--hbt-gold);
  box-shadow:inset 0 0 0 1px rgba(212,175,55,.45)}
.hbt-hero-sec .hbt-btn--hero2::before{background:var(--hbt-gold-shine)}
.breakdance .hbt-hero-sec a.hbt-btn--hero2:hover,.breakdance .hbt-hero-sec a.hbt-btn--hero2:focus-visible{color:var(--hbt-ink);box-shadow:none}
/* wordmark gergasi */
.hbt-hero-sec .hero__markrow{position:relative;overflow:hidden;margin-top:22px;padding-bottom:10px}
.hbt-hero-sec .hero__markrow::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;
  background:linear-gradient(90deg,rgba(14,15,17,.3) 0%,rgba(14,15,17,.3) 62%,rgba(120,112,92,.34) 74%,rgba(241,241,239,.36) 84%,rgba(241,241,239,.36) 100%)}
.hbt-hero-sec .hero__mark{font-family:var(--hbt-fd);font-weight:800;font-size:clamp(3.2rem,16.6vw,14.1rem);
  line-height:.78;letter-spacing:-.055em;white-space:nowrap;pointer-events:none;user-select:none;
  background:linear-gradient(90deg,rgba(14,15,17,.17) 0%,rgba(14,15,17,.17) 62%,rgba(105,98,80,.2) 74%,rgba(241,241,239,.2) 84%,rgba(241,241,239,.2) 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
/* baris tajuk (reveal) */
.hbt-hero-sec .lm{overflow:hidden;display:block;padding-bottom:.14em;margin-bottom:-.14em}
.hbt-hero-sec #hs.lm-done .lm,.fail .hbt-hero-sec .lm{overflow:visible}
.hbt-hero-sec .lm>span{display:block;will-change:transform}
.fail .hbt-hero-sec .lm>span,.fail .hbt-hero-sec img,.fail .hbt-hero-sec .hero__mark{transform:none!important;opacity:1!important}
@media(prefers-reduced-motion:reduce){.hbt-hero-sec .lm{overflow:visible}.hbt-hero-sec .lm>span,.hbt-hero-sec img{transform:none!important;opacity:1!important}}

/* ── Text reveal (style.css 2051–2058) — dipakai hero + semua section ── */
.tr-w{display:inline-block;white-space:pre}
.tr-c{display:inline-block;will-change:transform}
.mute .tr-c,.grad-txt .tr-c{background:var(--hbt-gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.tr-ln{display:block;overflow:hidden;padding-bottom:.14em;margin-bottom:-.14em}
.tr-li{display:block;will-change:transform}
.tr-w.mute{margin-bottom:-.08em}

/* ── Lenis vs Breakdance (28 Okt): normalize.min.css Breakdance set html{scroll-behavior:smooth} →
   bertembung dengan Lenis (scroll rasa sangkut). CSS rasmi Lenis: ── */
html.lenis,html.lenis body{height:auto}
html.lenis,html.lenis-smooth,.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}


/* ── 3 · Trust logos (style.css 537–560, 1793–1825, 2150–2156) — Code Block 03-trust.php ── */
.breakdance .bde-section.hbt-mq-sec>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block.hbt-mq-cb{display:block;width:100%}
.hbt-mq-sec .mq{overflow:hidden;white-space:nowrap;padding:22px 0;color:#0E0F11;background:#FAFAF9;
  border-top:1px solid rgba(14,15,17,.06);border-bottom:1px solid rgba(14,15,17,.06);
  font-family:var(--hbt-fb);font-size:16px;line-height:1.7}
.hbt-mq-sec .mq__t{display:flex;align-items:center;width:max-content;background:#FAFAF9;will-change:transform}
.hbt-mq-sec .mq__logo{flex:0 0 auto;display:flex;align-items:center;padding:0 clamp(28px,3.4vw,52px)}
.breakdance .hbt-mq-sec .mq__logo img{display:block;height:76px;width:auto;max-width:none;mix-blend-mode:multiply}
.breakdance .hbt-mq-sec .mq__logo--badge img{height:80px}
.breakdance .hbt-mq-sec .mq__logo--wide img{height:62px}
.breakdance .hbt-mq-sec .mq__logo img[src*="tapa-apac"]{height:54px}
.breakdance .hbt-mq-sec .mq__logo img[src*="sme-corp"]{height:72px}
.breakdance .hbt-mq-sec .mq__logo img[src*="ctpat"]{height:66px}
.breakdance .hbt-mq-sec .mq__logo img[src*="cert-iso-9001"]{height:76px}
.breakdance .hbt-mq-sec .mq__logo img[src*="cert-iso-18788"],.breakdance .hbt-mq-sec .mq__logo img[src*="award-superbrands"]{height:80px}
@media(max-width:900px){
  .hbt-mq-sec .mq{padding:16px 0}
  .breakdance .hbt-mq-sec .mq__logo img{height:58px}
  .breakdance .hbt-mq-sec .mq__logo--badge img{height:62px}
  .breakdance .hbt-mq-sec .mq__logo--wide img{height:46px}
  .breakdance .hbt-mq-sec .mq__logo img[src*="tapa-apac"]{height:40px}
  .breakdance .hbt-mq-sec .mq__logo img[src*="sme-corp"]{height:54px}
  .breakdance .hbt-mq-sec .mq__logo img[src*="ctpat"]{height:50px}
  .breakdance .hbt-mq-sec .mq__logo img[src*="cert-iso-9001"]{height:58px}
  .breakdance .hbt-mq-sec .mq__logo img[src*="cert-iso-18788"],.breakdance .hbt-mq-sec .mq__logo img[src*="award-superbrands"]{height:62px}
}
@media(max-width:700px){.hbt-mq-sec .mq__logo{padding:0 24px}}

/* ── 4 · About (style.css 121, 133, 139–143, 580–616, 987–1005, 1631–1633, 1723–1724, 1770, 1842–1843, 2068–2074) — Code Block 04-about.php ── */
.breakdance .bde-section.hbt-about-sec>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block.hbt-about-cb{display:block;width:100%}
.hbt-about-sec .about{padding:clamp(120px,20vh,240px) 0 clamp(104px,13vw,180px);background:#fff;border-top:1px solid rgba(14,15,17,.08);
  font-family:var(--hbt-fb);font-size:16px;font-weight:400;line-height:1.7;color:#5B5D62;text-align:start}
.hbt-about-sec .wrap{max-width:1380px;margin:0 auto;padding:0 clamp(22px,4.5vw,56px)}
.hbt-about-sec .about__grid{display:grid;grid-template-columns:.91fr 1.09fr;gap:clamp(34px,5vw,70px);align-items:center}
.hbt-about-sec .about__media{position:relative}
.breakdance .hbt-about-sec .about__media>img{display:block;width:100%;height:auto;max-width:100%;border-radius:18px;object-fit:cover;
  aspect-ratio:4/4.2;border:1px solid rgba(14,15,17,.14)}
.hbt-about-sec .about__stat{position:absolute;right:-10px;bottom:24px;background:linear-gradient(109.6deg,rgba(5,5,6,.95) 11.2%,#35373B 78.9%);
  border:1px solid rgba(241,241,239,.12);border-radius:10px;padding:16px 20px;display:flex;align-items:center;gap:14px}
.hbt-about-sec .about__stat b{font-family:var(--hbt-fd);font-size:1.7rem;font-weight:800;display:inline-block;line-height:1.7;
  padding-bottom:.2em;margin-bottom:-.2em;letter-spacing:-.03em;
  background:var(--hbt-gold-shine);-webkit-background-clip:text;background-clip:text;color:transparent}
.hbt-about-sec .about__stat span{font-size:15px;color:rgba(241,241,239,.72);line-height:1.3}
.breakdance .hbt-about-sec h2.about__t{margin:0;padding:0;max-width:none;font-family:var(--hbt-fd);font-weight:800;color:#0E0F11;
  letter-spacing:-.038em;line-height:.93;font-size:clamp(2rem,4.6vw,3.9rem);text-align:start;text-transform:none}
@media(min-width:901px){.hbt-about-sec .about__t .grad-txt{white-space:nowrap}.breakdance .hbt-about-sec h2.about__t{font-size:clamp(2rem,4.2vw,3.6rem)}}
.hbt-about-sec .grad-txt{display:inline-block;padding-bottom:.3em;margin-bottom:-.3em;padding-right:.06em;margin-right:-.06em;
  background:var(--hbt-gold-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.breakdance .hbt-about-sec p.about__d{margin:22px 0 0;padding:0;max-width:50ch;color:#5B5D62;font-size:clamp(1.05rem,1.4vw,1.3rem);line-height:1.6;font-weight:400}
.hbt-about-sec .ticks{display:grid;gap:12px;margin:26px 0 34px;padding:0;list-style:none}
.hbt-about-sec .ticks li{position:relative;margin:0;padding-left:30px;color:#5B5D62;font-size:17px}
.hbt-about-sec .ticks li::before{content:"";position:absolute;left:0;top:9px;width:16px;height:16px;
  border-radius:50%;background:rgba(212,175,55,.14);border:1px solid #D4AF37}
.hbt-about-sec .ticks li::after{content:"";position:absolute;left:5px;top:12px;width:5px;height:9px;
  border-right:2px solid #8F701D;border-bottom:2px solid #8F701D;transform:rotate(42deg)}
@media(max-width:920px){
  .hbt-about-sec .about__grid{grid-template-columns:1fr}
  .hbt-about-sec .about__media{order:-1;max-width:440px;margin-inline:auto}
}
/* bahasa (Polylang: lang="ms-MY" / "zh-CN") */
html[lang^="ms"] body.breakdance .hbt-about-sec h2.about__t{font-size:min(2rem,7.4vw)}
@media(min-width:901px){html[lang^="ms"] body.breakdance .hbt-about-sec h2.about__t{font-size:clamp(1.7rem,3.95vw,3.35rem)}}
html[lang^="zh"] body.breakdance .hbt-about-sec h2.about__t{letter-spacing:0;line-height:1.12}
html:not([lang^="en"]) body.breakdance .hbt-about-sec h2.about__t{text-wrap:balance}

/* ── Reveal .up (style.css 987, 999–1005) — dipakai semua section ── */
.up{will-change:transform,opacity}
.fail .up{transform:none!important;opacity:1!important}
@media(prefers-reduced-motion:reduce){.up{transform:none!important;opacity:1!important}}

/* ── 5 · Products & Services D4 (style.css 141, 144, 148, 621–623, 842–901, 1631–1633, 1723–1735, 1775, 1844–1849, 2076) — Code Block 05-services.php ── */
.breakdance .bde-section.hbt-svc-sec>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block.hbt-svc-cb{display:block;width:100%}
.hbt-svc-sec .svc-sec{padding:clamp(48px,7vh,96px) 0 clamp(104px,13vw,180px);background:#fff;border-top:1px solid rgba(14,15,17,.08);
  font-family:var(--hbt-fb);font-size:16px;font-weight:400;line-height:1.7;color:#5B5D62;text-align:start}
.hbt-svc-sec .wrap{max-width:1380px;margin:0 auto;padding:0 clamp(22px,4.5vw,56px)}
.hbt-svc-sec .svc__head{display:flex;flex-direction:column;align-items:center;text-align:center;margin:0 0 clamp(44px,8vh,100px);padding:0}
.breakdance .hbt-svc-sec h2.svc__t1{margin:0;padding:0;font-family:var(--hbt-fd);font-weight:800;color:#0E0F11;
  letter-spacing:-.038em;line-height:.93;font-size:clamp(2rem,4.6vw,3.9rem);text-align:center;text-transform:none}
@media(min-width:701px){.breakdance .hbt-svc-sec h2.svc__t1{white-space:nowrap}}
.hbt-svc-sec .svc{position:relative;display:grid;grid-template-columns:1fr minmax(240px,.7fr) 1fr;gap:clamp(40px,7vw,120px);align-items:center}
.hbt-svc-sec .svc__svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:0}
.hbt-svc-sec .svc__svg path{fill:none;stroke:rgba(14,15,17,.14);stroke-width:1.2;stroke-dasharray:4 6;transition:stroke .5s}
.hbt-svc-sec .svc__svg path.is-on{stroke:#D4AF37;stroke-width:2;animation:hbtSvcDash .7s linear infinite}
@keyframes hbtSvcDash{to{stroke-dashoffset:-24}}
.hbt-svc-sec .svc__col{position:relative;z-index:1;display:flex;flex-direction:column;gap:clamp(18px,3.6vh,44px)}
.hbt-svc-sec .svc__i{position:relative;cursor:pointer;outline:none;padding:4px 0}
.hbt-svc-sec .svc__col--l .svc__i{text-align:right}
.breakdance .hbt-svc-sec h3.svc__t{position:relative;margin:0;padding:0;font-family:var(--hbt-fd);font-weight:800;letter-spacing:-.04em;color:#0E0F11;line-height:1;
  font-size:clamp(1.3rem,2vw,1.85rem);text-transform:none;transition:color .4s}
.breakdance .hbt-svc-sec p.svc__d{margin:8px 0 0;padding:0;font-size:17px;line-height:1.6;max-width:36ch;color:#5B5D62;transition:color .4s}
.breakdance .hbt-svc-sec .svc__col--l p.svc__d{margin-left:auto}
.hbt-svc-sec .svc__pt{position:absolute;top:50%;margin-top:-4.5px;width:9px;height:9px;border-radius:50%;background:#fff;
  box-shadow:0 0 0 1.5px rgba(14,15,17,.3);transition:.4s var(--hbt-e)}
.hbt-svc-sec .svc__col--l .svc__pt{right:-22px}
.hbt-svc-sec .svc__col--r .svc__pt{left:-22px}
.hbt-svc-sec .svc__i.is-on .svc__pt{background:#D4AF37;box-shadow:0 0 0 4px rgba(212,175,55,.25)}
.hbt-svc-sec .mono{font-variant-numeric:tabular-nums;font-family:var(--hbt-fb);font-weight:500;text-transform:uppercase}
.breakdance .hbt-svc-sec a.svc__go{display:inline-flex;align-items:center;gap:10px;margin-top:14px;color:#0E0F11;padding-bottom:4px;
  font-size:13px;letter-spacing:0;line-height:1.7;text-decoration:none;
  background:linear-gradient(#D4AF37,#D4AF37) left bottom/0% 1.5px no-repeat;transition:background-size .5s var(--hbt-e),color .4s}
.hbt-svc-sec .svc__go .ar{transition:transform .4s var(--hbt-e)}
.breakdance .hbt-svc-sec .svc__i:hover a.svc__go,.breakdance .hbt-svc-sec .svc__i.is-on a.svc__go,.breakdance .hbt-svc-sec a.svc__go:focus-visible{background-size:100% 1.5px;color:#8F701D}
.hbt-svc-sec .svc__go:hover .ar{transform:translateX(5px)}
.breakdance .hbt-svc-sec .svc__i:hover h3.svc__t,.breakdance .hbt-svc-sec .svc__i.is-on h3.svc__t{color:#C99A2E}
.hbt-svc-sec .svc__mid{position:relative;z-index:1;width:100%;max-width:min(100%,46vh);justify-self:center}
.hbt-svc-sec .svc__hub{position:relative;aspect-ratio:1;border-radius:50%;overflow:hidden;display:grid;place-items:center;
  background:radial-gradient(circle at 50% 42%,#fff 0%,#fff 52%,#F6F2E6 100%);
  box-shadow:0 0 0 1px rgba(212,175,55,.55),0 0 0 14px #fff,0 0 0 15px rgba(212,175,55,.22),0 30px 70px -24px rgba(14,15,17,.22)}
.hbt-svc-sec .svc__sweep{position:absolute;left:50%;top:50%;width:150%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;
  background:conic-gradient(from 0deg,rgba(212,175,55,0) 0deg,rgba(212,175,55,0) 290deg,rgba(212,175,55,.16) 360deg);
  animation:hbtRadar 6s linear infinite;transition:opacity .6s}
.breakdance .hbt-svc-sec img.svc__logo{position:relative;z-index:1;display:block;width:58%;height:auto;max-width:100%;
  filter:drop-shadow(0 10px 18px rgba(14,15,17,.18));transition:opacity .6s var(--hbt-e),transform .9s var(--hbt-e)}
.hbt-svc-sec .svc__img{position:absolute;inset:0;z-index:2;opacity:0;transition:opacity .7s var(--hbt-e)}
.breakdance .hbt-svc-sec .svc__img img{display:block;width:100%;height:100%;max-width:100%;object-fit:cover}
.hbt-svc-sec .svc__img.is-on{opacity:1}
.hbt-svc-sec .svc__hub.is-photo .svc__logo{opacity:0;transform:scale(.92)}
.hbt-svc-sec .svc__hub.is-photo .svc__sweep{opacity:0}
.breakdance .hbt-svc-sec p.svc__lbl{text-align:center;margin:clamp(16px,2.6vh,30px) 0 0;padding:0;color:#8F701D;font-size:17px;letter-spacing:0;line-height:1.7}
.hbt-svc-sec .svc__cta{display:flex;justify-content:center;margin-top:clamp(12px,2vh,22px)}
.hbt-svc-sec .svc__cta .hbt-btn{flex-shrink:0}
@media(max-width:1100px){.hbt-svc-sec .svc__cta .hbt-btn{padding:14px 20px}}
@media(min-width:981px){
  .hbt-svc-sec .svc{align-items:stretch}
  .hbt-svc-sec .svc__mid{align-self:center}
  .hbt-svc-sec .svc__col{display:grid;grid-template-rows:repeat(3,1fr);align-items:start}
}
@media(max-width:980px){
  .hbt-svc-sec .svc{grid-template-columns:1fr;gap:28px}
  .hbt-svc-sec .svc__svg,.hbt-svc-sec .svc__pt{display:none}
  .hbt-svc-sec .svc__mid{order:-1;max-width:260px;margin:0 auto;width:100%}
  .hbt-svc-sec .svc__col--l .svc__i{text-align:left}
  .breakdance .hbt-svc-sec .svc__col--l p.svc__d{margin-left:0}
}
@media(prefers-reduced-motion:reduce){.hbt-svc-sec .svc__sweep,.hbt-svc-sec .svc__svg path.is-on{animation:none}}
html[lang^="zh"] body.breakdance .hbt-svc-sec :is(h2,h3){letter-spacing:0;line-height:1.12}
html:not([lang^="en"]) body.breakdance .hbt-svc-sec :is(h2,h3){text-wrap:balance}

/* ── 6 · Testimonials (style.css 625, 909–928, 953–971, 1631–1633, 1650–1657, 1723–1724, 1851–1866) — Code Block 06-testimonials.php ── */
.breakdance .bde-section.hbt-tst-sec>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block.hbt-tst-cb{display:block;width:100%}
.hbt-tst-sec .tst-sec{padding:clamp(48px,7vh,96px) 0 clamp(104px,13vw,180px);background:#fff;border-top:1px solid rgba(14,15,17,.08);
  font-family:var(--hbt-fb);font-size:16px;font-weight:400;line-height:1.7;color:#5B5D62;text-align:start}
.hbt-tst-sec .wrap{max-width:1380px;margin:0 auto;padding:0 clamp(22px,4.5vw,56px)}
.hbt-tst-sec .s__i{margin-bottom:clamp(44px,6vw,80px)}
.breakdance .hbt-tst-sec h2.t-lg{margin:0;padding:0;font-family:var(--hbt-fd);font-weight:800;color:#0E0F11;
  letter-spacing:-.038em;line-height:.93;font-size:clamp(2rem,4.6vw,3.9rem);text-align:start;text-transform:none}
.hbt-tst-sec .tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.hbt-tst-sec .tcard{background:#fff;border:1px solid rgba(212,175,55,.55);border-radius:18px;
  padding:32px 30px;display:flex;flex-direction:column;transition:border-color .4s var(--hbt-e),transform .4s var(--hbt-e)}
.hbt-tst-sec .tcard:hover{border-color:#D4AF37;transform:translateY(-5px)}
.breakdance .hbt-tst-sec blockquote.tcard__q{margin:0;padding:0;border:0;font-family:var(--hbt-fd);font-weight:700;letter-spacing:-.025em;line-height:1.24;
  font-size:clamp(1.15rem,1.5vw,1.35rem);color:#0E0F11;font-style:normal}
.hbt-tst-sec .tcard__who{margin-top:auto;padding-top:28px;display:flex;gap:14px;align-items:center;container-type:inline-size}
.hbt-tst-sec .tcard__av{width:46px;height:46px;border-radius:50%;border:solid 1px #d4af37;flex:0 0 auto;
  display:grid;place-items:center;color:#d4af37;background:#f1f1f1}
.hbt-tst-sec .tcard__av svg{width:26px;height:26px;display:block}
.hbt-tst-sec .tcard__role{font-family:var(--hbt-fd);font-weight:700;color:#0E0F11;letter-spacing:-.01em;line-height:1.2;
  white-space:nowrap;font-size:min(16px,calc((100cqi - 60px) / 16.6))}
.hbt-tst-sec .tcard__org{font-size:13px;color:#5B5D62;margin-top:4px;line-height:1.3;text-wrap:balance}
@container (max-width:290px){.hbt-tst-sec .tcard__av{display:none}.hbt-tst-sec .tcard__role{font-size:min(16px,calc(100cqi / 16.6))}}
@media(max-width:900px){.hbt-tst-sec .tgrid{grid-template-columns:1fr}}
/* kad CTA emas */
.hbt-tst-sec .ctacard__box{position:relative;overflow:hidden;background:var(--hbt-gold-shine);border-radius:18px;
  margin-top:clamp(40px,5vw,64px);padding:clamp(34px,4vw,56px) clamp(30px,3.6vw,50px);
  display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.hbt-tst-sec .ctacard__box::before{content:'';position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(14,15,17,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(14,15,17,.07) 1px,transparent 1px);
  background-size:38px 38px;
  -webkit-mask-image:radial-gradient(circle at 85% 20%,#000 0%,transparent 70%);mask-image:radial-gradient(circle at 85% 20%,#000 0%,transparent 70%)}
.hbt-tst-sec .ctacard__txt{position:relative;z-index:1;flex:1 1 380px;min-width:0}
.breakdance .hbt-tst-sec h3.ctacard__t{margin:0;padding:0;color:#0E0F11;font-family:var(--hbt-fd);font-weight:800;
  letter-spacing:-.025em;line-height:1.1;font-size:clamp(1.35rem,2.3vw,1.85rem);text-align:start;text-transform:none}
.hbt-tst-sec .ctacard__t span{color:#0E0F11;font-weight:600}
.breakdance .hbt-tst-sec p.ctacard__d{margin:12px 0 0;padding:0;color:#3A2804;width:100%;font-size:17px;line-height:1.5;font-weight:500;text-wrap:pretty}
@media(max-width:640px){.hbt-tst-sec .ctacard__d br{display:none}}
.breakdance .hbt-tst-sec a.ctacard__go{position:relative;z-index:1;flex:0 0 auto;background:#fff;color:#0E0F11}
.breakdance .hbt-tst-sec a.ctacard__go:hover,.breakdance .hbt-tst-sec a.ctacard__go:focus-visible{color:#D4AF37}
@media(max-width:700px){.hbt-tst-sec .ctacard__box{flex-direction:column;align-items:flex-start}}
html[lang^="zh"] body.breakdance .hbt-tst-sec :is(h2,h3){letter-spacing:0;line-height:1.12}
html:not([lang^="en"]) body.breakdance .hbt-tst-sec :is(h2,h3){text-wrap:balance}

/* ── 7 · Why choose us (style.css 1063–1067, 1100–1103, 1631–1633, 1723–1726, 1749–1766, 1868–1881) — Code Block 07-why.php ── */
.breakdance .bde-section.hbt-why-sec>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block.hbt-why-cb{display:block;width:100%}
.hbt-why-sec .wcc{padding:clamp(48px,7vh,96px) 0 clamp(104px,13vw,180px);background:#fff;border-top:1px solid rgba(14,15,17,.08);
  font-family:var(--hbt-fb);font-size:16px;font-weight:400;line-height:1.7;color:#5B5D62;text-align:start}
.hbt-why-sec .wrap{max-width:1380px;margin:0 auto;padding:0 clamp(22px,4.5vw,56px)}
.hbt-why-sec .wcc__head{margin-top:0;display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(20px,4vw,64px);align-items:end}
@media(max-width:900px){.hbt-why-sec .wcc__head{grid-template-columns:1fr;align-items:start}}
.breakdance .hbt-why-sec h2.wcc__t{margin:0;padding:0;max-width:17ch;font-family:var(--hbt-fd);font-weight:800;color:#0E0F11;
  letter-spacing:-.038em;line-height:.93;font-size:clamp(2rem,4.6vw,3.9rem);text-align:start;text-transform:none}
.hbt-why-sec .why{display:grid;grid-template-columns:1fr 1fr minmax(320px,380px);gap:clamp(30px,4vw,64px);
  align-items:stretch;margin-top:clamp(38px,4.5vw,62px)}
.hbt-why-sec .why__col{list-style:none;margin:0;padding:0}
.hbt-why-sec .why__i{display:flex;align-items:flex-start;gap:16px;padding:11px 0;margin:0}
.hbt-why-sec .why__tick{flex:0 0 auto;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;margin-top:1px;
  background:#fff;color:#8F701D;box-shadow:inset 0 0 0 1.5px #D4AF37}
.hbt-why-sec .why__tick svg{width:12px;height:12px}
.breakdance .hbt-why-sec h3.why__t{margin:0;padding:0;font-family:var(--hbt-fd);font-weight:700;letter-spacing:-.02em;color:#0E0F11;
  font-size:19px;line-height:1.25;text-align:start;text-transform:none}
.breakdance .hbt-why-sec p.why__d{margin:6px 0 0;padding:0;font-size:17px;line-height:1.5;letter-spacing:0;color:#5B5D62}
.hbt-why-sec .why__cta{position:relative;overflow:hidden;border-radius:18px;background:radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%);
  padding:clamp(28px,3vw,44px);display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.hbt-why-sec .why__cta::after{content:'';position:absolute;left:0;top:0;right:0;height:2px;background:var(--hbt-gold-line)}
.breakdance .hbt-why-sec h3.wcg__cta-t{margin:0 0 12px;padding:0;font-family:var(--hbt-fd);font-weight:800;letter-spacing:-.035em;line-height:1.04;
  font-size:clamp(1.25rem,2.1vw,1.75rem);color:#F1F1EF;text-align:start;text-transform:none}
.breakdance .hbt-why-sec p.wcg__cta-d{margin:0;padding:0;font-size:17px;line-height:1.5;color:rgba(241,241,239,.72);max-width:42ch}
.hbt-why-sec .why__btns{display:flex;flex-direction:column;gap:12px;align-self:stretch}
.breakdance .hbt-why-sec .why__btns a.hbt-btn{width:100%;justify-content:center;margin:0}
@media(max-width:1100px){.hbt-why-sec .why{grid-template-columns:1fr 1fr}.hbt-why-sec .why__cta{grid-column:1/-1}}
@media(max-width:700px){.hbt-why-sec .why{grid-template-columns:1fr;gap:0}.hbt-why-sec .why__cta{margin-top:28px}}
@media(min-width:1101px) and (max-width:1440px){
  .hbt-why-sec .why{grid-template-columns:1fr 1fr minmax(280px,300px);gap:28px}
  .hbt-why-sec .why__cta{padding:30px 26px}
  .breakdance .hbt-why-sec .why__btns a.hbt-btn{padding-left:20px;padding-right:20px;gap:10px}
}
html[lang^="zh"] body.breakdance .hbt-why-sec :is(h2,h3){letter-spacing:0;line-height:1.12}
html:not([lang^="en"]) body.breakdance .hbt-why-sec :is(h2,h3){text-wrap:balance}

/* ── 8 · Numbers / Method (style.css 621–632, 670–721, 1631–1633, 1725, 1878, 2069–2071) — Code Block 08-numbers.php ── */
.breakdance .bde-section.hbt-met-sec>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block.hbt-met-cb{display:block;width:100%}
.hbt-met-sec .method{position:relative;background:#fff;border-top:1px solid rgba(14,15,17,.08);padding:clamp(48px,7vh,96px) 0 clamp(40px,5vw,72px)}
.hbt-met-sec .wrap{max-width:1380px;margin:0 auto;padding:0 clamp(22px,4.5vw,56px)}
.hbt-met-sec .s__i{margin:0}
.breakdance .hbt-met-sec h2.met__h{margin:0;padding:0;max-width:none;font-family:var(--hbt-fd);font-weight:800;color:#0E0F11;
  font-size:clamp(2rem,4.6vw,3.9rem);line-height:.93;letter-spacing:-.038em;text-align:left}
@media(min-width:701px){.breakdance .hbt-met-sec h2.met__h{white-space:nowrap}}
.hbt-met-sec .stair{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.8vw,26px);margin:clamp(40px,5vw,68px) 0 0;
  padding:0 0 clamp(34px,7vw,104px);list-style:none}
.hbt-met-sec .stair__i{margin:0;padding:0}
.hbt-met-sec .stair__card{border-radius:18px;display:flex;flex-direction:column;align-items:flex-start;
  padding:clamp(26px,2.4vw,34px) clamp(22px,2vw,30px);height:100%;border:1px solid rgba(241,241,239,.07);
  transition:border-color .55s cubic-bezier(.16,1,.3,1);will-change:transform}
.hbt-met-sec .stair__i:hover .stair__card{border-color:rgba(241,241,239,.2)}
.hbt-met-sec .stair__card--1{background:radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%)}
.hbt-met-sec .stair__card--2{background:linear-gradient(109.6deg,rgba(5,5,6,.95) 11.2%,#35373B 78.9%)}
.hbt-met-sec .stair__card--3{background:linear-gradient(45deg,#1F2023 0%,#4D4F54 100%)}
.hbt-met-sec .stair__card--4{background:linear-gradient(180deg,#f9e6a3 0%,#d4af37 45%,#a8791f 100%);background-origin:border-box;border-color:transparent}
.hbt-met-sec .stair__i:hover .stair__card--4{border-color:rgba(143,112,29,.35)}
.hbt-met-sec .stair__b{text-align:left}
.breakdance .hbt-met-sec h3.stair__t{margin:0 0 10px;padding:0;font-family:var(--hbt-fd);font-weight:800;font-size:clamp(2.5rem,5vw,4.2rem);
  line-height:1;letter-spacing:-.04em;color:#F1F1EF;text-align:left}
.breakdance .hbt-met-sec .stair__card--4 h3.stair__t{color:#0E0F11}
.breakdance .hbt-met-sec p.stair__d{margin:0;padding:0;font-family:var(--hbt-fb);font-weight:400;font-size:17px;line-height:1.7;letter-spacing:0;
  max-width:30ch;color:rgba(241,241,239,.72);text-align:left}
.breakdance .hbt-met-sec .stair__card--4 p.stair__d{color:rgba(14,15,17,.64)}
@media(max-width:900px){.hbt-met-sec .stair{grid-template-columns:repeat(2,1fr);gap:26px;padding-bottom:44px}}
@media(max-width:560px){.hbt-met-sec .stair{grid-template-columns:1fr;gap:20px;padding-bottom:0}}
html[lang^="zh"] body.breakdance .hbt-met-sec :is(h2,h3){letter-spacing:0;line-height:1.12}
html:not([lang^="en"]) body.breakdance .hbt-met-sec :is(h2,h3){text-wrap:balance}

/* ── 9 · Sectors (style.css 136–150, 724–822, 1670–1673, 1883–1887, 2054, 2069–2071) — Code Block 09-sectors.php · section GELAP (.hbt-dark) ── */
.breakdance .bde-section.hbt-sec-sec>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block.hbt-sec-cb{display:block;width:100%}
.hbt-dark .mute,.hbt-dark .mute .tr-c{background:var(--hbt-gold-shine);-webkit-background-clip:text;background-clip:text}
.hbt-sec-sec .sectors{background:linear-gradient(109.6deg,rgba(5,5,6,.95) 11.2%,#35373B 78.9%);color:rgba(241,241,239,.72);
  font-family:var(--hbt-fb);line-height:1.7;padding:clamp(104px,13vw,180px) 0;overflow:hidden;position:relative;z-index:2;border-radius:18px 18px 0 0}
.hbt-sec-sec .sectors::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;z-index:3;
  background:linear-gradient(90deg,transparent 0%,#D4AF37 14%,#fff3c4 50%,#D4AF37 86%,transparent 100%);border-radius:18px 18px 0 0}
.hbt-sec-sec .wrap{max-width:1380px;margin:0 auto;padding:0 clamp(22px,4.5vw,56px)}
.hbt-sec-sec .sectors__bg{position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:linear-gradient(rgba(241,241,239,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(241,241,239,.06) 1px,transparent 1px);
  background-size:46px 46px;-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.85),transparent 82%);mask-image:linear-gradient(180deg,rgba(0,0,0,.85),transparent 82%)}
.hbt-sec-sec .sectors__bg::after{content:'';position:absolute;right:-14%;bottom:-22%;width:56%;height:76%;
  background:linear-gradient(135deg,transparent 46%,rgba(212,175,55,.14) 50%,transparent 54%);filter:blur(1px)}
.hbt-sec-sec .sectors__head{position:relative;z-index:2;margin:0 0 clamp(48px,7vw,88px);padding:0;
  display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap}
.breakdance .hbt-sec-sec .sectors__head h2{margin:0;padding:0;font-family:var(--hbt-fd);font-weight:800;color:#F1F1EF;
  font-size:clamp(2rem,4.6vw,3.9rem);line-height:.93;letter-spacing:-.038em;text-align:left}
/* radar berpusing (hiasan) + butang kawalan */
.hbt-sec-sec .radar{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:max(150%,1500px);aspect-ratio:1/1;
  z-index:0;pointer-events:none;opacity:.4;-webkit-mask-image:radial-gradient(circle,#000 62%,transparent 94%);mask-image:radial-gradient(circle,#000 62%,transparent 94%)}
.hbt-sec-sec .radar__ring{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(241,241,239,.12)}
.hbt-sec-sec .radar__ring--2{inset:14%}
.hbt-sec-sec .radar__ring--3{inset:30%}
.hbt-sec-sec .radar__ring--4{inset:44%}
.hbt-sec-sec .radar__sweep{position:absolute;inset:0;border-radius:50%;transform-origin:center;
  background:conic-gradient(from 0deg,rgba(212,175,55,.6) 0deg,transparent 34deg,transparent 360deg);animation:hbtRadarspin 10s linear infinite}
.hbt-sec-sec .sectors.radar-off .radar__sweep{animation-play-state:paused;opacity:.2}
@keyframes hbtRadarspin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.hbt-sec-sec .radar__sweep{animation:none}}
.hbt-sec-sec button.radar__btn{position:relative;z-index:2;display:inline-flex;align-items:center;gap:10px;margin:0;
  padding:12px 18px;border-radius:999px;border:1px solid rgba(241,241,239,.22);background:rgba(241,241,239,.06);color:#F1F1EF;
  font-family:var(--hbt-fb);font-size:.6875rem;font-weight:400;font-style:normal;line-height:1.7;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;
  transition:border-color .35s cubic-bezier(.16,1,.3,1),background .35s cubic-bezier(.16,1,.3,1)}
.hbt-sec-sec button.radar__btn:hover{border-color:rgba(212,175,55,.5);background:rgba(241,241,239,.06);color:#F1F1EF}
.hbt-sec-sec .radar__btn b{color:#D4AF37;font-weight:600}
.hbt-sec-sec .radar__dot{width:7px;height:7px;border-radius:50%;background:#D4AF37;flex:0 0 auto;
  box-shadow:0 0 0 4px rgba(212,175,55,.2);transition:background .35s cubic-bezier(.16,1,.3,1),box-shadow .35s cubic-bezier(.16,1,.3,1)}
.hbt-sec-sec .radar__btn[aria-pressed="false"] .radar__dot{background:rgba(241,241,239,.35);box-shadow:none}
.hbt-sec-sec .radar__btn[aria-pressed="false"] b{color:rgba(241,241,239,.72)}
/* grid 3 kad sektor */
.hbt-sec-sec .secgrid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.4vw,28px)}
.hbt-sec-sec .seccard{display:flex;flex-direction:column;border:1px solid transparent;border-radius:18px;overflow:hidden;margin:0;
  background:radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%) padding-box,linear-gradient(180deg,#f9e6a3 0%,#d4af37 45%,#a8791f 100%) border-box}
.hbt-sec-sec .seccard__media{position:relative;aspect-ratio:16/9;overflow:hidden}
.hbt-sec-sec .rv{position:absolute;inset:0;overflow:hidden;clip-path:inset(0 0 0% 0)}
.hbt-sec-sec .seccard__media img{position:absolute;inset:0;width:100%;height:112%;max-width:none;object-fit:cover;
  will-change:transform;filter:saturate(1.05) contrast(1.05) brightness(.94)}
.hbt-sec-sec .seccard__body{flex:1;display:flex;flex-direction:column;padding:clamp(24px,2.6vw,32px)}
.hbt-sec-sec .seccard__meta{margin:0 0 12px;color:#D4AF37;white-space:nowrap}
.hbt-sec-sec .seccard__meta .mono{font-variant-numeric:tabular-nums;font-family:var(--hbt-fb);font-size:13px;font-weight:500;
  text-transform:uppercase;letter-spacing:.06em;white-space:normal}
@media(max-width:600px){.hbt-sec-sec .seccard__meta .mono{font-size:12px;letter-spacing:.04em}}
.breakdance .hbt-sec-sec h3.seccard__t{margin:0 0 12px;padding:0;font-family:var(--hbt-fd);font-weight:800;color:#F1F1EF;
  font-size:clamp(1.2rem,1.8vw,1.5rem);line-height:1.05;letter-spacing:-.025em;text-align:left}
.breakdance .hbt-sec-sec p.seccard__d{margin:0 0 26px;padding:0;max-width:38ch;font-size:17px;line-height:1.55;color:rgba(241,241,239,.72);text-align:left}
.breakdance .hbt-sec-sec a.seccard__btn{margin-top:auto;align-self:flex-start}
@media(max-width:900px){.hbt-sec-sec .secgrid{grid-template-columns:1fr;gap:20px}}
html[lang^="zh"] body.breakdance .hbt-sec-sec :is(h2,h3){letter-spacing:0;line-height:1.12}
html:not([lang^="en"]) body.breakdance .hbt-sec-sec :is(h2,h3){text-wrap:balance}
/* ── 10 · Branches map (style.css 1105–1282, 1631–1633, 1700–1745, 1886–1911) — Code Block 10-branches.php · CSS dijana dari style.css prototype (skop .hbt-brn-sec) ── */
.breakdance .bde-section.hbt-brn-sec>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block.hbt-brn-cb{display:block;width:100%}
.breakdance .hbt-brn-sec{--sand: #E4E4E2; --cream: #F7F7F5; --bone: #EFEFED; --ink: #0E0F11; --ink-2: #5B5D62; --line: rgba(14,15,17,.14); --petrol-1: radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%); --petrol-2: linear-gradient(45deg,#1F2023 0%,#4D4F54 100%); --petrol-3: linear-gradient(109.6deg,rgba(5,5,6,.95) 11.2%,#35373B 78.9%); --on-dark: #F1F1EF; --on-dark-2: rgba(241,241,239,.72); --deep: linear-gradient(180deg,#0A0A0C 0%,#000000 100%); --gold: #D4AF37; --gold-deep: #8F701D; --gold-shine: linear-gradient(180deg,#f9e6a3 0%,#d4af37 45%,#a8791f 100%); --gold-shine-h: linear-gradient(90deg,transparent 0%,var(--gold) 14%,#fff3c4 50%,var(--gold) 86%,transparent 100%); --gold-shine-deep: linear-gradient(180deg,#caa23a 0%,#8f701d 55%,#6b5216 100%); --gold-text: linear-gradient(180deg,#e9c55c 0%,#c99a2e 48%,#8f701d 100%); --hero-scrim: linear-gradient(180deg, rgba(10,10,12,.74) 0%, rgba(10,10,12,.28) 42%, rgba(138,110,47,.45) 74%, rgba(10,10,12,.97) 100%); --gold-shine-rich: radial-gradient(ellipse farthest-corner at right bottom,#FEDB37 0%,#FDB931 8%,#9f7928 30%,#8A6E2F 40%,transparent 80%), radial-gradient(ellipse farthest-corner at left top,#FFFFFF 0%,#FFFFAC 8%,#D1B464 25%,#5d4a1f 62.5%,#5d4a1f 100%); --f-d: 'Archivo HBT','Noto Sans SC',sans-serif; --f-b: 'Inter HBT','Noto Sans SC',sans-serif; --f-m: 'Inter HBT','Noto Sans SC',sans-serif; --r-sm: 6px; --r: 10px; --r-lg: 18px; --e: cubic-bezier(.16,1,.3,1); --pad: clamp(104px,13vw,180px); --gut: clamp(22px,4.5vw,56px); --nav-h: 100px;font-family:var(--f-b);color:var(--ink-2);line-height:1.7;-webkit-font-smoothing:antialiased}
.breakdance .hbt-brn-sec *,.breakdance .hbt-brn-sec ::before,.breakdance .hbt-brn-sec ::after{box-sizing:border-box;margin:0;padding:0}
.breakdance .hbt-brn-sec a{color:inherit;text-decoration:none}
.breakdance .hbt-brn-sec button{font:inherit}
.breakdance .hbt-brn-sec .wrap{max-width:1380px;margin:0 auto;padding:0 var(--gut)}
.breakdance .hbt-brn-sec :focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.breakdance .hbt-brn-sec h2{font-family:var(--f-d);color:var(--ink);letter-spacing:-.038em;line-height:.88;font-weight:800}
.breakdance .hbt-brn-sec .t-lg{font-size:clamp(2rem,4.6vw,3.9rem);line-height:.93}
.breakdance .hbt-brn-sec .mono{font-variant-numeric:tabular-nums;font-family:var(--f-m);font-size:.6875rem;font-weight:500;text-transform:uppercase;letter-spacing:.16em}
.breakdance .hbt-brn-sec .mute{background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;padding-bottom:.08em}
.breakdance .hbt-brn-sec .s{padding:var(--pad) 0}
.breakdance .hbt-brn-sec .up{will-change:transform,opacity}
@media (prefers-reduced-motion: reduce){
.breakdance .hbt-brn-sec *{animation:none!important;transition:none!important}
.breakdance .hbt-brn-sec .up{transform:none!important;opacity:1!important}
}
.breakdance .hbt-brn-sec .brd{display:none}
.breakdance .hbt-brn-sec .bmap{background:#fff;border-top:1px solid rgba(14,15,17,.08);color:var(--ink-2);
  --st:#ECECE9;--st-line:#fff;--st-line-cov:rgba(255,255,255,.75);
  --t1:#E2C25E;--t2:#D4AF37;--t3:#C59F2E;--t4:#EBD283;--t-hov:#F6E3A1;
  --lbl:#8A8C91;--lbl-halo:#fff;--lbl-on:rgba(14,15,17,.62);
  --pin:#0E0F11;--pin-stroke:#fff;--pin-on:#fff;--pin-on-stroke:#0E0F11;--halo:rgba(14,15,17,.2);
  --arc:rgba(14,15,17,.42);--arc-on:#0E0F11;
  --lift:-7px;--lift-fx:drop-shadow(0 6px 0 #8F701D); 
  --land-fx:drop-shadow(0 5px 0 #A88825)}
.breakdance .hbt-brn-sec .bmap__head{display:flex;flex-direction:column;align-items:center;text-align:center;
  margin:0 auto clamp(36px,4.5vw,60px)}
.breakdance .hbt-brn-sec .bmap__t{color:var(--ink);max-width:none;margin:0}
@media (min-width: 701px){
.breakdance .hbt-brn-sec .bmap__t{white-space:nowrap}
}
.breakdance .hbt-brn-sec .bmap__stage{position:relative}
.breakdance .hbt-brn-sec .bmap__bar{display:flex;justify-content:space-between;align-items:center;gap:16px;
  min-height:36px;margin-bottom:clamp(10px,1.6vw,20px)}
.breakdance .hbt-brn-sec .bmap__reset{margin-left:auto;border:0;cursor:pointer;padding:10px 16px;border-radius:999px;
  background:var(--ink);color:var(--gold);font-size:.62rem;transition:background .3s var(--e),color .3s var(--e)}
.breakdance .hbt-brn-sec .bmap__reset:hover{background:var(--gold);color:var(--ink)}
.breakdance .hbt-brn-sec .bmap__tabs{display:none}
.breakdance .hbt-brn-sec .bmap__frame{position:relative}
.breakdance .hbt-brn-sec .bmap__svg{display:block;width:100%;height:auto;aspect-ratio:652/282;overflow:hidden;--pz:.58}
.breakdance .hbt-brn-sec .bstates{filter:var(--land-fx)}
.breakdance .hbt-brn-sec .bst{fill:var(--st);stroke:var(--st-line);stroke-width:1.2;stroke-linejoin:round;
  vector-effect:non-scaling-stroke;transform-box:fill-box;transform-origin:center;
  transition:fill .35s var(--e),opacity .35s var(--e),transform .45s var(--e),filter .45s var(--e)}
.breakdance .hbt-brn-sec .bst.is-cov{cursor:pointer;stroke:var(--st-line-cov)}
.breakdance .hbt-brn-sec .bst[data-tone="1"]{fill:var(--t1)}
.breakdance .hbt-brn-sec .bst[data-tone="2"]{fill:var(--t2)}
.breakdance .hbt-brn-sec .bst[data-tone="3"]{fill:var(--t3)}
.breakdance .hbt-brn-sec .bst[data-tone="4"]{fill:var(--t4)}
.breakdance .hbt-brn-sec .bst.is-cov.is-hov{fill:var(--t-hov);transform:translateY(calc(var(--lift) * var(--pz)));filter:var(--lift-fx)}
.breakdance .hbt-brn-sec .blbl{font-family:var(--f-m);font-size:calc(10px * var(--pz));font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;fill:var(--lbl);paint-order:stroke;stroke:var(--lbl-halo);
  stroke-width:calc(3px * var(--pz));stroke-linejoin:round;pointer-events:none;transition:opacity .3s var(--e)}
.breakdance .hbt-brn-sec .blbl--on{fill:var(--lbl-on);stroke:none}
.breakdance .hbt-brn-sec .blbl--cov{display:none}
.breakdance .hbt-brn-sec .bstates.has-hov ~ .blbls .blbl{opacity:.35}
.breakdance .hbt-brn-sec .barcs{pointer-events:none}
.breakdance .hbt-brn-sec .barc{fill:none;stroke:var(--arc);stroke-width:1.3;vector-effect:non-scaling-stroke;
  stroke-dasharray:3 6;animation:bflow 1.4s linear infinite;opacity:.55;transition:opacity .35s var(--e),stroke .35s var(--e)}
.breakdance .hbt-brn-sec .barc.is-on,.breakdance .hbt-brn-sec .barc.is-lit{opacity:1;stroke:var(--arc-on)}
.breakdance .hbt-brn-sec .bpin{cursor:pointer;outline:none}
.breakdance .hbt-brn-sec .bpin__s{transform:scale(var(--pz))}
.breakdance .hbt-brn-sec .bpin__hit{fill:transparent}
.breakdance .hbt-brn-sec .bpin__halo{fill:var(--halo);transform-box:fill-box;transform-origin:center;
  animation:bpulse 3s var(--e) infinite}
.breakdance .hbt-brn-sec .bpin__ring{fill:none;stroke:var(--pin);stroke-width:1.6;vector-effect:non-scaling-stroke}
.breakdance .hbt-brn-sec .bpin__dot{fill:var(--pin);stroke:var(--pin-stroke);stroke-width:2;vector-effect:non-scaling-stroke;
  transition:fill .3s var(--e),stroke .3s var(--e)}
.breakdance .hbt-brn-sec .bpin:hover .bpin__dot,.breakdance .hbt-brn-sec .bpin.is-on .bpin__dot,.breakdance .hbt-brn-sec .bpin.is-lit .bpin__dot,.breakdance .hbt-brn-sec .bpin:focus-visible .bpin__dot{fill:var(--pin-on);stroke:var(--pin-on-stroke)}
.breakdance .hbt-brn-sec .bpin:hover .bpin__halo,.breakdance .hbt-brn-sec .bpin.is-on .bpin__halo,.breakdance .hbt-brn-sec .bpin.is-lit .bpin__halo,.breakdance .hbt-brn-sec .bpin:focus-visible .bpin__halo{animation:none;transform:scale(1.25)}
.breakdance .hbt-brn-sec .bmap__chips{position:absolute;inset:0;pointer-events:none;z-index:3;overflow:hidden}
.breakdance .hbt-brn-sec .bchip{position:absolute;left:0;top:0;pointer-events:auto;cursor:pointer;display:inline-flex;align-items:center;gap:5px;
  padding:4px 8px 4px 7px;border:0;border-radius:5px;white-space:nowrap;background:var(--ink);color:var(--gold);
  font-family:var(--f-m);font-size:9.5px;font-weight:500;line-height:1;letter-spacing:.1em;text-transform:uppercase;
  box-shadow:0 6px 14px -6px rgba(14,15,17,.6),0 0 0 1px rgba(212,175,55,.45);
  transform:translate(-50%,-50%);transition:background .3s var(--e),color .3s var(--e),box-shadow .3s var(--e)}
.breakdance .hbt-brn-sec .bchip--end{transform:translate(-100%,-50%)}
.breakdance .hbt-brn-sec .bchip svg{width:7px;height:10px;fill:currentColor;flex:0 0 auto}
.breakdance .hbt-brn-sec .bchip:hover,.breakdance .hbt-brn-sec .bchip.is-on,.breakdance .hbt-brn-sec .bchip:focus-visible{background:var(--gold-shine);color:var(--ink);
  box-shadow:0 10px 18px -8px rgba(14,15,17,.7),0 0 0 1px #FFF3C4;outline:none}
.breakdance .hbt-brn-sec .bcard{position:absolute;z-index:6;width:min(310px,86vw);max-height:calc(100% - 8px);padding:18px 22px 16px;
  background:var(--ink);color:var(--on-dark);border-radius:var(--r);   
  box-shadow:0 22px 56px -20px rgba(14,15,17,.6);pointer-events:none;
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .28s var(--e),transform .28s var(--e),visibility 0s .28s,left .3s var(--e),top .3s var(--e)}
.breakdance .hbt-brn-sec .bcard.is-show{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:0s}
.breakdance .hbt-brn-sec .bcard.is-fresh{transition:opacity .28s var(--e),transform .28s var(--e),visibility 0s .28s}
.breakdance .hbt-brn-sec .bcard::after{content:'';position:absolute;top:var(--ay,24px);width:12px;height:12px;display:none;
  background:var(--ink);transform:translateY(-50%) rotate(45deg)}
.breakdance .hbt-brn-sec .bcard.is-right::after{display:block;left:-6px}
.breakdance .hbt-brn-sec .bcard.is-left::after{display:block;right:-6px}
.breakdance .hbt-brn-sec .bcard__hd{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  margin:-2px 0 12px;padding-bottom:10px;border-bottom:1px solid rgba(241,241,239,.14)}
.breakdance .hbt-brn-sec .bcard__hd span{color:#fff;font-size:.66rem}
.breakdance .hbt-brn-sec .bcard__hd b{color:var(--gold);font-size:.58rem;font-weight:500}
.breakdance .hbt-brn-sec .bcard__e + .bcard__e{margin-top:14px;padding-top:14px;border-top:1px dashed rgba(241,241,239,.16)}
.breakdance .hbt-brn-sec .bcard__e + .bcard__e .bcard__addr{margin-top:6px}
.breakdance .hbt-brn-sec .bcard__e.is-hl .bcard__name{color:var(--gold)}
.breakdance .hbt-brn-sec .bcard__name{display:block;font-family:var(--f-d);font-weight:800;font-size:1.1rem;
  letter-spacing:-.03em;line-height:1.1;color:#fff}
.breakdance .hbt-brn-sec .bcard__addr{margin-top:10px;font-size:.84rem;line-height:1.6;color:var(--on-dark-2)}
.breakdance .hbt-brn-sec .bcard__row{margin-top:14px;padding-top:12px;border-top:1px solid rgba(241,241,239,.14);
  display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.breakdance .hbt-brn-sec .bcard__go-w{margin-top:8px}
.breakdance .hbt-brn-sec .bcard__tel{font-family:var(--f-m);font-size:.8rem;color:var(--on-dark)}
.breakdance .hbt-brn-sec .bcard__tel:hover{color:var(--gold)}
.breakdance .hbt-brn-sec .bcard__go{display:inline-flex;align-items:center;gap:6px;color:var(--gold);font-size:.6rem}
.breakdance .hbt-brn-sec .bcard__go .ar{transition:transform .4s var(--e)}
.breakdance .hbt-brn-sec .bcard__go:hover .ar{transform:translateX(5px)}
@media (max-width: 700px){
.breakdance .hbt-brn-sec .bcard,.breakdance .hbt-brn-sec .blbls{display:none}
.breakdance .hbt-brn-sec .bmap__reset,.breakdance .hbt-brn-sec .bmap__chips{display:none!important}
.breakdance .hbt-brn-sec .bmap__tabs{display:flex;width:100%;padding:4px;border-radius:999px;background:rgba(14,15,17,.06)}
.breakdance .hbt-brn-sec .bmap__tab{flex:1;border:0;cursor:pointer;padding:11px 8px;border-radius:999px;background:transparent;
    font-family:var(--f-m);font-size:.6rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);
    transition:background .3s var(--e),color .3s var(--e)}
.breakdance .hbt-brn-sec .bmap__tab b{margin-left:4px;color:var(--gold-deep)}
.breakdance .hbt-brn-sec .bmap__tab.is-on{background:var(--ink);color:#fff}
.breakdance .hbt-brn-sec .bmap__tab.is-on b{color:var(--gold)}
.breakdance .hbt-brn-sec .bmap__svg{aspect-ratio:1/1}
.breakdance .hbt-brn-sec .brd{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;
    margin:24px calc(var(--gut) * -1) 0;padding:4px var(--gut) 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.breakdance .hbt-brn-sec .brd::-webkit-scrollbar{display:none}
.breakdance .hbt-brn-sec .brd__i{flex:0 0 82%;scroll-snap-align:center;display:flex;flex-direction:column;position:relative;overflow:hidden;
    padding:20px 20px 18px 22px;border-radius:var(--r);background:var(--cream);
    border:1px solid rgba(14,15,17,.08);transition:border-color .3s var(--e),box-shadow .3s var(--e)}
.breakdance .hbt-brn-sec .brd__i::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--gold-shine)}
.breakdance .hbt-brn-sec .brd__i.is-on{border-color:rgba(212,175,55,.65);box-shadow:0 14px 34px -22px rgba(14,15,17,.45)}
.breakdance .hbt-brn-sec .brd__tag{font-family:var(--f-m);font-size:.6rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
    color:var(--gold-deep);margin-bottom:8px}
.breakdance .hbt-brn-sec .brd__name{font-family:var(--f-d);font-weight:800;font-size:1.05rem;letter-spacing:-.03em;line-height:1.1;color:var(--ink)}
.breakdance .hbt-brn-sec .brd__addr{margin-top:10px;font-size:.84rem;line-height:1.6;color:var(--ink-2)}
.breakdance .hbt-brn-sec .brd__tel{display:none}
.breakdance .hbt-brn-sec .brd__row{margin-top:14px;padding-top:12px;border-top:1px solid rgba(14,15,17,.08);
    display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.breakdance .hbt-brn-sec .brd__telv{font-family:var(--f-m);font-size:.8rem;color:var(--ink)}
.breakdance .hbt-brn-sec .brd__go{display:inline-flex;align-items:center;gap:6px;color:var(--gold-deep);font-size:.6rem}
}
.breakdance .hbt-brn-sec .bpin--hq .bpin__halo,.breakdance .hbt-brn-sec .bpin--hq .bpin__ring,.breakdance .hbt-brn-sec .bpin--hq .bpin__dot{display:none}
.breakdance .hbt-brn-sec .bpin--hq .bpin__logo{filter:drop-shadow(0 3px 5px rgba(14,15,17,.35))}
@media (min-width: 701px){
.breakdance .hbt-brn-sec .bpin:not(.bpin--hq){display:none}
.breakdance .hbt-brn-sec .bchip{padding:6px 11px 6px 9px;gap:6px;font-size:11.5px;border-radius:6px}
.breakdance .hbt-brn-sec .bchip svg{width:9px;height:12px}
}
.breakdance .hbt-brn-sec .bmap{padding-top:clamp(48px,7vh,96px);padding-bottom:var(--pad)}
.breakdance .hbt-brn-sec .bmap{padding-top:clamp(120px,20vh,220px)}
.breakdance .hbt-brn-sec .bmap__head{margin-bottom:clamp(8px,1.2vw,18px)}
@media (min-width: 701px){
.breakdance .hbt-brn-sec .bmap__bar{position:absolute;top:0;right:0;z-index:7;margin:0;min-height:0}
}
.breakdance .hbt-brn-sec .bcard{width:min(360px,88vw)}
.breakdance .hbt-brn-sec .bcard__hd,.breakdance .hbt-brn-sec .bcard__hd .mono{font-size:13px}
.breakdance .hbt-brn-sec .bcard__hd .mono:last-child{font-size:12px}
.breakdance .hbt-brn-sec .bcard__name{font-size:20px}
.breakdance .hbt-brn-sec .bcard__addr{font-size:16px}
.breakdance .hbt-brn-sec .bcard__tel{font-size:15px}
.breakdance .hbt-brn-sec .bcard__go,.breakdance .hbt-brn-sec .brd__go{font-size:13px;letter-spacing:0}
.breakdance .hbt-brn-sec .bmap__reset{font-size:13px}
.breakdance .hbt-brn-sec .bchip{font-size:13px}
@media (max-width: 900px){
.breakdance .hbt-brn-sec .bchip{font-size:12.5px}
.breakdance .hbt-brn-sec .brd__tag{font-size:12px}
.breakdance .hbt-brn-sec .brd__name{font-size:19px}
.breakdance .hbt-brn-sec .brd__addr{font-size:16px}
.breakdance .hbt-brn-sec .brd__telv{font-size:15px}
.breakdance .hbt-brn-sec .bmap__tab,.breakdance .hbt-brn-sec .bmap__tab b{font-size:12px}
}
.breakdance .hbt-brn-sec .bcard__hd span{font-size:13px}
.breakdance .hbt-brn-sec .bcard__hd b{font-size:12px}
@media (max-width: 900px){
.breakdance .hbt-brn-sec .bmap__tab{font-size:11.5px;letter-spacing:.04em;white-space:nowrap}
.breakdance .hbt-brn-sec .brd__i{flex-basis:88%}
.breakdance .hbt-brn-sec .brd__addr{font-size:15px}
}
.breakdance .hbt-brn-sec .bcard__hd b{letter-spacing:0}
.breakdance .hbt-brn-sec .bcard__go,.breakdance .hbt-brn-sec .brd__go{margin-left:auto}
html[lang^="zh"] body.breakdance .hbt-brn-sec :is(h1, h2, h3, h4){letter-spacing:0;line-height:1.12}
html:not([lang^="en"]) body.breakdance .hbt-brn-sec :is(h1, h2, h3){text-wrap:balance}
@keyframes bflow { 100% { stroke-dashoffset: -18; } }
@keyframes bpulse { 0% { transform: scale(0.85); opacity: 0.95; } 70%, 100% { transform: scale(2.1); opacity: 0; } }
/* ── 11–14 · Clients, Standards (GELAP), Licences, Partners (style.css 1290–1480, 1631–1673, 1723–1786, 1912–1935) — Code Block 11-clients.php, 12-standards.php, 13-licences.php, 14-partners.php · CSS dijana dari style.css prototype (skop 4 section) ── */
.breakdance .bde-section:is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec)>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block:is(.hbt-cli-cb,.hbt-std-cb,.hbt-lic-cb,.hbt-prt-cb){display:block;width:100%}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec){--sand: #E4E4E2; --cream: #F7F7F5; --bone: #EFEFED; --ink: #0E0F11; --ink-2: #5B5D62; --line: rgba(14,15,17,.14); --petrol-1: radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%); --petrol-2: linear-gradient(45deg,#1F2023 0%,#4D4F54 100%); --petrol-3: linear-gradient(109.6deg,rgba(5,5,6,.95) 11.2%,#35373B 78.9%); --on-dark: #F1F1EF; --on-dark-2: rgba(241,241,239,.72); --deep: linear-gradient(180deg,#0A0A0C 0%,#000000 100%); --gold: #D4AF37; --gold-deep: #8F701D; --gold-shine: linear-gradient(180deg,#f9e6a3 0%,#d4af37 45%,#a8791f 100%); --gold-shine-h: linear-gradient(90deg,transparent 0%,var(--gold) 14%,#fff3c4 50%,var(--gold) 86%,transparent 100%); --gold-shine-deep: linear-gradient(180deg,#caa23a 0%,#8f701d 55%,#6b5216 100%); --gold-text: linear-gradient(180deg,#e9c55c 0%,#c99a2e 48%,#8f701d 100%); --hero-scrim: linear-gradient(180deg, rgba(10,10,12,.74) 0%, rgba(10,10,12,.28) 42%, rgba(138,110,47,.45) 74%, rgba(10,10,12,.97) 100%); --gold-shine-rich: radial-gradient(ellipse farthest-corner at right bottom,#FEDB37 0%,#FDB931 8%,#9f7928 30%,#8A6E2F 40%,transparent 80%), radial-gradient(ellipse farthest-corner at left top,#FFFFFF 0%,#FFFFAC 8%,#D1B464 25%,#5d4a1f 62.5%,#5d4a1f 100%); --f-d: 'Archivo HBT','Noto Sans SC',sans-serif; --f-b: 'Inter HBT','Noto Sans SC',sans-serif; --f-m: 'Inter HBT','Noto Sans SC',sans-serif; --r-sm: 6px; --r: 10px; --r-lg: 18px; --e: cubic-bezier(.16,1,.3,1); --pad: clamp(104px,13vw,180px); --gut: clamp(22px,4.5vw,56px); --nav-h: 100px;font-family:var(--f-b);color:var(--ink-2);line-height:1.7;-webkit-font-smoothing:antialiased}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) *,.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) ::before,.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) ::after{box-sizing:border-box;margin:0;padding:0}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) img{display:block;max-width:100%}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) a{color:inherit;text-decoration:none}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) button{font:inherit}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .wrap{max-width:1380px;margin:0 auto;padding:0 var(--gut)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) :focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .r{border-radius:var(--r)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) h2{font-family:var(--f-d);color:var(--ink);letter-spacing:-.038em;line-height:.88;font-weight:800}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .t-lg{font-size:clamp(2rem,4.6vw,3.9rem);line-height:.93}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .lead{font-size:clamp(1.05rem,1.4vw,1.3rem);line-height:1.6}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .mono{font-variant-numeric:tabular-nums;font-family:var(--f-m);font-size:.6875rem;font-weight:500;text-transform:uppercase;letter-spacing:.16em}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .mute{background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;padding-bottom:.08em}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) [data-theme="dark"] .mute{background:var(--gold-shine);-webkit-background-clip:text;background-clip:text}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn{position:relative;display:inline-flex;align-items:center;gap:12px;padding:17px 30px;
  border:0;outline:0;appearance:none;-webkit-appearance:none;font-family:var(--f-m);
  font-size:.6875rem;text-transform:uppercase;letter-spacing:.15em;cursor:pointer;
  background:var(--ink);color:var(--cream);overflow:hidden;isolation:isolate;will-change:transform}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn::before{content:'';position:absolute;inset:0;background:var(--gold-shine);transform:scaleX(0);
  transform-origin:left;transition:transform .6s var(--e);z-index:-1}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn:hover::before{transform:scaleX(1)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn:hover{color:var(--ink)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn .ar{transition:transform .5s var(--e)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn:hover .ar{transform:translateX(7px)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .s{padding:var(--pad) 0}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .s--cream{background:var(--cream)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .s--bone{background:var(--bone)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .show__arrow{width:46px;height:46px;border-radius:50%;flex:0 0 auto;
  border:1px solid var(--line);background:var(--cream);color:var(--ink);
  display:grid;place-items:center;cursor:pointer;
  transition:background .35s var(--e),border-color .35s var(--e),color .35s var(--e)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .show__arrow svg{width:18px;height:18px}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .show__arrow:hover{background:var(--ink);border-color:var(--ink);color:var(--cream)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .show__arrow:disabled{opacity:.32;cursor:default;pointer-events:none}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .up{will-change:transform,opacity}
@media (prefers-reduced-motion: reduce){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) *{animation:none!important;transition:none!important}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .up,.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) img{transform:none!important;opacity:1!important}
}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__head{display:flex;justify-content:space-between;align-items:flex-end;
  gap:clamp(20px,4vw,60px);flex-wrap:wrap;margin-bottom:clamp(36px,4.5vw,60px)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__t{max-width:20ch}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__more{white-space:nowrap;flex:0 0 auto}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt__head{display:flex;justify-content:space-between;align-items:flex-end;
  gap:clamp(20px,4vw,60px);flex-wrap:wrap;margin-bottom:clamp(36px,4.5vw,60px)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt__t{max-width:none}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__grid{list-style:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;
  border-top:1px solid var(--line);border-left:1px solid var(--line)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__i{border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:clamp(20px,2vw,26px) clamp(14px,1.4vw,20px);display:flex;flex-direction:column;
  align-items:center;text-align:center;gap:14px;
  transition:background .4s var(--e)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__i:hover{background:rgba(212,175,55,.07)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__i[hidden]{display:none}
@media (max-width: 1080px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width: 720px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width: 460px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__logo{width:100%;aspect-ratio:16/9;display:grid;place-items:center;border-radius:var(--r-sm)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__logo img{max-width:78%;max-height:78%;object-fit:contain}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__n{font-size:.76rem;line-height:1.45;color:var(--ink-2);min-height:calc(1.45em*2)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt__grid{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;
  border-top:1px solid var(--line);border-left:1px solid var(--line)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt__i{border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:clamp(20px,2vw,26px) clamp(14px,1.4vw,20px);display:flex;flex-direction:column;
  align-items:center;text-align:center;gap:14px;
  transition:background .4s var(--e)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt__i:hover{background:rgba(212,175,55,.07)}
@media (max-width: 1080px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt__grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width: 720px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width: 460px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt__logo{width:100%;height:clamp(120px,17vw,168px);display:grid;place-items:center;border-radius:var(--r-sm)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt__logo img{max-width:88%;max-height:78%;object-fit:contain}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt__n{font-size:.76rem;line-height:1.45;color:var(--ink-2);min-height:calc(1.45em*2)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std{position:relative;background:var(--petrol-1);color:var(--on-dark-2);overflow:hidden}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;z-index:3;
  background:var(--gold-shine-h)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__bg{position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(241,241,239,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(241,241,239,.05) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(ellipse at 50% 0%,#000 10%,transparent 72%);
          mask-image:radial-gradient(ellipse at 50% 0%,#000 10%,transparent 72%)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std .wrap{position:relative;z-index:2}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(30px,5vw,88px);
  align-items:center}
@media (max-width: 960px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__grid{grid-template-columns:1fr;gap:clamp(40px,6vw,58px)}
}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__t{color:var(--on-dark);max-width:15ch}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__d{max-width:44ch;margin-top:22px;color:var(--on-dark-2)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__row{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(16px,2.4vw,40px)}
@media (max-width: 560px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__row{grid-template-columns:1fr;gap:clamp(18px,3vw,26px)}
}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__i{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px}
@media (max-width: 560px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__i{flex-direction:row;align-items:center;text-align:left;gap:22px}
}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__plate{width:100%;aspect-ratio:1/1;max-width:clamp(120px,13vw,190px);
  display:grid;place-items:center;border-radius:var(--r-lg);
  background:var(--cream);
  
  box-shadow:inset 0 0 0 2px var(--gold),0 0 0 1px rgba(212,175,55,.28),
             0 26px 50px -34px rgba(0,0,0,.85);
  margin-bottom:clamp(18px,2vw,28px);
  transition:transform .55s var(--e),box-shadow .55s var(--e)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__i:hover .std__plate{transform:translateY(-6px);
  box-shadow:inset 0 0 0 3px var(--gold),0 0 0 2px rgba(212,175,55,.45),
             0 32px 60px -30px rgba(0,0,0,.9)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__plate img{max-width:70%;max-height:70%;object-fit:contain}
@media (max-width: 560px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__plate{flex:0 0 auto;width:104px;height:104px;max-width:none;margin-bottom:0}
}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__n{font-family:var(--f-d);font-weight:800;letter-spacing:-.03em;
  font-size:clamp(.98rem,1.35vw,1.2rem);color:var(--on-dark);line-height:1.1}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__m{font-size:.78rem;line-height:1.4;color:var(--on-dark-2);max-width:22ch}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .lic__head{margin-bottom:clamp(18px,2vw,26px);display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .lic__t{max-width:none}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar{position:relative}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__nav{display:flex;gap:10px;justify-content:flex-end;flex:0 0 auto}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__track{display:flex;gap:clamp(12px,1.4vw,20px);overflow-x:auto;
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  padding-bottom:6px;scrollbar-width:none;-ms-overflow-style:none}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__track::-webkit-scrollbar{display:none}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__track:focus-visible{outline:3px solid var(--gold);outline-offset:6px}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__i{flex:0 0 clamp(178px,20vw,244px);scroll-snap-align:start;
  display:flex;flex-direction:column;gap:10px;margin:0}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__i img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top center;
  border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line),0 10px 24px -20px rgba(0,0,0,.6);
  filter:grayscale(.28);transition:filter .5s var(--e),transform .5s var(--e)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__i:hover img{filter:none;transform:translateY(-4px)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__n{font-family:var(--f-d);font-weight:700;letter-spacing:-.02em;font-size:.82rem;
  color:var(--ink);line-height:1.2}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__m{color:var(--ink-2);font-size:.55rem;opacity:.85}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .show__arrow[disabled]{opacity:.3;pointer-events:none}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__nav .show__arrow{background:var(--gold-shine);border-color:transparent;
  color:var(--ink);box-shadow:none}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__nav .show__arrow:hover{background:var(--petrol-1);color:var(--gold);
  box-shadow:inset 0 0 0 1px rgba(212,175,55,.5)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn--gold-dark{background:var(--gold-shine);color:var(--ink)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn--gold-dark::before{background:var(--petrol-1)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn--gold-dark:hover{color:var(--gold)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .s--cream,.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .s--bone{background:#fff;border-top:1px solid rgba(14,15,17,.08)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn--gold-dark::before{background:var(--petrol-3)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn--gold-dark:hover{color:var(--gold);box-shadow:inset 0 0 0 1px rgba(212,175,55,.55)}
@media (min-width: 901px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt__t{white-space:nowrap}
}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl,.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .lic,.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt{padding-top:clamp(48px,7vh,96px);padding-bottom:var(--pad)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .lic{padding-top:clamp(120px,20vh,220px)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn{font-size:16px;letter-spacing:.02em;padding:15px 28px}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn{white-space:nowrap}
@media (max-width: 480px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn{padding:14px 20px;gap:10px}
}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn{font-size:15px;letter-spacing:0}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn{font-weight:500}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .btn{font-weight:600}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__logo{aspect-ratio:auto;height:112px}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__logo img{height:80px;width:auto;max-width:80%;max-height:none;object-fit:contain}
@media (max-width: 700px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__logo{height:90px}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__logo img{height:62px}
}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__n{font-size:15px;line-height:1.35;letter-spacing:0}
@media (max-width: 600px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .cl__n{font-size:14px}
}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__m{font-size:15px;line-height:1.4;letter-spacing:0}
@media (max-width: 560px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__i{display:grid;grid-template-columns:104px 1fr;grid-template-rows:auto auto;column-gap:22px;row-gap:4px;align-items:center}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__plate{grid-row:1/3}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__n{align-self:end}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .std__m{align-self:start;max-width:none}
}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__nav .show__arrow{border:0;background-origin:border-box}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__n{font-size:16px;line-height:1.3}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__m{font-size:12px;letter-spacing:.04em;opacity:1}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__i{gap:0;background:#fff;border:1px solid rgba(212,175,55,.45);border-radius:var(--r);
  padding:12px 12px 16px;transition:border-color .35s var(--e),box-shadow .35s var(--e),transform .35s var(--e)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__i:hover{border-color:var(--gold);box-shadow:0 18px 34px -24px rgba(14,15,17,.45);transform:translateY(-4px)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__i img{border-radius:calc(var(--r) - 6px);box-shadow:inset 0 0 0 1px var(--line)}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__i:hover img{transform:none}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__n{margin-top:14px;padding:0 4px}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__m{margin-top:4px;padding:0 4px;line-height:1.35}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__i:hover{border-color:rgba(212,175,55,.45);box-shadow:none;transform:none}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .dcar__i:hover img{filter:grayscale(.28);transform:none}
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt__n{font-size:15px;line-height:1.35;letter-spacing:0}
@media (max-width: 600px){
.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) .prt__n{font-size:14px}
}
html[lang^="zh"] body.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) :is(h1, h2, h3, h4){letter-spacing:0;line-height:1.12}
html:not([lang^="en"]) body.breakdance :is(.hbt-cli-sec,.hbt-std-sec,.hbt-lic-sec,.hbt-prt-sec) :is(h1, h2, h3){text-wrap:balance}
/* ── FASA 10 · About — CSS dijana xcss.js dari style.css + about.css prototype FINAL ── */
.breakdance .bde-section:is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec)>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block:is(.hbt-abh-cb,.hbt-abbg-cb,.hbt-abvm-cb,.hbt-abfd-cb,.hbt-abtm-cb,.hbt-abcl-cb){display:block;width:100%}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec){--sand: #E4E4E2; --cream: #F7F7F5; --bone: #EFEFED; --ink: #0E0F11; --ink-2: #5B5D62; --line: rgba(14,15,17,.14); --petrol-1: radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%); --petrol-2: linear-gradient(45deg,#1F2023 0%,#4D4F54 100%); --petrol-3: linear-gradient(109.6deg,rgba(5,5,6,.95) 11.2%,#35373B 78.9%); --on-dark: #F1F1EF; --on-dark-2: rgba(241,241,239,.72); --deep: linear-gradient(180deg,#0A0A0C 0%,#000000 100%); --gold: #D4AF37; --gold-deep: #8F701D; --gold-shine: linear-gradient(180deg,#f9e6a3 0%,#d4af37 45%,#a8791f 100%); --gold-shine-h: linear-gradient(90deg,transparent 0%,var(--gold) 14%,#fff3c4 50%,var(--gold) 86%,transparent 100%); --gold-shine-deep: linear-gradient(180deg,#caa23a 0%,#8f701d 55%,#6b5216 100%); --gold-text: linear-gradient(180deg,#e9c55c 0%,#c99a2e 48%,#8f701d 100%); --hero-scrim: linear-gradient(180deg, rgba(10,10,12,.74) 0%, rgba(10,10,12,.28) 42%, rgba(138,110,47,.45) 74%, rgba(10,10,12,.97) 100%); --gold-shine-rich: radial-gradient(ellipse farthest-corner at right bottom,#FEDB37 0%,#FDB931 8%,#9f7928 30%,#8A6E2F 40%,transparent 80%), radial-gradient(ellipse farthest-corner at left top,#FFFFFF 0%,#FFFFAC 8%,#D1B464 25%,#5d4a1f 62.5%,#5d4a1f 100%); --f-d: 'Archivo HBT','Noto Sans SC',sans-serif; --f-b: 'Inter HBT','Noto Sans SC',sans-serif; --f-m: 'Inter HBT','Noto Sans SC',sans-serif; --r-sm: 6px; --r: 10px; --r-lg: 18px; --e: cubic-bezier(.16,1,.3,1); --pad: clamp(104px,13vw,180px); --gut: clamp(22px,4.5vw,56px); --nav-h: 100px;font-family:var(--f-b);color:var(--ink-2);line-height:1.7;-webkit-font-smoothing:antialiased}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) *,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) ::before,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) ::after{box-sizing:border-box;margin:0;padding:0}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) img{display:block;max-width:100%}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) a{color:inherit;text-decoration:none}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) button{font:inherit}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .wrap{max-width:1380px;margin:0 auto;padding:0 var(--gut)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) :focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .r{border-radius:var(--r)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) h1,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) h2{font-family:var(--f-d);color:var(--ink);letter-spacing:-.038em;line-height:.88;font-weight:800}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .mono{font-variant-numeric:tabular-nums;font-family:var(--f-m);font-size:.6875rem;font-weight:500;text-transform:uppercase;letter-spacing:.16em}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .mute{background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;padding-bottom:.08em}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) [data-theme="dark"] .mute{background:var(--gold-shine);-webkit-background-clip:text;background-clip:text}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn{position:relative;display:inline-flex;align-items:center;gap:12px;padding:17px 30px;
  border:0;outline:0;appearance:none;-webkit-appearance:none;font-family:var(--f-m);
  font-size:.6875rem;text-transform:uppercase;letter-spacing:.15em;cursor:pointer;
  background:var(--ink);color:var(--cream);overflow:hidden;isolation:isolate;will-change:transform}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn::before{content:'';position:absolute;inset:0;background:var(--gold-shine);transform:scaleX(0);
  transform-origin:left;transition:transform .6s var(--e);z-index:-1}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn:hover::before{transform:scaleX(1)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn:hover{color:var(--ink)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn .ar{transition:transform .5s var(--e)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn:hover .ar{transform:translateX(7px)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn--gold{position:relative}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn--gold::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.65) 48%,transparent 66%);
  transform:translateX(-140%);transition:transform .85s var(--e)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn--gold:hover::after{transform:translateX(140%)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn--gold{background:var(--gold-shine);color:var(--ink)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn--gold::before{background:var(--on-dark)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .up{will-change:transform,opacity}
@media (prefers-reduced-motion: reduce){
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) *{animation:none!important;transition:none!important}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .up,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) img{transform:none!important;opacity:1!important}
}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn--gold::before{background:var(--petrol-3)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn--gold:hover{color:var(--gold);box-shadow:inset 0 0 0 1px rgba(212,175,55,.55)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn{font-size:16px;letter-spacing:.02em;padding:15px 28px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn{white-space:nowrap}
@media (max-width: 480px){
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn{padding:14px 20px;gap:10px}
}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn{font-size:15px;letter-spacing:0}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn{font-weight:500}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) .btn{font-weight:600}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) section .ab-hero__img img{object-position:50% 78%}
html[lang^="zh"] body.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) :is(h1, h2, h3, h4){letter-spacing:0;line-height:1.12}
html:not([lang^="en"]) body.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec) :is(h1, h2, h3){text-wrap:balance}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-k{display:block;color:var(--gold-deep)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-h2{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:.98;color:var(--ink);font-size:clamp(2.1rem,4.4vw,3.9rem)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-hero{background:#fff;padding:clamp(56px,9vh,110px) 0 clamp(64px,9vh,120px)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-hero__g{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);align-items:center}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-hero h1{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:.95;color:var(--ink);
  font-size:clamp(2.4rem,5.2vw,4.6rem);margin:18px 0 22px;max-width:14ch}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-hero__d{max-width:46ch;font-size:1.04rem;line-height:1.7;color:var(--ink-2)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-hero__b{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-hero__img{border-radius:28px;overflow:hidden;aspect-ratio:4/3.4}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-hero__img img{width:100%;height:100%;object-fit:cover;object-position:center 40%}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-btn-o{background:transparent;color:var(--gold-deep);box-shadow:inset 0 0 0 1.5px var(--gold)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-btn-o::before{background:var(--gold-shine)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-btn-o:hover{color:var(--ink)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg{padding:var(--pad) 0;border-top:1px solid var(--line);background:#fff}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg__g{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(30px,6vw,110px);align-items:start}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg .ab-h2{margin-top:16px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg__f{margin-top:40px;border-top:1px solid var(--line);max-width:380px;list-style:none;padding:0}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg__f li{display:grid;grid-template-columns:110px 1fr;gap:16px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--line)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg__f b{font-family:var(--f-d);font-weight:800;letter-spacing:-.03em;font-size:1.05rem;
  background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg__f span{font-size:.92rem;color:var(--ink-2);line-height:1.4}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg__t p{font-size:1.04rem;line-height:1.7;color:var(--ink-2)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg__t p + p{margin-top:20px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg__t strong{color:var(--ink);font-weight:600}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg__t .ab-lead{font-weight:600;color:var(--ink)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm{position:relative;padding:var(--pad) 0;background:var(--petrol-1);color:var(--on-dark-2)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--gold-shine-h)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm .ab-k{color:var(--gold)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__g{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,7vw,120px);align-items:start}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__vis{position:sticky;top:calc(var(--nav-h) + 24px)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__vis h2{font-family:var(--f-d);font-weight:800;letter-spacing:-.05em;line-height:.98;color:var(--on-dark);
  font-size:clamp(2rem,3.6vw,3.3rem);margin-top:20px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__mis ol{margin-top:28px;list-style:none;padding:0}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__mis li{display:grid;grid-template-columns:52px 1fr;gap:12px;padding:22px 0;border-top:1px solid rgba(241,241,239,.1)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__mis li:last-child{border-bottom:1px solid rgba(241,241,239,.1)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__mis i{font-style:normal;font-family:var(--f-d);font-weight:700;font-size:.95rem;color:var(--gold);padding-top:2px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__mis p{font-size:1.04rem;line-height:1.65}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd{padding:var(--pad) 0;background:#fff}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__g{display:grid;grid-template-columns:minmax(280px,.75fr) 1.25fr;gap:clamp(30px,5vw,80px);align-items:center}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__card{background:#fff;border-radius:26px;padding:clamp(32px,3.4vw,48px) 28px;text-align:center;
  border:1px solid var(--line);box-shadow:0 30px 60px -36px rgba(14,15,17,.25)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__ph{width:clamp(170px,18vw,240px);aspect-ratio:1;border-radius:50%;margin:0 auto;overflow:hidden;display:grid;place-items:center;
  background:linear-gradient(180deg,#F2EFE7,#E6E0D2);color:rgba(14,15,17,.14);box-shadow:0 0 0 6px #fff,0 0 0 7px rgba(212,175,55,.6)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__ph svg{width:40%}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__card b{display:block;margin-top:26px;font-family:var(--f-d);font-weight:800;color:var(--ink);font-size:1.12rem;letter-spacing:-.02em;line-height:1.3}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__card span{display:block;margin-top:4px;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);font-weight:600}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd .ab-h2{margin-top:14px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__q{margin-top:clamp(26px,3vw,36px);background:var(--cream);border-left:4px solid var(--gold);border-radius:4px 20px 20px 4px;padding:clamp(22px,2.6vw,32px) clamp(22px,3vw,36px)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__q p{font-family:var(--f-d);font-weight:700;letter-spacing:-.025em;line-height:1.3;color:var(--ink);font-size:clamp(1.2rem,1.9vw,1.6rem)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__f{display:grid;grid-template-columns:repeat(3,1fr);margin-top:clamp(26px,3vw,36px);list-style:none;padding:0}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__f li{padding:4px 20px;display:grid;gap:6px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__f li:first-child{padding-left:0}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__f li + li{border-left:1px solid var(--line)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__f b{font-family:var(--f-d);font-weight:800;font-size:clamp(1.6rem,2.6vw,2.2rem);letter-spacing:-.04em;line-height:1;
  background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;padding-bottom:.06em}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__f span{font-size:.95rem;line-height:1.4;color:var(--ink-2)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-tm{padding:var(--pad) 0;border-top:1px solid var(--line);background:#fff}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-tm .ab-h2{margin-bottom:clamp(28px,3.4vw,44px)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-tabs{display:inline-flex;gap:4px;padding:5px;border-radius:999px;background:var(--cream);border:1px solid var(--line);margin-bottom:clamp(24px,3vw,40px)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-tabs button{padding:13px 26px;border-radius:999px;font-family:var(--f-b);font-weight:600;font-size:.98rem;color:var(--ink-2);
  background:none;border:0;cursor:pointer;transition:background .35s var(--e),color .35s}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-tabs button.on{background:var(--gold-shine);color:var(--ink);box-shadow:0 6px 18px -8px rgba(143,112,29,.6)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-tabs button:not(.on):hover{color:var(--ink)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane{display:none;gap:clamp(14px,1.6vw,26px)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane.on{display:grid}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane--bod{grid-template-columns:repeat(3,1fr)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane--team{grid-template-columns:repeat(4,1fr)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pk{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:9/10;background:linear-gradient(180deg,#F2EFE7,#E9E4D8)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pk__face{position:absolute;inset:0;display:grid;place-items:center;color:rgba(14,15,17,.14)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pk__face svg{width:34%;margin-top:-12%}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pk__t{position:absolute;left:0;right:0;bottom:0;padding:90px 28px 26px;color:#fff;
  background:linear-gradient(180deg,rgba(14,15,17,0) 0%,rgba(14,15,17,.35) 45%,rgba(14,15,17,.72) 100%)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pk__t b{display:block;font-family:var(--f-d);font-weight:800;letter-spacing:-.025em;font-size:clamp(1.15rem,1.7vw,1.6rem);line-height:1.15}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pk__t span{display:block;margin-top:6px;font-size:1rem;color:rgba(255,255,255,.82)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pk__t span.tbc{color:var(--gold)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane--team .ab-pk__t{padding:70px 22px 20px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane--team .ab-pk__t b{font-size:clamp(1rem,1.3vw,1.2rem)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane--team .ab-pk__t span{font-size:.9rem}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__k2{margin-top:clamp(56px,7vw,90px)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__tw{margin-top:28px;list-style:none;padding:0}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__tw li{display:grid;grid-template-columns:52px 1fr;gap:12px;padding:20px 0;border-top:1px solid rgba(241,241,239,.1)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__tw li:last-child{border-bottom:1px solid rgba(241,241,239,.1)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-tk{width:24px;height:24px;border-radius:50%;border:1.5px solid var(--gold);color:var(--gold);display:grid;place-items:center;margin-top:1px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-tk svg{width:11px;height:11px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__tw p{font-size:1.04rem;line-height:1.65}
@media (max-width: 900px){
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__tw li{grid-template-columns:40px 1fr}
}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-cl{padding:var(--pad) 0;border-top:1px solid var(--line);background:#fff}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-cl .ab-h2{margin-bottom:clamp(32px,4vw,56px)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-cl__g{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-cl__p{background:var(--cream);border:1px solid var(--line);border-radius:22px;padding:28px 28px 0}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-cl__p header{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-cl__p header b{font-family:var(--f-d);font-weight:800;color:var(--ink);font-size:1.35rem;letter-spacing:-.02em}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-cl__p header span{font-family:var(--f-d);font-weight:800;font-size:2.2rem;letter-spacing:-.04em;line-height:1;
  background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;padding-bottom:.06em}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-cl__l{list-style:none;padding:6px 8px 32px 0;margin:0;max-height:420px;overflow-y:auto;overscroll-behavior:contain;
  scrollbar-width:thin;scrollbar-color:rgba(212,175,55,.6) transparent;
  -webkit-mask:linear-gradient(180deg,#000 85%,transparent);mask:linear-gradient(180deg,#000 85%,transparent)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-cl__l li{display:flex;gap:12px;align-items:baseline;padding:13px 0;border-bottom:1px solid var(--line);line-height:1.45;color:var(--ink)}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-cl__l li::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--gold);flex:0 0 auto;transform:translateY(-2px)}
@media (max-width: 900px){
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-cl__g{grid-template-columns:1fr}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-cl__l{max-height:360px}
}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm .ab-k{font-size:clamp(.92rem,1.1vw,1.08rem);letter-spacing:.14em}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg .ab-h2,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd .ab-h2{margin-top:0}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-cl .ab-h2{margin-top:0}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-hero__d,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg__t p,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__mis p,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__tw p,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__f span,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-cl__l li{font-size:17px}
@media (max-width: 900px){
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-hero__g,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg__g,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__g,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__g{grid-template-columns:1fr}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-hero__img{aspect-ratio:16/10}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__vis{position:static}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__mis li{grid-template-columns:40px 1fr}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__f{grid-template-columns:1fr;gap:16px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__f li,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__f li:first-child{padding:0}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__f li + li{border-left:0}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane--team{grid-template-columns:repeat(3,1fr)}
}
@media (max-width: 560px){
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane--bod{grid-template-columns:1fr}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane--team{grid-template-columns:1fr 1fr}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-tabs button{padding:11px 16px;font-size:.88rem}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane--bod .ab-pk__t b{font-size:1.25rem}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane--team .ab-pk__t{padding:50px 14px 14px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane--team .ab-pk__t b{font-size:.95rem}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane--team .ab-pk__t span{font-size:.78rem}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg__f li{grid-template-columns:96px 1fr}
}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg__f span,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-bg__f b,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-fd__card span,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pk__t span,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pk__t span.tbc,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane--team .ab-pk__t span,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-tabs button,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm__mis i,.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-vm .ab-k{font-size:17px}
@media (max-width: 560px){
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-pane--team .ab-pk__t b{font-size:17px}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-tabs button{padding:11px 14px}
}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-hero h1{margin-top:0}
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec) .ab-hero .ab-hero__img img{object-position:50% 50%}
.breakdance .hbt-abfd-sec .ab-fd__ph img{width:100%;height:100%;object-fit:cover}
.breakdance .hbt-abtm-sec .ab-pk__face img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%}
/* ── FASA 10 · Services — CSS dijana xcss.js dari style.css + services.css prototype FINAL ── */
.breakdance .bde-section:is(.hbt-svh-sec,.hbt-svl-sec)>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block:is(.hbt-svh-cb,.hbt-svl-cb){display:block;width:100%}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .btn__wa{display:inline-flex;align-items:center}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .btn__wa svg{width:18px;height:18px;display:block}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) section .sv-hero__img img{object-position:50% 78%}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-h2{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:.98;color:var(--ink);font-size:clamp(2.1rem,4.4vw,3.9rem)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-hero{background:#fff;padding:clamp(56px,9vh,110px) 0 clamp(64px,9vh,120px)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-hero__g{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);align-items:center}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-hero h1{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:.95;color:var(--ink);
  font-size:clamp(2.4rem,5.2vw,4.6rem);margin:0 0 22px;max-width:12ch}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-hero__d{max-width:46ch;font-size:17px;line-height:1.7;color:var(--ink-2)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-hero__b{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-hero__img{border-radius:28px;overflow:hidden;aspect-ratio:4/3.4}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-hero__img img{width:100%;height:100%;object-fit:cover;object-position:center 40%}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-btn-o{background:transparent;color:var(--gold-deep);box-shadow:inset 0 0 0 1.5px var(--gold)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-btn-o::before{background:var(--gold-shine)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-btn-o:hover{color:var(--ink)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-list{background:#fff;border-top:1px solid var(--line);padding:clamp(64px,8vw,110px) 0 clamp(40px,6vw,90px)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-g{display:grid;grid-template-columns:minmax(240px,300px) 1fr;gap:clamp(30px,6vw,100px);align-items:start}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav{position:sticky;top:calc(var(--nav-h) + 28px);display:flex;flex-direction:column}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a{display:flex;align-items:center;gap:14px;padding:16px 0;border-bottom:1px solid var(--line);font-size:17px;font-weight:500;color:var(--ink-2);transition:color .3s}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a:first-child{border-top:1px solid var(--line)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a i{margin-left:auto;width:0;height:2px;background:var(--gold);transition:width .45s var(--e)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a:hover{color:var(--ink)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a.on{color:var(--ink);font-weight:600}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a.on i{width:28px}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i{padding-bottom:clamp(64px,8vw,110px);scroll-margin-top:calc(var(--nav-h) + 28px)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i + .sv-i{padding-top:clamp(64px,8vw,110px);border-top:1px solid var(--line)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i h2{font-family:var(--f-d);font-weight:800;letter-spacing:-.035em;line-height:1.02;color:var(--ink);font-size:clamp(1.8rem,3.2vw,2.8rem);margin:0}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__img{border-radius:24px;overflow:hidden;aspect-ratio:16/8;margin:24px 0 30px}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__img img{width:100%;height:100%;object-fit:cover}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__b{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,4vw,56px);align-items:start}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i p{font-size:17px;line-height:1.7;color:var(--ink-2);margin:0}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-f{list-style:none;padding:0;margin:0}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-f li{display:flex;gap:12px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--line);color:var(--ink);font-size:17px;line-height:1.5}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-f li:first-child{border-top:1px solid var(--line)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-f li::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--gold);flex:0 0 auto;transform:translateY(-2px)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__cta{margin-top:30px}
@media (max-width: 900px){
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-hero__g,.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-g,.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__b{grid-template-columns:1fr}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav{display:none}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__img{aspect-ratio:16/10}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-hero__img{aspect-ratio:16/10}
}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__b{grid-template-columns:1fr;gap:24px}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i{display:flex;flex-direction:column}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i h2{order:1}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__b{order:2;margin-top:22px}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__cta{order:3}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__img{order:4;margin:36px 0 0}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav{gap:6px;padding:8px;border-radius:20px;background:var(--cream);border:1px solid var(--line)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a,.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a:first-child{border:0;padding:15px 18px;border-radius:14px;justify-content:space-between;transition:background .35s,color .3s,box-shadow .35s}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a i{display:none}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a::after{content:'\2192';opacity:0;transform:translateX(-6px);transition:opacity .3s,transform .4s var(--e)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a:hover{background:#fff;color:var(--ink)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a.on{background:var(--gold-shine);color:var(--ink);font-weight:600;box-shadow:0 10px 24px -14px rgba(143,112,29,.7)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a.on::after{opacity:1;transform:none}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav{background:var(--petrol-1);border:0;border-radius:22px;padding:22px 10px 10px;color:var(--on-dark-2)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a,.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a:first-child{color:var(--on-dark-2)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a:hover{background:rgba(255,255,255,.06);color:var(--on-dark)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a.on{background:var(--gold-shine);color:var(--ink);font-weight:600;box-shadow:0 10px 24px -12px rgba(212,175,55,.55)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-g{grid-template-columns:minmax(280px,340px) 1fr}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a,.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a:first-child{position:relative;padding-right:40px;white-space:nowrap}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a::after{position:absolute;right:16px;top:50%;margin-top:-.75em;line-height:1.5}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i{display:grid;grid-template-columns:clamp(150px,16vw,220px) 1fr;column-gap:clamp(22px,2.6vw,36px);row-gap:0;
  grid-template-areas:"img t" "img p" "f f" "c c";align-items:start}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__b{display:contents}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i h2{grid-area:t;align-self:end}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i p{grid-area:p;margin-top:14px}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i .sv-f{grid-area:f;margin-top:30px}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__cta{grid-area:c}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__img{grid-area:img;aspect-ratio:1/1;margin:0;border-radius:20px}
@media (max-width: 900px){
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i{grid-template-columns:1fr;grid-template-areas:"img" "t" "p" "f" "c"}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__img{aspect-ratio:16/10;margin-bottom:22px}
}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i h2{align-self:start;margin-top:4px}
@media (min-width: 901px){
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i{grid-template-columns:1fr clamp(150px,16vw,220px);grid-template-areas:"t img" "p img" "f f" "c c"}
}
@media (min-width: 901px){
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i{grid-template-rows:auto 1fr auto auto}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i p{align-self:start}
}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-i__cta{display:flex;gap:12px;flex-wrap:wrap}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-btn-o .btn__wa svg{width:18px;height:18px;display:block}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-head{margin-bottom:clamp(36px,4.4vw,60px)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-hero h1{max-width:14ch}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-hero h1{max-width:17ch}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-hero__g{grid-template-columns:1.1fr 1fr}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-hero h1{font-size:clamp(2.4rem,4.4vw,4rem)}
@media (max-width: 900px){
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-hero__g{grid-template-columns:1fr}
}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) section .sv-hero__img img[src*="hero-services"]{object-position:center 35%}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav{padding:10px}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-proj{margin-top:26px;padding:22px 24px;border-radius:18px;background:#fff;border:1px solid rgba(212,175,55,.45);border-left:3px solid var(--gold)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-proj b{display:block;font-family:var(--f-d);font-weight:800;color:var(--ink);font-size:18px;letter-spacing:-.01em;margin-bottom:14px}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-proj ul{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-proj li{position:relative;padding-left:26px;font-size:16px;line-height:1.45;color:var(--ink-2)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-proj li::before{content:'';position:absolute;left:0;top:3px;width:16px;height:16px;border-radius:50%;background:var(--gold-shine)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-proj li::after{content:'';position:absolute;left:5.5px;top:6.5px;width:4px;height:7px;border:solid var(--ink);border-width:0 1.6px 1.6px 0;transform:rotate(45deg)}
@media (max-width: 600px){
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-proj ul{grid-template-columns:1fr}
}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) #cctv{grid-template-areas:"t img" "p img" "f f" "pr pr" "c c"}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) #cctv .sv-proj{grid-area:pr;margin-top:24px;margin-bottom:6px}
@media (max-width: 900px){
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) #cctv{grid-template-areas:"img" "t" "p" "f" "pr" "c"}
}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) #cctv .sv-proj{padding:0;border:0;border-radius:0;background:none;margin-top:30px}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) #cctv .sv-proj ul{grid-template-columns:1fr;gap:12px}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) #cctv .sv-proj li{padding-left:36px;line-height:24px}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) #cctv .sv-proj li::before{top:0;width:24px;height:24px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--gold)}
.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) #cctv .sv-proj li::after{left:9.5px;top:6px;width:5px;height:9px;border-color:var(--gold-deep);border-width:0 2px 2px 0}
html:not([lang^="en"]) body.breakdance :is(.hbt-svh-sec,.hbt-svl-sec) .sv-nav a{white-space:normal;line-height:1.3}
/* ── FASA 10 · Training — CSS dijana xcss.js dari style.css + services.css,training.css prototype FINAL ── */
.breakdance .bde-section:is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec)>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block:is(.hbt-trh-cb,.hbt-trl-cb,.hbt-trq-cb){display:block;width:100%}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec){--sand: #E4E4E2; --cream: #F7F7F5; --bone: #EFEFED; --ink: #0E0F11; --ink-2: #5B5D62; --line: rgba(14,15,17,.14); --petrol-1: radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%); --petrol-2: linear-gradient(45deg,#1F2023 0%,#4D4F54 100%); --petrol-3: linear-gradient(109.6deg,rgba(5,5,6,.95) 11.2%,#35373B 78.9%); --on-dark: #F1F1EF; --on-dark-2: rgba(241,241,239,.72); --deep: linear-gradient(180deg,#0A0A0C 0%,#000000 100%); --gold: #D4AF37; --gold-deep: #8F701D; --gold-shine: linear-gradient(180deg,#f9e6a3 0%,#d4af37 45%,#a8791f 100%); --gold-shine-h: linear-gradient(90deg,transparent 0%,var(--gold) 14%,#fff3c4 50%,var(--gold) 86%,transparent 100%); --gold-shine-deep: linear-gradient(180deg,#caa23a 0%,#8f701d 55%,#6b5216 100%); --gold-text: linear-gradient(180deg,#e9c55c 0%,#c99a2e 48%,#8f701d 100%); --hero-scrim: linear-gradient(180deg, rgba(10,10,12,.74) 0%, rgba(10,10,12,.28) 42%, rgba(138,110,47,.45) 74%, rgba(10,10,12,.97) 100%); --gold-shine-rich: radial-gradient(ellipse farthest-corner at right bottom,#FEDB37 0%,#FDB931 8%,#9f7928 30%,#8A6E2F 40%,transparent 80%), radial-gradient(ellipse farthest-corner at left top,#FFFFFF 0%,#FFFFAC 8%,#D1B464 25%,#5d4a1f 62.5%,#5d4a1f 100%); --f-d: 'Archivo HBT','Noto Sans SC',sans-serif; --f-b: 'Inter HBT','Noto Sans SC',sans-serif; --f-m: 'Inter HBT','Noto Sans SC',sans-serif; --r-sm: 6px; --r: 10px; --r-lg: 18px; --e: cubic-bezier(.16,1,.3,1); --pad: clamp(104px,13vw,180px); --gut: clamp(22px,4.5vw,56px); --nav-h: 100px;font-family:var(--f-b);color:var(--ink-2);line-height:1.7;-webkit-font-smoothing:antialiased}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) *,.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) ::before,.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) ::after{box-sizing:border-box;margin:0;padding:0}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) img{display:block;max-width:100%}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) a{color:inherit;text-decoration:none}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .wrap{max-width:1380px;margin:0 auto;padding:0 var(--gut)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) :focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .r{border-radius:var(--r)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) h1,.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) h2{font-family:var(--f-d);color:var(--ink);letter-spacing:-.038em;line-height:.88;font-weight:800}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .mute{background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;padding-bottom:.08em}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn{position:relative;display:inline-flex;align-items:center;gap:12px;padding:17px 30px;
  border:0;outline:0;appearance:none;-webkit-appearance:none;font-family:var(--f-m);
  font-size:.6875rem;text-transform:uppercase;letter-spacing:.15em;cursor:pointer;
  background:var(--ink);color:var(--cream);overflow:hidden;isolation:isolate;will-change:transform}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn::before{content:'';position:absolute;inset:0;background:var(--gold-shine);transform:scaleX(0);
  transform-origin:left;transition:transform .6s var(--e);z-index:-1}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn:hover::before{transform:scaleX(1)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn:hover{color:var(--ink)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn .ar{transition:transform .5s var(--e)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn:hover .ar{transform:translateX(7px)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn--gold{position:relative}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn--gold::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.65) 48%,transparent 66%);
  transform:translateX(-140%);transition:transform .85s var(--e)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn--gold:hover::after{transform:translateX(140%)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn--gold{background:var(--gold-shine);color:var(--ink)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn--gold::before{background:var(--on-dark)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .up{will-change:transform,opacity}
@media (prefers-reduced-motion: reduce){
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) *{animation:none!important;transition:none!important}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .up,.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) img{transform:none!important;opacity:1!important}
}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn--gold::before{background:var(--petrol-3)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn--gold:hover{color:var(--gold);box-shadow:inset 0 0 0 1px rgba(212,175,55,.55)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn{font-size:16px;letter-spacing:.02em;padding:15px 28px}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn{white-space:nowrap}
@media (max-width: 480px){
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn{padding:14px 20px;gap:10px}
}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn{font-size:15px;letter-spacing:0}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn{font-weight:500}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .btn{font-weight:600}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .pg-hero{background:#fff;padding:clamp(56px,9vh,110px) 0 clamp(64px,9vh,120px)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .pg-hero__g{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);align-items:center}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .pg-hero h1{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:.95;color:var(--ink);font-size:clamp(2.4rem,5.2vw,4.6rem);margin:0 0 22px;max-width:12ch}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .pg-hero__d{max-width:46ch;font-size:17px;line-height:1.7;color:var(--ink-2)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .pg-hero__b{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .pg-hero__img{border-radius:28px;overflow:hidden;aspect-ratio:4/3.4}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .pg-hero__img img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
@media (max-width: 900px){
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .pg-hero__g{grid-template-columns:1fr}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .pg-hero__img{aspect-ratio:16/10}
}
html[lang^="zh"] body.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) :is(h1, h2, h3, h4){letter-spacing:0;line-height:1.12}
html:not([lang^="en"]) body.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) :is(h1, h2, h3){text-wrap:balance}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-h2{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:.98;color:var(--ink);font-size:clamp(2.1rem,4.4vw,3.9rem)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-list{background:#fff;border-top:1px solid var(--line);padding:clamp(64px,8vw,110px) 0 clamp(40px,6vw,90px)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-g{display:grid;grid-template-columns:minmax(240px,300px) 1fr;gap:clamp(30px,6vw,100px);align-items:start}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav{position:sticky;top:calc(var(--nav-h) + 28px);display:flex;flex-direction:column}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a{display:flex;align-items:center;gap:14px;padding:16px 0;border-bottom:1px solid var(--line);font-size:17px;font-weight:500;color:var(--ink-2);transition:color .3s}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a:first-child{border-top:1px solid var(--line)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a i{margin-left:auto;width:0;height:2px;background:var(--gold);transition:width .45s var(--e)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a:hover{color:var(--ink)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a.on{color:var(--ink);font-weight:600}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a.on i{width:28px}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i{padding-bottom:clamp(64px,8vw,110px);scroll-margin-top:calc(var(--nav-h) + 28px)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i + .sv-i{padding-top:clamp(64px,8vw,110px);border-top:1px solid var(--line)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i h2{font-family:var(--f-d);font-weight:800;letter-spacing:-.035em;line-height:1.02;color:var(--ink);font-size:clamp(1.8rem,3.2vw,2.8rem);margin:0}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i__img{border-radius:24px;overflow:hidden;aspect-ratio:16/8;margin:24px 0 30px}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i__img img{width:100%;height:100%;object-fit:cover}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i__b{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,4vw,56px);align-items:start}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i p{font-size:17px;line-height:1.7;color:var(--ink-2);margin:0}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-f{list-style:none;padding:0;margin:0}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-f li{display:flex;gap:12px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--line);color:var(--ink);font-size:17px;line-height:1.5}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-f li:first-child{border-top:1px solid var(--line)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-f li::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--gold);flex:0 0 auto;transform:translateY(-2px)}
@media (max-width: 900px){
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-g,.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i__b{grid-template-columns:1fr}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav{display:none}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i__img{aspect-ratio:16/10}
}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i__b{grid-template-columns:1fr;gap:24px}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i{display:flex;flex-direction:column}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i h2{order:1}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i__b{order:2;margin-top:22px}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i__img{order:4;margin:36px 0 0}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav{gap:6px;padding:8px;border-radius:20px;background:var(--cream);border:1px solid var(--line)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a,.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a:first-child{border:0;padding:15px 18px;border-radius:14px;justify-content:space-between;transition:background .35s,color .3s,box-shadow .35s}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a i{display:none}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a::after{content:'\2192';opacity:0;transform:translateX(-6px);transition:opacity .3s,transform .4s var(--e)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a:hover{background:#fff;color:var(--ink)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a.on{background:var(--gold-shine);color:var(--ink);font-weight:600;box-shadow:0 10px 24px -14px rgba(143,112,29,.7)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a.on::after{opacity:1;transform:none}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav{background:var(--petrol-1);border:0;border-radius:22px;padding:22px 10px 10px;color:var(--on-dark-2)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a,.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a:first-child{color:var(--on-dark-2)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a:hover{background:rgba(255,255,255,.06);color:var(--on-dark)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a.on{background:var(--gold-shine);color:var(--ink);font-weight:600;box-shadow:0 10px 24px -12px rgba(212,175,55,.55)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-g{grid-template-columns:minmax(280px,340px) 1fr}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a,.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a:first-child{position:relative;padding-right:40px;white-space:nowrap}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a::after{position:absolute;right:16px;top:50%;margin-top:-.75em;line-height:1.5}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i{display:grid;grid-template-columns:clamp(150px,16vw,220px) 1fr;column-gap:clamp(22px,2.6vw,36px);row-gap:0;
  grid-template-areas:"img t" "img p" "f f" "c c";align-items:start}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i__b{display:contents}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i h2{grid-area:t;align-self:end}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i p{grid-area:p;margin-top:14px}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i .sv-f{grid-area:f;margin-top:30px}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i__img{grid-area:img;aspect-ratio:1/1;margin:0;border-radius:20px}
@media (max-width: 900px){
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i{grid-template-columns:1fr;grid-template-areas:"img" "t" "p" "f" "c"}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i__img{aspect-ratio:16/10;margin-bottom:22px}
}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i h2{align-self:start;margin-top:4px}
@media (min-width: 901px){
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i{grid-template-columns:1fr clamp(150px,16vw,220px);grid-template-areas:"t img" "p img" "f f" "c c"}
}
@media (min-width: 901px){
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i{grid-template-rows:auto 1fr auto auto}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i p{align-self:start}
}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-head{margin-bottom:clamp(36px,4.4vw,60px)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav{padding:10px}
html:not([lang^="en"]) body.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-nav a{white-space:normal;line-height:1.3}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-h2{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:.98;color:var(--ink);font-size:clamp(2.1rem,4.2vw,3.6rem)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .pg-hero h1{max-width:13ch}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-q{background:#fff;border-top:1px solid var(--line);padding:clamp(70px,8vw,110px) 0}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-q__top{display:flex;justify-content:space-between;align-items:end;gap:30px;flex-wrap:wrap}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-q__g{list-style:none;padding:0;margin-top:clamp(36px,4.5vw,56px);display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-q__g li{border:1px solid rgba(212,175,55,.45);border-radius:20px;padding:28px 24px}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-q__g svg{width:54px;height:54px;padding:13px;border-radius:14px;background:#FBF6E6;stroke:var(--gold-deep);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-q__g b{display:block;margin-top:22px;font-family:var(--f-d);font-weight:800;font-size:20px;letter-spacing:-.01em;color:var(--ink)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-q__g span{display:block;margin-top:6px;font-size:17px;line-height:1.5;color:var(--ink-2)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-mods{margin-top:26px}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-mods > b{display:block;font-family:var(--f-d);font-weight:800;font-size:18px;color:var(--ink);margin-bottom:14px}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-mod{list-style:none;padding:0;counter-reset:m;display:grid;grid-template-columns:1fr 1fr;gap:0 28px;border-top:1px solid var(--line)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-mod li{counter-increment:m;display:flex;gap:12px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--line);font-size:16px;line-height:1.45;color:var(--ink)}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-mod li::before{content:counter(m,decimal-leading-zero);font-family:var(--f-d);font-weight:800;font-size:14px;color:var(--gold-deep);flex:0 0 22px}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .sv-i .tr-mods{grid-area:f}
@media (max-width: 1000px){
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-q__g{grid-template-columns:1fr 1fr}
}
@media (max-width: 600px){
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-mod{grid-template-columns:1fr}
}
@media (min-width: 901px){
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) #electronic{grid-template-areas:"t img" "f img"}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) #electronic .tr-mod{grid-template-columns:1fr}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) #electronic h2{align-self:start}
}
@media (max-width: 600px){
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-q__g{grid-template-columns:1fr}
.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-q__g li{padding:24px 22px}
}
html[lang^="ms"] body.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-q__g li{container-type:inline-size}
html[lang^="ms"] body.breakdance :is(.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec) .tr-q__g b{font-size:max(16px,min(20px,calc(100cqi / 11.8)));line-height:1.25}
.breakdance .hbt-trq-sec .tr-q__g .tr-q__ic{display:block;width:54px;height:54px;padding:13px;border-radius:14px;background:#FBF6E6;object-fit:contain}
/* body{font-size:17px} page About/Services/Training (about.css 141, services.css 7) */
.breakdance :is(.hbt-abh-sec,.hbt-abbg-sec,.hbt-abvm-sec,.hbt-abfd-sec,.hbt-abtm-sec,.hbt-abcl-sec,.hbt-svh-sec,.hbt-svl-sec,.hbt-trh-sec,.hbt-trl-sec,.hbt-trq-sec){font-size:17px}
/* FIX prototype (Desa 29 Okt): services.css baris 76 .sv-g{minmax(280px,340px) 1fr} mengatasi @media(max-width:900px) → 768–900px kandungan sempit 340px + lajur kosong. Kembalikan 1 lajur ≤900px. */
@media (max-width: 900px){.breakdance :is(.hbt-svl-sec,.hbt-trl-sec) .sv-g{grid-template-columns:1fr}}

/* ── FASA 10 · Gallery — CSS dijana xcss.js dari style.css + gallery.css prototype FINAL ── */
.breakdance .bde-section:is(.hbt-glh-sec,.hbt-gll-sec)>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block:is(.hbt-glh-cb,.hbt-gll-cb){display:block;width:100%}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec){--sand: #E4E4E2; --cream: #F7F7F5; --bone: #EFEFED; --ink: #0E0F11; --ink-2: #5B5D62; --line: rgba(14,15,17,.14); --petrol-1: radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%); --petrol-2: linear-gradient(45deg,#1F2023 0%,#4D4F54 100%); --petrol-3: linear-gradient(109.6deg,rgba(5,5,6,.95) 11.2%,#35373B 78.9%); --on-dark: #F1F1EF; --on-dark-2: rgba(241,241,239,.72); --deep: linear-gradient(180deg,#0A0A0C 0%,#000000 100%); --gold: #D4AF37; --gold-deep: #8F701D; --gold-shine: linear-gradient(180deg,#f9e6a3 0%,#d4af37 45%,#a8791f 100%); --gold-shine-h: linear-gradient(90deg,transparent 0%,var(--gold) 14%,#fff3c4 50%,var(--gold) 86%,transparent 100%); --gold-shine-deep: linear-gradient(180deg,#caa23a 0%,#8f701d 55%,#6b5216 100%); --gold-text: linear-gradient(180deg,#e9c55c 0%,#c99a2e 48%,#8f701d 100%); --hero-scrim: linear-gradient(180deg, rgba(10,10,12,.74) 0%, rgba(10,10,12,.28) 42%, rgba(138,110,47,.45) 74%, rgba(10,10,12,.97) 100%); --gold-shine-rich: radial-gradient(ellipse farthest-corner at right bottom,#FEDB37 0%,#FDB931 8%,#9f7928 30%,#8A6E2F 40%,transparent 80%), radial-gradient(ellipse farthest-corner at left top,#FFFFFF 0%,#FFFFAC 8%,#D1B464 25%,#5d4a1f 62.5%,#5d4a1f 100%); --f-d: 'Archivo HBT','Noto Sans SC',sans-serif; --f-b: 'Inter HBT','Noto Sans SC',sans-serif; --f-m: 'Inter HBT','Noto Sans SC',sans-serif; --r-sm: 6px; --r: 10px; --r-lg: 18px; --e: cubic-bezier(.16,1,.3,1); --pad: clamp(104px,13vw,180px); --gut: clamp(22px,4.5vw,56px); --nav-h: 100px;font-family:var(--f-b);color:var(--ink-2);line-height:1.7;-webkit-font-smoothing:antialiased}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) *,.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) ::before,.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) ::after{box-sizing:border-box;margin:0;padding:0}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) img{display:block;max-width:100%}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) a{color:inherit;text-decoration:none}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) button{font:inherit}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .wrap{max-width:1380px;margin:0 auto;padding:0 var(--gut)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) :focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .r{border-radius:var(--r)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) h1,.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) h2,.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) h3{font-family:var(--f-d);color:var(--ink);letter-spacing:-.038em;line-height:.88;font-weight:800}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .mute{background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;padding-bottom:.08em}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn{position:relative;display:inline-flex;align-items:center;gap:12px;padding:17px 30px;
  border:0;outline:0;appearance:none;-webkit-appearance:none;font-family:var(--f-m);
  font-size:.6875rem;text-transform:uppercase;letter-spacing:.15em;cursor:pointer;
  background:var(--ink);color:var(--cream);overflow:hidden;isolation:isolate;will-change:transform}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn::before{content:'';position:absolute;inset:0;background:var(--gold-shine);transform:scaleX(0);
  transform-origin:left;transition:transform .6s var(--e);z-index:-1}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn:hover::before{transform:scaleX(1)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn:hover{color:var(--ink)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn .ar{transition:transform .5s var(--e)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn:hover .ar{transform:translateX(7px)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn--gold{position:relative}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn--gold::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.65) 48%,transparent 66%);
  transform:translateX(-140%);transition:transform .85s var(--e)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn--gold:hover::after{transform:translateX(140%)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn--gold{background:var(--gold-shine);color:var(--ink)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn--gold::before{background:var(--on-dark)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .up{will-change:transform,opacity}
@media (prefers-reduced-motion: reduce){
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) *{animation:none!important;transition:none!important}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .up,.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) img{transform:none!important;opacity:1!important}
}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn--gold::before{background:var(--petrol-3)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn--gold:hover{color:var(--gold);box-shadow:inset 0 0 0 1px rgba(212,175,55,.55)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn{font-size:16px;letter-spacing:.02em;padding:15px 28px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn{white-space:nowrap}
@media (max-width: 480px){
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn{padding:14px 20px;gap:10px}
}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn{font-size:15px;letter-spacing:0}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn{font-weight:500}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .btn{font-weight:600}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .pg-hero{background:#fff;padding:clamp(56px,9vh,110px) 0 clamp(64px,9vh,120px)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .pg-hero__g{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);align-items:center}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .pg-hero h1{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:.95;color:var(--ink);font-size:clamp(2.4rem,5.2vw,4.6rem);margin:0 0 22px;max-width:12ch}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .pg-hero__d{max-width:46ch;font-size:17px;line-height:1.7;color:var(--ink-2)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .pg-hero__b{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .pg-hero__img{border-radius:28px;overflow:hidden;aspect-ratio:4/3.4}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .pg-hero__img img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
@media (max-width: 900px){
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .pg-hero__g{grid-template-columns:1fr}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .pg-hero__img{aspect-ratio:16/10}
}
html[lang^="zh"] body.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) :is(h1, h2, h3, h4){letter-spacing:0;line-height:1.12}
html:not([lang^="en"]) body.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) :is(h1, h2, h3){text-wrap:balance}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl{background:#fff;padding-bottom:clamp(70px,8vw,110px)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-i{display:block;break-inside:avoid;margin-bottom:16px;border-radius:16px;overflow:hidden;background:var(--cream);position:relative}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-i[hidden]{display:none}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-i img{display:block;width:100%;height:auto;transition:transform .6s var(--e)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-i:hover img{transform:scale(1.04)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-i::after{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 0 var(--gold);transition:box-shadow .3s}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-i:hover::after{box-shadow:inset 0 0 0 2px var(--gold)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb{position:fixed;inset:0;z-index:2000;background:rgba(5,5,6,.92);display:flex;align-items:center;justify-content:center;padding:60px 80px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb[hidden]{display:none}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb img{max-width:100%;max-height:100%;border-radius:12px;object-fit:contain}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb button{position:absolute;border:0;cursor:pointer;width:52px;height:52px;border-radius:50%;background:var(--gold-shine);color:var(--ink);font-size:22px;font-weight:600;display:grid;place-items:center}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb__x{top:20px;right:20px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb__p{left:20px;top:50%;margin-top:-26px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb__n{right:20px;top:50%;margin-top:-26px}
@media (max-width: 600px){
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb{padding:70px 12px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb__p,.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb__n{top:auto;bottom:16px;margin-top:0}
}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-i{margin:0;aspect-ratio:1/1}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-i img{width:100%;height:100%;object-fit:cover}
@media (max-width: 600px){
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-i{border-radius:12px}
}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl{padding-top:clamp(10px,2vw,30px)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev + .gl-ev{margin-top:40px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev h3{font-family:var(--f-d);font-weight:800;font-size:24px;letter-spacing:-.02em;color:var(--ink);line-height:1.2}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g{margin-top:16px;display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:200px 200px;gap:12px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g .gl-i{aspect-ratio:auto;border-radius:14px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g .gl-i:first-child{grid-row:1/3}
@media (max-width: 900px){
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev h3{font-size:20px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g{grid-template-columns:1fr 1fr;grid-template-rows:190px 140px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g .gl-i:first-child{grid-column:1/3;grid-row:auto}
}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g{grid-template-columns:repeat(3,1fr);grid-template-rows:none}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g .gl-i,.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g .gl-i:first-child{grid-row:auto;grid-column:auto;aspect-ratio:1/1}
@media (max-width: 900px){
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g{grid-template-columns:repeat(3,1fr);grid-template-rows:none;gap:8px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g .gl-i{border-radius:10px}
}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g{margin-top:14px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-head{margin-bottom:clamp(36px,4vw,56px)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-h2{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:.98;color:var(--ink);font-size:clamp(2.1rem,4.2vw,3.6rem)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .pg-hero h1{max-width:14ch}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl{border-top:1px solid var(--line);padding-top:clamp(64px,8vw,110px)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-sg{display:grid;grid-template-columns:minmax(280px,340px) 1fr;gap:clamp(30px,6vw,100px);align-items:start}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav{position:sticky;top:calc(var(--nav-h) + 28px);display:flex;flex-direction:column;gap:4px;padding:10px;
  border-radius:22px;background:var(--petrol-1);color:var(--on-dark-2);
  max-height:calc(100vh - var(--nav-h) - 56px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(212,175,55,.5) transparent}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav a{position:relative;display:flex;align-items:center;padding:11px 40px 11px 18px;border-radius:14px;font-size:16px;font-weight:500;line-height:1.3;
  color:var(--on-dark-2);transition:background .35s,color .3s,box-shadow .35s}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav a::after{content:'\2192';position:absolute;right:16px;top:50%;margin-top:-.75em;line-height:1.5;opacity:0;transform:translateX(-6px);transition:opacity .3s,transform .4s var(--e)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav a:hover{background:rgba(255,255,255,.06);color:var(--on-dark)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav a.on{background:var(--gold-shine);color:var(--ink);font-weight:600;box-shadow:0 10px 24px -12px rgba(212,175,55,.55)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav a.on::after{opacity:1;transform:none}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev{padding-bottom:clamp(56px,6vw,90px);scroll-margin-top:calc(var(--nav-h) + 28px)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev + .gl-ev{margin-top:0;padding-top:clamp(56px,6vw,90px);border-top:1px solid var(--line)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev h3{font-family:var(--f-d);font-weight:800;letter-spacing:-.035em;line-height:1.02;color:var(--ink);font-size:clamp(1.8rem,3.2vw,2.8rem);margin:0}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g{margin-top:26px;gap:16px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g .gl-i{border-radius:20px}
@media (max-width: 900px){
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-sg{grid-template-columns:1fr}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav{display:none}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g{gap:8px;margin-top:18px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-ev__g .gl-i{border-radius:12px}
}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb{padding:96px 80px 60px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb__top{position:absolute;top:20px;left:20px;right:88px;min-height:52px;display:flex;align-items:center;gap:14px;color:var(--on-dark)}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb__t{font-family:var(--f-d);font-weight:800;font-size:clamp(18px,2vw,24px);letter-spacing:-.02em;line-height:1.2}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb__c{margin-left:auto;flex:0 0 auto;font-size:14px;color:var(--on-dark-2);font-variant-numeric:tabular-nums}
@media (max-width: 600px){
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb{padding:96px 12px 84px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb__top{left:14px;top:16px;right:80px;gap:10px;align-items:flex-start;flex-wrap:wrap}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb__c{margin-left:0}
}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav{padding-top:10px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav{max-height:min(420px,calc(100vh - var(--nav-h) - 56px))}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb__top{left:88px;right:88px;flex-direction:column;justify-content:center;gap:4px;text-align:center}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb__c{margin-left:0;font-size:13px}
@media (max-width: 600px){
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-lb__top{left:72px;right:72px;top:16px;align-items:center}
}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav{gap:6px;padding:10px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav a{padding:15px 40px 15px 18px;font-size:17px;border-radius:14px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav a::after{right:16px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav{scrollbar-width:auto;scrollbar-color:auto}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav::-webkit-scrollbar{width:4px}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav::-webkit-scrollbar-button{display:none;width:0;height:0}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav::-webkit-scrollbar-track{background:transparent;margin:18px 0}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav::-webkit-scrollbar-thumb{background:rgba(212,175,55,.5);border-radius:4px}
@supports (-moz-appearance:none){
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec) .gl-nav{scrollbar-width:thin;scrollbar-color:rgba(212,175,55,.5) transparent}
}
.breakdance :is(.hbt-glh-sec,.hbt-gll-sec){font-size:17px}
html.gl-lock,html.gl-lock body{overflow:hidden}

/* ── FASA 10 · Articles — CSS dijana xcss.js dari style.css + articles.css prototype FINAL ── */
.breakdance .bde-section:is(.hbt-ath-sec,.hbt-atl-sec)>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block:is(.hbt-ath-cb,.hbt-atl-cb){display:block;width:100%}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec){--sand: #E4E4E2; --cream: #F7F7F5; --bone: #EFEFED; --ink: #0E0F11; --ink-2: #5B5D62; --line: rgba(14,15,17,.14); --petrol-1: radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%); --petrol-2: linear-gradient(45deg,#1F2023 0%,#4D4F54 100%); --petrol-3: linear-gradient(109.6deg,rgba(5,5,6,.95) 11.2%,#35373B 78.9%); --on-dark: #F1F1EF; --on-dark-2: rgba(241,241,239,.72); --deep: linear-gradient(180deg,#0A0A0C 0%,#000000 100%); --gold: #D4AF37; --gold-deep: #8F701D; --gold-shine: linear-gradient(180deg,#f9e6a3 0%,#d4af37 45%,#a8791f 100%); --gold-shine-h: linear-gradient(90deg,transparent 0%,var(--gold) 14%,#fff3c4 50%,var(--gold) 86%,transparent 100%); --gold-shine-deep: linear-gradient(180deg,#caa23a 0%,#8f701d 55%,#6b5216 100%); --gold-text: linear-gradient(180deg,#e9c55c 0%,#c99a2e 48%,#8f701d 100%); --hero-scrim: linear-gradient(180deg, rgba(10,10,12,.74) 0%, rgba(10,10,12,.28) 42%, rgba(138,110,47,.45) 74%, rgba(10,10,12,.97) 100%); --gold-shine-rich: radial-gradient(ellipse farthest-corner at right bottom,#FEDB37 0%,#FDB931 8%,#9f7928 30%,#8A6E2F 40%,transparent 80%), radial-gradient(ellipse farthest-corner at left top,#FFFFFF 0%,#FFFFAC 8%,#D1B464 25%,#5d4a1f 62.5%,#5d4a1f 100%); --f-d: 'Archivo HBT','Noto Sans SC',sans-serif; --f-b: 'Inter HBT','Noto Sans SC',sans-serif; --f-m: 'Inter HBT','Noto Sans SC',sans-serif; --r-sm: 6px; --r: 10px; --r-lg: 18px; --e: cubic-bezier(.16,1,.3,1); --pad: clamp(104px,13vw,180px); --gut: clamp(22px,4.5vw,56px); --nav-h: 100px;font-family:var(--f-b);color:var(--ink-2);line-height:1.7;-webkit-font-smoothing:antialiased}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) *,.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) ::before,.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) ::after{box-sizing:border-box;margin:0;padding:0}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) img{display:block;max-width:100%}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) a{color:inherit;text-decoration:none}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .wrap{max-width:1380px;margin:0 auto;padding:0 var(--gut)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) :focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .r{border-radius:var(--r)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) h1,.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) h2,.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) h3{font-family:var(--f-d);color:var(--ink);letter-spacing:-.038em;line-height:.88;font-weight:800}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .mute{background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;padding-bottom:.08em}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn{position:relative;display:inline-flex;align-items:center;gap:12px;padding:17px 30px;
  border:0;outline:0;appearance:none;-webkit-appearance:none;font-family:var(--f-m);
  font-size:.6875rem;text-transform:uppercase;letter-spacing:.15em;cursor:pointer;
  background:var(--ink);color:var(--cream);overflow:hidden;isolation:isolate;will-change:transform}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn::before{content:'';position:absolute;inset:0;background:var(--gold-shine);transform:scaleX(0);
  transform-origin:left;transition:transform .6s var(--e);z-index:-1}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn:hover::before{transform:scaleX(1)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn:hover{color:var(--ink)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn .ar{transition:transform .5s var(--e)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn:hover .ar{transform:translateX(7px)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn--gold{position:relative}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn--gold::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.65) 48%,transparent 66%);
  transform:translateX(-140%);transition:transform .85s var(--e)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn--gold:hover::after{transform:translateX(140%)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn--gold{background:var(--gold-shine);color:var(--ink)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn--gold::before{background:var(--on-dark)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .up{will-change:transform,opacity}
@media (prefers-reduced-motion: reduce){
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) *{animation:none!important;transition:none!important}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .up,.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) img{transform:none!important;opacity:1!important}
}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn--gold::before{background:var(--petrol-3)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn--gold:hover{color:var(--gold);box-shadow:inset 0 0 0 1px rgba(212,175,55,.55)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn{font-size:16px;letter-spacing:.02em;padding:15px 28px}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn{white-space:nowrap}
@media (max-width: 480px){
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn{padding:14px 20px;gap:10px}
}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn{font-size:15px;letter-spacing:0}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn{font-weight:500}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .btn{font-weight:600}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .pg-hero{background:#fff;padding:clamp(56px,9vh,110px) 0 clamp(64px,9vh,120px)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .pg-hero__g{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);align-items:center}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .pg-hero h1{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:.95;color:var(--ink);font-size:clamp(2.4rem,5.2vw,4.6rem);margin:0 0 22px;max-width:12ch}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .pg-hero__d{max-width:46ch;font-size:17px;line-height:1.7;color:var(--ink-2)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .pg-hero__b{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .pg-hero__img{border-radius:28px;overflow:hidden;aspect-ratio:4/3.4}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .pg-hero__img img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
@media (max-width: 900px){
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .pg-hero__g{grid-template-columns:1fr}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .pg-hero__img{aspect-ratio:16/10}
}
html[lang^="zh"] body.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) :is(h1, h2, h3, h4){letter-spacing:0;line-height:1.12}
html:not([lang^="en"]) body.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) :is(h1, h2, h3){text-wrap:balance}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .pg-hero__img img[src*="articles-hero"]{object-position:center 65%}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at{background:#fff;border-top:1px solid var(--line);padding:clamp(64px,8vw,110px) 0}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(30px,3.6vw,48px)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-h2{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:.98;color:var(--ink);font-size:clamp(2.1rem,4.2vw,3.6rem)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c{display:flex;flex-direction:column;border:1px solid rgba(212,175,55,.45);border-radius:22px;overflow:hidden;background:#fff;transition:box-shadow .4s var(--e),transform .4s var(--e)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c[hidden]{display:none}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c:hover{box-shadow:0 22px 44px -26px rgba(14,15,17,.35);transform:translateY(-3px)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c__img{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:var(--cream)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c__img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--e)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c:hover .at-c__img img{transform:scale(1.04)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c__b{display:flex;flex-direction:column;gap:12px;padding:24px 24px 26px;flex:1}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c__m{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font-size:14px;color:var(--ink-2)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c h3{font-family:var(--f-d);font-weight:800;font-size:clamp(1.2rem,1.6vw,1.4rem);letter-spacing:-.02em;line-height:1.2;color:var(--ink)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c h3 a{color:inherit;text-decoration:none;transition:color .3s}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c h3 a:hover{color:#C99A2E}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c p{font-size:17px;line-height:1.6;color:var(--ink-2)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c__go{margin-top:auto;padding-top:6px;display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:600;text-transform:uppercase;color:var(--gold-deep);text-decoration:none}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c__go .ar{transition:transform .5s var(--e)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c__go:hover .ar{transform:translateX(6px)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-g{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media (max-width: 1000px){
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-g{grid-template-columns:1fr 1fr}
}
@media (max-width: 640px){
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-g{grid-template-columns:1fr}
}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-c__cat{position:absolute;top:16px;right:16px;z-index:1;background:var(--gold-shine);color:var(--ink);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;padding:7px 12px;border-radius:999px}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec){font-size:17px}
/* Paginasi (TIADA dalam prototype — reka ikut gaya butang Share .at-sh; papar hanya bila > 9 artikel) */
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-pg{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:clamp(36px,4vw,56px)}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-pg .page-numbers{min-width:44px;height:44px;padding:0 14px;border-radius:999px;display:grid;place-items:center;border:1px solid rgba(212,175,55,.55);background:#fff;color:var(--gold-deep);font-size:15px;font-weight:600;text-decoration:none;transition:background .3s,color .3s}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-pg a.page-numbers:hover,.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-pg .page-numbers.current{background:var(--gold-shine);color:var(--ink);border-color:transparent}
.breakdance :is(.hbt-ath-sec,.hbt-atl-sec) .at-pg .dots{border:0;background:none}

/* ── FASA 10 · Single Post — CSS dijana xcss.js dari style.css + articles.css prototype FINAL ── */
.breakdance .bde-section:is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec)>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block:is(.hbt-atp-cb,.hbt-atb-cb,.hbt-atr-cb){display:block;width:100%}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec){--sand: #E4E4E2; --cream: #F7F7F5; --bone: #EFEFED; --ink: #0E0F11; --ink-2: #5B5D62; --line: rgba(14,15,17,.14); --petrol-1: radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%); --petrol-2: linear-gradient(45deg,#1F2023 0%,#4D4F54 100%); --petrol-3: linear-gradient(109.6deg,rgba(5,5,6,.95) 11.2%,#35373B 78.9%); --on-dark: #F1F1EF; --on-dark-2: rgba(241,241,239,.72); --deep: linear-gradient(180deg,#0A0A0C 0%,#000000 100%); --gold: #D4AF37; --gold-deep: #8F701D; --gold-shine: linear-gradient(180deg,#f9e6a3 0%,#d4af37 45%,#a8791f 100%); --gold-shine-h: linear-gradient(90deg,transparent 0%,var(--gold) 14%,#fff3c4 50%,var(--gold) 86%,transparent 100%); --gold-shine-deep: linear-gradient(180deg,#caa23a 0%,#8f701d 55%,#6b5216 100%); --gold-text: linear-gradient(180deg,#e9c55c 0%,#c99a2e 48%,#8f701d 100%); --hero-scrim: linear-gradient(180deg, rgba(10,10,12,.74) 0%, rgba(10,10,12,.28) 42%, rgba(138,110,47,.45) 74%, rgba(10,10,12,.97) 100%); --gold-shine-rich: radial-gradient(ellipse farthest-corner at right bottom,#FEDB37 0%,#FDB931 8%,#9f7928 30%,#8A6E2F 40%,transparent 80%), radial-gradient(ellipse farthest-corner at left top,#FFFFFF 0%,#FFFFAC 8%,#D1B464 25%,#5d4a1f 62.5%,#5d4a1f 100%); --f-d: 'Archivo HBT','Noto Sans SC',sans-serif; --f-b: 'Inter HBT','Noto Sans SC',sans-serif; --f-m: 'Inter HBT','Noto Sans SC',sans-serif; --r-sm: 6px; --r: 10px; --r-lg: 18px; --e: cubic-bezier(.16,1,.3,1); --pad: clamp(104px,13vw,180px); --gut: clamp(22px,4.5vw,56px); --nav-h: 100px;font-family:var(--f-b);color:var(--ink-2);line-height:1.7;-webkit-font-smoothing:antialiased}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) *,.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) ::before,.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) ::after{box-sizing:border-box;margin:0;padding:0}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) img{display:block;max-width:100%}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) a{color:inherit;text-decoration:none}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) button{font:inherit}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .wrap{max-width:1380px;margin:0 auto;padding:0 var(--gut)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) :focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) h1,.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) h2,.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) h3{font-family:var(--f-d);color:var(--ink);letter-spacing:-.038em;line-height:.88;font-weight:800}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .mute{background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;padding-bottom:.08em}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .up{will-change:transform,opacity}
@media (prefers-reduced-motion: reduce){
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) *{animation:none!important;transition:none!important}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .up,.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) img{transform:none!important;opacity:1!important}
}
html[lang^="zh"] body.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) :is(h1, h2, h3, h4){letter-spacing:0;line-height:1.12}
html:not([lang^="en"]) body.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) :is(h1, h2, h3){text-wrap:balance}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at{background:#fff;border-top:1px solid var(--line);padding:clamp(64px,8vw,110px) 0}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(30px,3.6vw,48px)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-h2{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:.98;color:var(--ink);font-size:clamp(2.1rem,4.2vw,3.6rem)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c{display:flex;flex-direction:column;border:1px solid rgba(212,175,55,.45);border-radius:22px;overflow:hidden;background:#fff;transition:box-shadow .4s var(--e),transform .4s var(--e)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c[hidden]{display:none}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c:hover{box-shadow:0 22px 44px -26px rgba(14,15,17,.35);transform:translateY(-3px)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c__img{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:var(--cream)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c__img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--e)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c:hover .at-c__img img{transform:scale(1.04)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c__b{display:flex;flex-direction:column;gap:12px;padding:24px 24px 26px;flex:1}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c__m{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font-size:14px;color:var(--ink-2)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-cat{font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--gold-deep)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c h3{font-family:var(--f-d);font-weight:800;font-size:clamp(1.2rem,1.6vw,1.4rem);letter-spacing:-.02em;line-height:1.2;color:var(--ink)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c h3 a{color:inherit;text-decoration:none;transition:color .3s}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c h3 a:hover{color:#C99A2E}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c p{font-size:17px;line-height:1.6;color:var(--ink-2)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c__go{margin-top:auto;padding-top:6px;display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:600;text-transform:uppercase;color:var(--gold-deep);text-decoration:none}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c__go .ar{transition:transform .5s var(--e)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c__go:hover .ar{transform:translateX(6px)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-g{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-post{background:#fff;padding:clamp(40px,6vh,80px) 0 0}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-post__w{max-width:900px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-back{display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:600;text-transform:uppercase;color:var(--gold-deep);text-decoration:none;margin-bottom:26px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-back .ar{transition:transform .5s var(--e)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-back:hover .ar{transform:translateX(-6px)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-post__m{margin-bottom:18px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-post h1{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:1;color:var(--ink);font-size:clamp(2.2rem,4.8vw,4.2rem);margin:0 0 22px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-post__lead{font-size:clamp(1.1rem,1.5vw,1.3rem);line-height:1.6;color:var(--ink-2);max-width:60ch}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-post__hero{margin:clamp(32px,4vw,56px) auto 0;border-radius:28px;overflow:hidden;aspect-ratio:16/8}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-post__hero img{width:100%;height:100%;object-fit:cover;object-position:center 40%}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-body{background:#fff;padding:clamp(48px,6vw,80px) 0 clamp(64px,8vw,110px)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-body__w{max-width:900px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose{max-width:720px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose p{font-size:18px;line-height:1.8;color:var(--ink-2);margin-bottom:22px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose__h{font-family:var(--f-d);font-weight:800;letter-spacing:-.035em;line-height:1.05;color:var(--ink);font-size:clamp(1.6rem,2.6vw,2.2rem);margin:44px 0 18px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-list{list-style:none;padding:0;margin:4px 0 30px;border-top:1px solid var(--line)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-list li{position:relative;padding:14px 0 14px 30px;border-bottom:1px solid var(--line);font-size:17px;line-height:1.5;color:var(--ink)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-list li::before{content:'';position:absolute;left:4px;top:22px;width:8px;height:8px;border-radius:50%;background:var(--gold)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-fig2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:8px;align-items:start}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-fig2 img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:18px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-cap{font-size:14px!important;color:var(--ink-2);margin-top:12px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-share{display:flex;align-items:center;gap:10px;margin-top:36px;padding-top:24px;border-top:1px solid var(--line)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-share__k{font-size:15px;font-weight:600;text-transform:uppercase;color:var(--ink);margin-right:6px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-sh{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(212,175,55,.55);background:#fff;color:var(--gold-deep);cursor:pointer;transition:background .3s,color .3s}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-sh svg{width:18px;height:18px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-sh:hover{background:var(--gold-shine);color:var(--ink);border-color:transparent}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at--rel{border-top:1px solid var(--line)}
@media (max-width: 1000px){
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-g{grid-template-columns:1fr 1fr}
}
@media (max-width: 640px){
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-g{grid-template-columns:1fr}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-post__hero{aspect-ratio:4/3;border-radius:20px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose p{font-size:17px}
}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c__cat{position:absolute;top:16px;right:16px;z-index:1;background:var(--gold-shine);color:var(--ink);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;padding:7px 12px;border-radius:999px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec){font-size:17px}
/* Isi dari editor WordPress (tambahan — prototype hanya ada p / h2 / ul / .at-fig2) */
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose>:last-child{margin-bottom:0}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose ol.at-list{counter-reset:n}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose ol.at-list li::before{counter-increment:n;content:counter(n);width:auto;height:auto;top:14px;left:0;background:none;border-radius:0;color:var(--gold-deep);font-weight:600}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose figure{margin:8px 0 30px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose figure img,.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose>img,.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose p img{display:block;max-width:100%;height:auto;border-radius:18px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose figcaption{font-size:14px;color:var(--ink-2);margin-top:12px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose .wp-block-gallery{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose p a,.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-prose li a{color:var(--gold-deep);text-decoration:underline;text-underline-offset:3px}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-c__m>*+*::before{content:'·';margin-right:14px;color:var(--gold-deep)}
.breakdance :is(.hbt-atp-sec,.hbt-atb-sec,.hbt-atr-sec) .at-fig2>br{display:none}

/* ── FASA 10 · Contact — CSS dijana xcss.js dari style.css + contact.css prototype FINAL ── */
.breakdance .bde-section:is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec)>.section-container{max-width:none;padding:0;display:block}
.breakdance .bde-code-block:is(.hbt-cth-cb,.hbt-ctm-cb,.hbt-cto-cb){display:block;width:100%}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec){--sand: #E4E4E2; --cream: #F7F7F5; --bone: #EFEFED; --ink: #0E0F11; --ink-2: #5B5D62; --line: rgba(14,15,17,.14); --petrol-1: radial-gradient(circle at 24% 22%,#2E2E2E 0%,#050506 68%); --petrol-2: linear-gradient(45deg,#1F2023 0%,#4D4F54 100%); --petrol-3: linear-gradient(109.6deg,rgba(5,5,6,.95) 11.2%,#35373B 78.9%); --on-dark: #F1F1EF; --on-dark-2: rgba(241,241,239,.72); --deep: linear-gradient(180deg,#0A0A0C 0%,#000000 100%); --gold: #D4AF37; --gold-deep: #8F701D; --gold-shine: linear-gradient(180deg,#f9e6a3 0%,#d4af37 45%,#a8791f 100%); --gold-shine-h: linear-gradient(90deg,transparent 0%,var(--gold) 14%,#fff3c4 50%,var(--gold) 86%,transparent 100%); --gold-shine-deep: linear-gradient(180deg,#caa23a 0%,#8f701d 55%,#6b5216 100%); --gold-text: linear-gradient(180deg,#e9c55c 0%,#c99a2e 48%,#8f701d 100%); --hero-scrim: linear-gradient(180deg, rgba(10,10,12,.74) 0%, rgba(10,10,12,.28) 42%, rgba(138,110,47,.45) 74%, rgba(10,10,12,.97) 100%); --gold-shine-rich: radial-gradient(ellipse farthest-corner at right bottom,#FEDB37 0%,#FDB931 8%,#9f7928 30%,#8A6E2F 40%,transparent 80%), radial-gradient(ellipse farthest-corner at left top,#FFFFFF 0%,#FFFFAC 8%,#D1B464 25%,#5d4a1f 62.5%,#5d4a1f 100%); --f-d: 'Archivo HBT','Noto Sans SC',sans-serif; --f-b: 'Inter HBT','Noto Sans SC',sans-serif; --f-m: 'Inter HBT','Noto Sans SC',sans-serif; --r-sm: 6px; --r: 10px; --r-lg: 18px; --e: cubic-bezier(.16,1,.3,1); --pad: clamp(104px,13vw,180px); --gut: clamp(22px,4.5vw,56px); --nav-h: 100px;font-family:var(--f-b);color:var(--ink-2);line-height:1.7;-webkit-font-smoothing:antialiased}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) *,.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) ::before,.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) ::after{box-sizing:border-box;margin:0;padding:0}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) img{display:block;max-width:100%}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) a{color:inherit;text-decoration:none}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) button{font:inherit}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .wrap{max-width:1380px;margin:0 auto;padding:0 var(--gut)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) :focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .r{border-radius:var(--r)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) h1,.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) h2,.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) h3{font-family:var(--f-d);color:var(--ink);letter-spacing:-.038em;line-height:.88;font-weight:800}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .mono{font-variant-numeric:tabular-nums;font-family:var(--f-m);font-size:.6875rem;font-weight:500;text-transform:uppercase;letter-spacing:.16em}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .mute{background:var(--gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;padding-bottom:.08em}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn{position:relative;display:inline-flex;align-items:center;gap:12px;padding:17px 30px;
  border:0;outline:0;appearance:none;-webkit-appearance:none;font-family:var(--f-m);
  font-size:.6875rem;text-transform:uppercase;letter-spacing:.15em;cursor:pointer;
  background:var(--ink);color:var(--cream);overflow:hidden;isolation:isolate;will-change:transform}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn::before{content:'';position:absolute;inset:0;background:var(--gold-shine);transform:scaleX(0);
  transform-origin:left;transition:transform .6s var(--e);z-index:-1}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn:hover::before{transform:scaleX(1)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn:hover{color:var(--ink)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn .ar{transition:transform .5s var(--e)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn:hover .ar{transform:translateX(7px)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn--gold{position:relative}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn--gold::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.65) 48%,transparent 66%);
  transform:translateX(-140%);transition:transform .85s var(--e)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn--gold:hover::after{transform:translateX(140%)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn--gold{background:var(--gold-shine);color:var(--ink)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn--gold::before{background:var(--on-dark)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .up{will-change:transform,opacity}
@media (prefers-reduced-motion: reduce){
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) *{animation:none!important;transition:none!important}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .up,.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) img{transform:none!important;opacity:1!important}
}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn--gold::before{background:var(--petrol-3)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn--gold:hover{color:var(--gold);box-shadow:inset 0 0 0 1px rgba(212,175,55,.55)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn{font-size:16px;letter-spacing:.02em;padding:15px 28px}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn{white-space:nowrap}
@media (max-width: 480px){
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn{padding:14px 20px;gap:10px}
}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn{font-size:15px;letter-spacing:0}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn{font-weight:500}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .btn{font-weight:600}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .pg-hero{background:#fff;padding:clamp(56px,9vh,110px) 0 clamp(64px,9vh,120px)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .pg-hero__g{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);align-items:center}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .pg-hero h1{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:.95;color:var(--ink);font-size:clamp(2.4rem,5.2vw,4.6rem);margin:0 0 22px;max-width:12ch}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .pg-hero__d{max-width:46ch;font-size:17px;line-height:1.7;color:var(--ink-2)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .pg-hero__b{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .pg-hero__img{border-radius:28px;overflow:hidden;aspect-ratio:4/3.4}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .pg-hero__img img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
@media (max-width: 900px){
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .pg-hero__g{grid-template-columns:1fr}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .pg-hero__img{aspect-ratio:16/10}
}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .pg-hero__img img[src*="hero-contact"]{object-position:center 45%}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .pg-hero__img img[src*="hero-contact"]{object-position:center 32%}
html[lang^="zh"] body.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) :is(h1, h2, h3, h4){letter-spacing:0;line-height:1.12}
html:not([lang^="en"]) body.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) :is(h1, h2, h3){text-wrap:balance}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-k{display:block;font-size:13px;letter-spacing:.12em;color:var(--gold-deep)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-h2{font-family:var(--f-d);font-weight:800;letter-spacing:-.045em;line-height:.98;color:var(--ink);font-size:clamp(2.1rem,4.2vw,3.6rem)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-main{background:#fff;padding-bottom:clamp(70px,8vw,110px);display:flow-root}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-main__g{display:grid;grid-template-columns:minmax(320px,390px) 1fr;gap:28px;align-items:start;margin-top:clamp(-120px,-11vh,-90px);position:relative;z-index:2}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-sb{background:#fff;border-radius:var(--r-lg,22px);padding:clamp(26px,2.4vw,34px);border-top:3px solid var(--gold);
  box-shadow:0 30px 60px -36px rgba(14,15,17,.5);position:sticky;top:calc(var(--nav-h) + 24px)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-sb__t{margin:8px 0 24px;font-family:var(--f-d);font-weight:800;font-size:22px;letter-spacing:-.02em;color:var(--ink);line-height:1.15}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info{list-style:none;padding:0;display:grid;gap:18px}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info li{display:flex;gap:14px;align-items:flex-start;font-size:17px;line-height:1.55;color:var(--ink-2)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info b{display:block;margin-bottom:2px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--gold-deep)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info a{color:var(--ink);transition:color .3s}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info a:hover{color:var(--gold-deep)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info address{font-style:normal}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-col{display:grid;gap:28px}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-fc{background:#fff;border-radius:var(--r-lg,22px);padding:clamp(26px,3vw,42px);box-shadow:0 30px 60px -36px rgba(14,15,17,.5)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-fc .ct-h2{font-size:clamp(1.7rem,2.6vw,2.3rem);margin-bottom:24px}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-form{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-form label{display:grid;gap:8px;font-size:15px;font-weight:500;color:var(--ink)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-form__f,.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-form__act{grid-column:1/-1}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-form input,.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-form select,.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-form textarea{font:inherit;font-size:16px;color:var(--ink);background:#fff;width:100%;
  border:1px solid rgba(14,15,17,.16);border-radius:12px;padding:14px 16px;outline:0;transition:border-color .3s,box-shadow .3s}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-form textarea{min-height:140px;resize:vertical}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-form input:focus,.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-form select:focus,.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-form textarea:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(212,175,55,.18)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-form__act{margin-top:4px}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of{background:var(--cream);padding:clamp(70px,8vw,110px) 0}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__g{margin-top:clamp(28px,3.4vw,44px);display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__i{background:#fff;border:1px solid rgba(212,175,55,.45);border-radius:18px;padding:22px 22px 18px;display:flex;flex-direction:column}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__i.is-hq{border-color:var(--gold);box-shadow:0 18px 40px -28px rgba(143,112,29,.6)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__tg{font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--gold-deep)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__i h3{margin-top:6px;font-family:var(--f-d);font-weight:800;font-size:19px;letter-spacing:-.02em;color:var(--ink);line-height:1.2}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__i p{margin:8px 0 16px;font-size:15px;line-height:1.55;color:var(--ink-2)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__ft{margin-top:auto;padding-top:14px;border-top:1px solid var(--line);display:flex;align-items:center;gap:10px;font-size:15px}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__t{color:var(--ink)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__go{margin-left:auto;font-size:13px;font-weight:600;text-transform:uppercase;color:var(--gold-deep)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__go .ar{transition:transform .35s var(--e)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__go:hover .ar{transform:translateX(4px)}
@media (max-width: 1100px){
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__g{grid-template-columns:repeat(3,1fr)}
}
@media (max-width: 960px){
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-main__g{grid-template-columns:1fr}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-sb{position:static}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__g{grid-template-columns:1fr 1fr}
}
@media (max-width: 600px){
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-form{grid-template-columns:1fr}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__g{grid-template-columns:1fr}
}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-main__g{margin-top:0}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-sb,.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-fc{box-shadow:none;border:1px solid rgba(212,175,55,.45)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-sb{border-top:3px solid var(--gold)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of{background:#fff;border-top:1px solid var(--line)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-main__g{grid-template-columns:1fr minmax(320px,390px)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-sb{background:var(--petrol-1);border:0;border-top:3px solid var(--gold);color:var(--on-dark-2)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-sb .ct-k{color:var(--gold)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-sb__t{color:var(--on-dark)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info{gap:20px}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info li{display:block;color:var(--on-dark-2);padding-bottom:18px;border-bottom:1px solid rgba(241,241,239,.1)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info li:last-child{padding-bottom:0;border-bottom:0}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info b{color:var(--gold)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info a{color:var(--on-dark)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info a:hover{color:var(--gold)}
@media (max-width: 960px){
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-main__g{grid-template-columns:1fr}
}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-sb__t{margin:6px 0 18px}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info{gap:12px}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info li{padding-bottom:12px;line-height:1.5}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-info b{margin-bottom:0}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__i.is-hq{background:var(--petrol-1);border-color:var(--gold);box-shadow:none}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__i.is-hq .ct-of__tg{color:var(--gold)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__i.is-hq h3{color:var(--on-dark)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__i.is-hq p{color:var(--on-dark-2)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__i.is-hq .ct-of__ft{border-top-color:rgba(241,241,239,.14)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__i.is-hq .ct-of__t{color:var(--on-dark)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-of__i.is-hq .ct-of__go{color:var(--gold)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-main{padding-top:0}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-head{margin-bottom:clamp(30px,3.6vw,48px)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .pg-hero h1{max-width:15ch}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec) .ct-main{border-top:1px solid var(--line);padding-top:clamp(64px,8vw,110px)}
.breakdance :is(.hbt-cth-sec,.hbt-ctm-sec,.hbt-cto-sec){font-size:17px}
/* ── Borang Form Builder Breakdance (Global Block HBT Form EN/BM/ZH) → rupa .ct-form prototype (contact.css 42–49, 51) ── */
.breakdance .hbt-ctm-sec .ct-fc .bde-form-builder{display:block;width:100%;margin:0;padding:0}
.breakdance .hbt-ctm-sec .ct-fc form.breakdance-form{display:grid;grid-template-columns:1fr 1fr;gap:18px;width:100%;margin:0;padding:0}
.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-field{display:grid;gap:8px;margin:0;padding:0;width:auto;min-width:0;font-family:var(--f-b);font-size:15px;font-weight:500;line-height:1.7;color:var(--ink)}
.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-field__label{display:block;margin:0;padding:0;font:inherit;color:inherit;letter-spacing:normal;text-transform:none}
.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-field__required{display:none}
.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-field{grid-column:auto}
.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-field--textarea,.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-footer{grid-column:1/-1}
.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-field--hidden{display:none}
.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-field--hpinput{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-field__input{font-family:var(--f-b);font-size:16px;font-weight:500;line-height:1.7;letter-spacing:normal;color:var(--ink);background:#fff;width:100%;height:auto;min-height:0;margin:0;
  border:1px solid rgba(14,15,17,.16);border-radius:12px;padding:14px 16px;outline:0;box-shadow:none;transition:border-color .3s,box-shadow .3s}
.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-field__input{appearance:auto;-webkit-appearance:auto}
.breakdance .hbt-ctm-sec .ct-fc select.breakdance-form-field__input{appearance:auto;-webkit-appearance:auto;background-image:none;cursor:default}
.breakdance .hbt-ctm-sec .ct-fc textarea.breakdance-form-field__input{min-height:140px;height:calc(16px * 1.7 * 5 + 30px);resize:vertical}
.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-field__input::placeholder{color:#757575;opacity:1}
.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-field__input:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(212,175,55,.18)}
.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-footer{display:block;margin:4px 0 0;padding:0}
.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-footer .breakdance-form-button[hidden]{display:none!important}
.breakdance .hbt-ctm-sec .ct-fc .breakdance-form-message{grid-column:1/-1}
@media(max-width:600px){.breakdance .hbt-ctm-sec .ct-fc form.breakdance-form{grid-template-columns:1fr}}

/* ── SEARCH RESULTS (2 Nov 2026) — Section guna semula kelas Articles (hbt-ath-sec / hbt-atl-sec) + hbt-srh-sec / hbt-srl-sec. Sumber: search.css prototype FINAL ── */
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-hero .pg-hero__g>div{min-width:0}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-form{display:flex;align-items:center;gap:12px;width:100%;max-width:560px;margin-top:30px;background:var(--cream);border:1px solid var(--line);border-radius:18px;padding:8px 8px 8px 22px;transition:border-color .3s var(--e),box-shadow .3s var(--e)}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-form:focus-within{border-color:var(--gold);box-shadow:0 0 0 4px rgba(212,175,55,.18)}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-form__ic{width:20px;height:20px;color:var(--ink-2);flex:0 0 auto}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-form input{flex:1;min-width:0;width:0;border:0;outline:0;background:transparent;font-family:var(--f-b);font-size:17px;line-height:1.4;color:var(--ink);padding:10px 0;margin:0;height:auto;box-shadow:none;border-radius:0;-webkit-appearance:none;appearance:none}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-form input::placeholder{color:rgba(14,15,17,.4)}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-form input::-webkit-search-cancel-button{display:none}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-form .btn{flex:0 0 auto}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-q{color:var(--ink);font-weight:600}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-hl{background:rgba(212,175,55,.3);color:inherit;padding:0 .08em;border-radius:3px}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-empty{display:flex;flex-direction:column;align-items:flex-start;gap:24px;border:1px solid rgba(212,175,55,.45);border-radius:22px;background:var(--cream);padding:clamp(28px,4vw,52px)}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-empty p{max-width:60ch;font-size:17px;line-height:1.7;color:var(--ink-2)}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-links{display:flex;flex-wrap:wrap;gap:6px;padding:6px;border-radius:999px;background:#fff;border:1px solid var(--line)}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-links a{font-family:var(--f-b);font-size:15px;font-weight:600;color:var(--ink-2);text-decoration:none;padding:11px 20px;border-radius:999px;transition:background .3s,color .3s}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-links a:hover{background:var(--gold-shine);color:var(--ink)}
@media(max-width:900px){.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-hero .pg-hero__img{display:none}}
@media(max-width:640px){.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-form{padding:6px 6px 6px 16px;gap:10px}.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-form .btn{padding:13px 18px}.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-form .btn .ar{display:none}.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-links{border-radius:22px}.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-links a{padding:10px 14px;font-size:14px}}
.breakdance :is(.hbt-srh-sec,.hbt-srl-sec) .sr-form .btn{line-height:1.7}