{"id":8670,"date":"2026-07-27T15:59:14","date_gmt":"2026-07-27T08:59:14","guid":{"rendered":"https:\/\/bingxueindonesia.co.id\/?page_id=8670"},"modified":"2026-08-12T17:20:12","modified_gmt":"2026-08-12T10:20:12","slug":"new-home","status":"publish","type":"page","link":"https:\/\/bingxueindonesia.co.id\/en\/new-home\/","title":{"rendered":"New Home"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"8670\" class=\"elementor elementor-8670\">\n\t\t\t\t<div class=\"elementor-element elementor-element-dda9e76 e-flex e-con-boxed e-con e-parent\" data-id=\"dda9e76\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c258172 elementor-widget__width-inherit elementor-absolute elementor-widget elementor-widget-html\" data-id=\"c258172\" data-element_type=\"widget\" data-settings=\"{&quot;_position&quot;:&quot;absolute&quot;}\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"id\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<title>Bingxue Indonesia \u2014 Homepage Redesign (Draft)<\/title>\r\n<style>\r\n\/* =========================================================\r\n   BINGXUE HOMEPAGE REDESIGN \u2014 DRAFT\r\n   ---------------------------------------------------------\r\n   CARA PAKAI DI WORDPRESS \/ ELEMENTOR:\r\n   1. Buat page baru di WordPress.\r\n   2. Tambahkan widget \"HTML\" (Elementor) di page tersebut.\r\n   3. Copy SELURUH isi file ini (dari <div id=\"bingxue-home\">\r\n      sampai penutup <\/script> di paling bawah) lalu paste\r\n      ke widget HTML tsb. Elementor HTML widget mendukung\r\n      <style> & <script> inline, jadi tidak perlu dipisah.\r\n   4. Semua CSS di-scope ke #bingxue-home supaya tidak bentrok\r\n      dengan style Elementor\/theme lain (sama seperti\r\n      pendekatan yang dipakai di project Linktree kemarin).\r\n   5. Semua area placeholder ditandai dengan komentar\r\n      \"GANTI DI SINI\" \u2014 tinggal ganti warna\/gradient jadi\r\n      background-image \/ <video> asli, dan teks placeholder\r\n      jadi copy asli dari tim marketing.\r\n   ========================================================= *\/\r\n\r\n@import url('https:\/\/api.fontshare.com\/v2\/css?f[]=satoshi@300,400,500,501,700,701,900,901&display=swap');\r\n\r\n\/* Lenis smooth-scroll \u2014 rules ini level halaman (html\/body), bukan cuma\r\n   di dalam #bingxue-home, karena smooth scroll ngatur scroll seluruh page *\/\r\nhtml.lenis, html.lenis body { height: auto; }\r\n.lenis.lenis-smooth { scroll-behavior: auto !important; }\r\n.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }\r\n.lenis.lenis-stopped { overflow: hidden; }\r\n.lenis.lenis-smooth iframe { pointer-events: none; }\r\n\r\n#bingxue-home, #bingxue-home * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n#bingxue-home {\r\n  --bx-orange: #F0832C;\r\n  --bx-orange-dark: #D66F1E;\r\n  --bx-ink: #1A1A18;\r\n  --bx-ink-soft: #4A4844;\r\n  --bx-cream: #F6F3EE;\r\n  --bx-white: #FFFFFF;\r\n  --bx-forest: #1F3A34;\r\n  --bx-forest-soft: #2C4C44;\r\n  --bx-line: #E4E0D8;\r\n  --bx-maxw: 1240px;\r\n  --bx-gutter: 48px;\r\n\r\n  font-family: 'Satoshi', sans-serif;\r\n  color: var(--bx-ink);\r\n  background: var(--bx-white);\r\n  line-height: 1.5;\r\n  overflow-x: hidden;\r\n  position: relative;\r\n}\r\n\r\n#bingxue-home img { max-width: 100%; display: block; }\r\n#bingxue-home a { text-decoration: none; color: inherit; }\r\n#bingxue-home button { font-family: inherit; cursor: pointer; border: none; background: none; }\r\n#bingxue-home ul { list-style: none; margin: 0; padding: 0; }\r\n#bingxue-home h1, #bingxue-home h2, #bingxue-home h3, #bingxue-home p { margin: 0; }\r\n\r\n\/* full-bleed breakout helper \u2014 lepas dari container Elementor yang biasanya ada max-width *\/\r\n#bingxue-home .bx-bleed {\r\n  width: 100vw;\r\n  position: relative;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n}\r\n\r\n#bingxue-home .bx-container {\r\n  max-width: var(--bx-maxw);\r\n  margin: 0 auto;\r\n  padding: 0 var(--bx-gutter);\r\n}\r\n\r\n#bingxue-home .bx-btn {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n  padding: 14px 30px;\r\n  border: 1.5px solid currentColor;\r\n  border-radius: 999px;\r\n  font-size: 13px;\r\n  font-weight: 600;\r\n  letter-spacing: 0.06em;\r\n  text-transform: uppercase;\r\n  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;\r\n}\r\n#bingxue-home .bx-btn--solid {\r\n  background: var(--bx-orange);\r\n  border-color: var(--bx-orange);\r\n  color: var(--bx-white);\r\n}\r\n#bingxue-home .bx-btn--solid:hover { background: var(--bx-orange-dark); border-color: var(--bx-orange-dark); }\r\n#bingxue-home .bx-btn--outline:hover { background: var(--bx-ink); color: var(--bx-white); border-color: var(--bx-ink); }\r\n#bingxue-home .bx-btn--outline-light { color: var(--bx-white); }\r\n#bingxue-home .bx-btn--outline-light:hover { background: var(--bx-white); color: var(--bx-ink); }\r\n\r\n\/* reveal-on-scroll *\/\r\n#bingxue-home .bx-reveal {\r\n  opacity: 0;\r\n  transform: translateY(28px);\r\n  transition: opacity 0.8s ease, transform 0.8s ease;\r\n}\r\n#bingxue-home .bx-reveal.is-visible {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n}\r\n@media (prefers-reduced-motion: reduce) {\r\n  #bingxue-home .bx-reveal { transition: none; opacity: 1; transform: none; }\r\n}\r\n\r\n\/* ============ HEADER \/ NAV ============ *\/\r\n#bingxue-home .bx-header {\r\n  position: absolute;\r\n  top: 0; left: 0; right: 0;\r\n  z-index: 40;\r\n  padding: 26px 0;\r\n  transition: background 0.3s ease, padding 0.3s ease, box-shadow 0.3s ease;\r\n}\r\n#bingxue-home .bx-header.is-scrolled,\r\n#bingxue-home .bx-header.is-open {\r\n  position: fixed;\r\n  background: rgba(255,255,255,0.96);\r\n  backdrop-filter: blur(6px);\r\n  padding: 14px 0;\r\n  box-shadow: 0 1px 0 var(--bx-line);\r\n}\r\n#bingxue-home .bx-header-row {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  gap: 24px;\r\n}\r\n#bingxue-home .bx-logo {\r\n  display: inline-flex;\r\n  align-items: center;\r\n}\r\n#bingxue-home .bx-logo-img {\r\n  height: 40px;\r\n  width: auto;\r\n  display: block;\r\n}\r\n#bingxue-home .bx-logo-img--dark { display: none; }\r\n#bingxue-home .bx-header.is-scrolled .bx-logo-img--light,\r\n#bingxue-home .bx-header.is-open .bx-logo-img--light { display: none; }\r\n#bingxue-home .bx-header.is-scrolled .bx-logo-img--dark,\r\n#bingxue-home .bx-header.is-open .bx-logo-img--dark { display: block; }\r\n\r\n#bingxue-home .bx-nav {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 6px;\r\n}\r\n#bingxue-home .bx-nav-item { position: relative; }\r\n#bingxue-home .bx-nav-link {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 6px;\r\n  padding: 10px 14px;\r\n  font-size: 15px;\r\n  font-weight: 600;\r\n  letter-spacing: 0.06em;\r\n  text-transform: uppercase;\r\n  color: var(--bx-white);\r\n  transition: color 0.3s ease, opacity 0.2s ease;\r\n}\r\n#bingxue-home .bx-header.is-scrolled .bx-nav-link,\r\n#bingxue-home .bx-header.is-open .bx-nav-link { color: var(--bx-ink); }\r\n#bingxue-home .bx-nav-link:hover { opacity: 0.65; }\r\n#bingxue-home .bx-caret { width: 8px; height: 8px; transition: transform 0.2s ease; }\r\n#bingxue-home .bx-nav-item:hover .bx-caret { transform: rotate(180deg); }\r\n\r\n#bingxue-home .bx-dropdown {\r\n  position: absolute;\r\n  top: calc(100% + 14px);\r\n  left: 0;\r\n  min-width: 210px;\r\n  background: var(--bx-white);\r\n  border-radius: 10px;\r\n  box-shadow: 0 18px 40px rgba(0,0,0,0.12);\r\n  padding: 10px;\r\n  opacity: 0;\r\n  visibility: hidden;\r\n  transform: translateY(8px);\r\n  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;\r\n}\r\n#bingxue-home .bx-nav-item:hover .bx-dropdown {\r\n  opacity: 1; visibility: visible; transform: translateY(0);\r\n}\r\n#bingxue-home .bx-dropdown a {\r\n  display: block;\r\n  padding: 10px 14px;\r\n  font-size: 13px;\r\n  font-weight: 500;\r\n  color: var(--bx-ink-soft);\r\n  border-radius: 6px;\r\n  white-space: nowrap;\r\n}\r\n#bingxue-home .bx-dropdown a:hover { background: var(--bx-cream); color: var(--bx-ink); }\r\n\r\n#bingxue-home .bx-burger {\r\n  display: none;\r\n  width: 32px; height: 32px;\r\n  position: relative;\r\n  z-index: 50;\r\n}\r\n#bingxue-home .bx-burger span {\r\n  position: absolute; left: 4px; right: 4px; height: 2px;\r\n  background: var(--bx-white);\r\n  transition: all 0.25s ease;\r\n}\r\n#bingxue-home .bx-header.is-scrolled .bx-burger span,\r\n#bingxue-home .bx-header.is-open .bx-burger span { background: var(--bx-ink); }\r\n#bingxue-home .bx-burger span:nth-child(1) { top: 10px; }\r\n#bingxue-home .bx-burger span:nth-child(2) { top: 16px; }\r\n#bingxue-home .bx-burger span:nth-child(3) { top: 22px; }\r\n#bingxue-home .bx-header.is-open .bx-burger span:nth-child(1) { top: 16px; transform: rotate(45deg); }\r\n#bingxue-home .bx-header.is-open .bx-burger span:nth-child(2) { opacity: 0; }\r\n#bingxue-home .bx-header.is-open .bx-burger span:nth-child(3) { top: 16px; transform: rotate(-45deg); }\r\n\r\n\/* ============ HERO ============ *\/\r\n#bingxue-home .bx-hero {\r\n  position: relative;\r\n  height: 100vh;\r\n  min-height: 560px;\r\n  overflow: hidden;\r\n}\r\n#bingxue-home .bx-hero-slide {\r\n  position: absolute;\r\n  inset: 0;\r\n  opacity: 0;\r\n  transition: opacity 1.1s ease;\r\n  \/* GANTI DI SINI: ganti background gradient dengan\r\n     background-image: url('...jpg') atau taruh <video> di\r\n     dalam .bx-hero-media untuk versi autoplay video asli *\/\r\n  background: linear-gradient(135deg, #142b26 0%, #1F3A34 45%, #2C4C44 100%);\r\n}\r\n#bingxue-home .bx-hero-slide.is-active { opacity: 1; z-index: 2; }\r\n#bingxue-home .bx-hero-video {\r\n  position: absolute;\r\n  inset: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n#bingxue-home .bx-hero-slide::after {\r\n  content: \"\";\r\n  position: absolute; inset: 0;\r\n  background: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.15) 40%, rgba(0,0,0,0.45) 100%);\r\n}\r\n#bingxue-home .bx-hero-body {\r\n  position: relative;\r\n  z-index: 5;\r\n  height: 100%;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  text-align: center;\r\n  padding: 0 24px;\r\n}\r\n#bingxue-home .bx-hero-eyebrow {\r\n  color: rgba(255,255,255,0.75);\r\n  font-size: 12.5px;\r\n  font-weight: 600;\r\n  letter-spacing: 0.2em;\r\n  text-transform: uppercase;\r\n  margin-bottom: 22px;\r\n}\r\n#bingxue-home .bx-hero-title {\r\n  color: var(--bx-white);\r\n  font-size: clamp(48px, 9vw, 108px);\r\n  font-weight: 800;\r\n  letter-spacing: 0.02em;\r\n  line-height: 1;\r\n}\r\n#bingxue-home .bx-hero-sub {\r\n  color: rgba(255,255,255,0.85);\r\n  font-size: 22px;\r\n  font-weight: 400;\r\n  max-width: 480px;\r\n  margin: 22px auto 0;\r\n}\r\n#bingxue-home .bx-hero-arrow {\r\n  position: absolute;\r\n  top: 50%;\r\n  transform: translateY(-50%);\r\n  z-index: 6;\r\n  width: 44px; height: 44px;\r\n  display: flex; align-items: center; justify-content: center;\r\n  border-radius: 50%;\r\n  color: var(--bx-white);\r\n  transition: background 0.2s ease;\r\n}\r\n#bingxue-home .bx-hero-arrow:hover { background: rgba(255,255,255,0.15); }\r\n#bingxue-home .bx-hero-arrow--prev { left: 24px; }\r\n#bingxue-home .bx-hero-arrow--next { right: 24px; }\r\n#bingxue-home .bx-hero-controls {\r\n  position: absolute;\r\n  bottom: 34px; left: 50%; transform: translateX(-50%);\r\n  z-index: 6;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 14px;\r\n}\r\n#bingxue-home .bx-hero-controls button {\r\n  width: 38px; height: 38px;\r\n  border-radius: 50%;\r\n  border: 1px solid rgba(255,255,255,0.5);\r\n  color: var(--bx-white);\r\n  display: flex; align-items: center; justify-content: center;\r\n  transition: background 0.2s ease;\r\n}\r\n#bingxue-home .bx-hero-controls button:hover { background: rgba(255,255,255,0.15); }\r\n#bingxue-home .bx-hero-dots {\r\n  position: absolute;\r\n  bottom: 34px; right: 32px;\r\n  z-index: 6;\r\n  display: flex; gap: 8px;\r\n}\r\n#bingxue-home .bx-hero-dot {\r\n  width: 22px; height: 3px;\r\n  background: rgba(255,255,255,0.4);\r\n  transition: background 0.2s ease;\r\n}\r\n#bingxue-home .bx-hero-dot.is-active { background: var(--bx-orange); }\r\n\r\n\/* ============ SECTION SHARED ============ *\/\r\n#bingxue-home .bx-section { padding: 120px 0; }\r\n#bingxue-home .bx-section--cream { background: var(--bx-cream); }\r\n\r\n\/* ============ ABOUT (split) ============ *\/\r\n#bingxue-home .bx-about {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  align-items: center;\r\n  gap: 0;\r\n}\r\n#bingxue-home .bx-about-media {\r\n  height: 620px;\r\n  background: url('https:\/\/bingxueindonesia.co.id\/wp-content\/uploads\/2026\/07\/1728x643_WEBSITE-SILK-MILK_2-jen-justin-kamari.png') center\/cover no-repeat;\r\n  position: relative;\r\n}\r\n#bingxue-home .bx-about-media::before {\r\n  content: \"\";\r\n  position: absolute; inset: 24px;\r\n  border: 1px solid rgba(255,255,255,0.4);\r\n}\r\n#bingxue-home .bx-about-text { padding: 0 96px 0 var(--bx-gutter); text-align: right; }\r\n#bingxue-home .bx-about-text .bx-p { margin-left: auto; }\r\n#bingxue-home .bx-h2 {\r\n  font-size: clamp(28px, 3.2vw, 60px);\r\n  font-weight: 800;\r\n  letter-spacing: 0.01em;\r\n  line-height: 1.15;\r\n  margin-bottom: 24px;\r\n}\r\n#bingxue-home .bx-p {\r\n  font-size: 20px;\r\n  color: var(--bx-ink-soft);\r\n  font-weight: 400;\r\n  max-width: 1000px;\r\n  margin-bottom: 34px;\r\n}\r\n\r\n\/* ============ PRODUCT (text left \/ gallery right, auto-scroll + drag) ============ *\/\r\n#bingxue-home .bx-product-bleed {\r\n  width: 100vw;\r\n  position: relative;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n}\r\n#bingxue-home .bx-product-layout {\r\n  display: grid;\r\n  grid-template-columns: 450px 1fr;\r\n  gap: 32px;\r\n  align-items: center;\r\n  padding-left: 180px;\r\n  padding-right: 0;\r\n}\r\n#bingxue-home .bx-product-gallery {\r\n  overflow: hidden;\r\n  position: relative;\r\n}\r\n#bingxue-home .bx-carousel {\r\n  display: flex;\r\n  gap: 22px;\r\n  overflow-x: auto;\r\n  padding-bottom: 8px;\r\n  scrollbar-width: none;\r\n  cursor: grab;\r\n  user-select: none;\r\n  scroll-behavior: auto; \/* wajib: biar lompatan reset loop-nya instan, gak keanimasi\/smooth *\/\r\n}\r\n#bingxue-home .bx-carousel.is-dragging { cursor: grabbing; }\r\n#bingxue-home .bx-carousel::-webkit-scrollbar { display: none; }\r\n#bingxue-home .bx-product-card {\r\n  flex: 0 0 300px;\r\n  position: relative;\r\n}\r\n#bingxue-home .bx-product-media {\r\n  height: 380px;\r\n  border-radius: 4px;\r\n  \/* GANTI DI SINI: ganti jadi foto produk asli *\/\r\n  background: linear-gradient(150deg, var(--bx-forest) 0%, var(--bx-forest-soft) 100%);\r\n  position: relative;\r\n  overflow: hidden;\r\n  pointer-events: none; \/* biar drag gak ke-block sama gambar\/link di dalamnya *\/\r\n}\r\n#bingxue-home .bx-product-card:nth-child(2n) .bx-product-media {\r\n  background: linear-gradient(150deg, #2b2622 0%, #4a4238 100%);\r\n}\r\n#bingxue-home .bx-product-card:nth-child(3n) .bx-product-media {\r\n  background: linear-gradient(150deg, var(--bx-orange-dark) 0%, var(--bx-orange) 100%);\r\n}\r\n#bingxue-home .bx-product-label {\r\n  position: absolute;\r\n  left: 18px; bottom: 18px;\r\n  color: var(--bx-white);\r\n  font-size: 11.5px;\r\n  font-weight: 600;\r\n  letter-spacing: 0.12em;\r\n  text-transform: uppercase;\r\n  opacity: 0.85;\r\n}\r\n#bingxue-home .bx-product-name {\r\n  margin-top: 16px;\r\n  font-size: 15px;\r\n  font-weight: 600;\r\n  pointer-events: none;\r\n  text-align: center;\r\n}\r\n\r\n\/* ============ STORY \/ JOURNEY (full bleed banner) ============ *\/\r\n#bingxue-home .bx-story {\r\n  position: relative;\r\n  min-height: 560px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  text-align: center;\r\n  overflow: hidden;\r\n}\r\n#bingxue-home .bx-story-media {\r\n  position: absolute; inset: 0;\r\n  \/* GANTI DI SINI: ganti jadi foto\/ilustrasi journey brand *\/\r\n  background: #EDD8B0;\r\n  background-blend-mode: multiply;\r\n}\r\n#bingxue-home .bx-story-media::after {\r\n  content: \"\";\r\n  position: absolute; inset: 0;\r\n  background: rgba(0,0,0,0.25);\r\n}\r\n#bingxue-home .bx-story-body {\r\n  position: relative; z-index: 2;\r\n  max-width: 980px;\r\n  padding: 0 24px;\r\n}\r\n#bingxue-home .bx-story-title {\r\n  color: var(--bx-white);\r\n  font-size: clamp(30px, 4vw, 46px);\r\n  font-weight: 800;\r\n  margin-bottom: 22px;\r\n}\r\n#bingxue-home .bx-story-p {\r\n  color: rgba(255,255,255,0.82);\r\n  font-size: 15.5px;\r\n  line-height: 1.7;\r\n  margin-bottom: 34px;\r\n}\r\n\r\n\/* ============ FOOTER ============ *\/\r\n#bingxue-home .bx-footer {\r\n  background: var(--bx-ink);\r\n  color: rgba(255,255,255,0.7);\r\n  padding: 84px 0 0;\r\n}\r\n#bingxue-home .bx-footer-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(5, 1fr) auto;\r\n  gap: 32px;\r\n  padding-bottom: 56px;\r\n  border-bottom: 1px solid rgba(255,255,255,0.12);\r\n}\r\n#bingxue-home .bx-footer-col h4 {\r\n  color: var(--bx-white);\r\n  font-size: 12px;\r\n  font-weight: 700;\r\n  letter-spacing: 0.1em;\r\n  text-transform: uppercase;\r\n  margin-bottom: 18px;\r\n}\r\n#bingxue-home .bx-footer-col a {\r\n  display: block;\r\n  font-size: 13.5px;\r\n  padding: 6px 0;\r\n  color: rgba(255,255,255,0.65);\r\n  transition: color 0.2s ease;\r\n}\r\n#bingxue-home .bx-footer-col a:hover { color: var(--bx-orange); }\r\n#bingxue-home .bx-footer-social {\r\n  display: flex;\r\n  gap: 10px;\r\n  align-items: flex-start;\r\n}\r\n#bingxue-home .bx-footer-social a {\r\n  width: 34px; height: 34px;\r\n  border-radius: 50%;\r\n  background: rgba(255,255,255,0.08);\r\n  display: flex; align-items: center; justify-content: center;\r\n  transition: background 0.2s ease;\r\n}\r\n#bingxue-home .bx-footer-social a:hover { background: var(--bx-orange); }\r\n#bingxue-home .bx-footer-bottom {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 22px 0;\r\n  font-size: 12.5px;\r\n  color: rgba(255,255,255,0.45);\r\n  flex-wrap: wrap;\r\n  gap: 10px;\r\n}\r\n#bingxue-home .bx-footer-bottom a { color: rgba(255,255,255,0.45); }\r\n#bingxue-home .bx-footer-bottom a:hover { color: var(--bx-white); }\r\n#bingxue-home .bx-footer-links { display: flex; gap: 18px; }\r\n\r\n\/* ============ RESPONSIVE ============ *\/\r\n@media (max-width: 960px) {\r\n  #bingxue-home .bx-nav, #bingxue-home .bx-hero-arrow { display: none; }\r\n  #bingxue-home .bx-burger { display: block; }\r\n  #bingxue-home .bx-about, #bingxue-home .bx-product-layout { grid-template-columns: 1fr; }\r\n  #bingxue-home .bx-product-layout { padding-left: var(--bx-gutter); padding-right: var(--bx-gutter); gap: 0; }\r\n  #bingxue-home .bx-about-text { padding: 56px var(--bx-gutter) 0; text-align: center; }\r\n  #bingxue-home .bx-about-text .bx-p { margin-left: auto; margin-right: auto; }\r\n  #bingxue-home .bx-about-media { height: auto; aspect-ratio: 1728 \/ 643; }\r\n  #bingxue-home .bx-product-gallery { margin-top: 32px; }\r\n  #bingxue-home .bx-footer-grid { grid-template-columns: repeat(3, 1fr); }\r\n  #bingxue-home .bx-section { padding: 80px 0; }\r\n  \/* biar video hero nempel langsung ke section berikutnya di mobile, tanpa gap putih *\/\r\n  #bingxue-home .bx-hero + .bx-section { padding-top: 0; }\r\n\r\n  \/* Judul & deskripsi tiap section jadi center di mobile (desktop tetap seperti biasa) *\/\r\n  #bingxue-home .bx-h2,\r\n  #bingxue-home .bx-p {\r\n    text-align: center;\r\n  }\r\n  #bingxue-home .bx-p { margin-left: auto; margin-right: auto; }\r\n  #bingxue-home .bx-eyebrow { display: block; text-align: center; }\r\n  #bingxue-home .bx-product-text { text-align: center; }\r\n\r\n  \/* mobile nav panel *\/\r\n  #bingxue-home .bx-nav-mobile {\r\n    position: fixed; inset: 0;\r\n    background: var(--bx-white);\r\n    z-index: 30;\r\n    padding: 100px 32px 40px;\r\n    overflow-y: auto;\r\n    display: none;\r\n  }\r\n  #bingxue-home .bx-header.is-open .bx-nav-mobile { display: block; }\r\n  #bingxue-home .bx-nav-mobile-item { border-bottom: 1px solid var(--bx-line); padding: 6px 0; }\r\n  #bingxue-home .bx-nav-mobile-link {\r\n    display: flex; justify-content: space-between; align-items: center;\r\n    padding: 16px 0; font-size: 15px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase;\r\n  }\r\n  #bingxue-home .bx-nav-mobile-sub { display: none; padding: 0 0 16px 12px; }\r\n  #bingxue-home .bx-nav-mobile-item.is-open .bx-nav-mobile-sub { display: block; }\r\n  #bingxue-home .bx-nav-mobile-sub a { display: block; padding: 10px 0; font-size: 13.5px; color: var(--bx-ink-soft); }\r\n\r\n  \/* Header di mobile: bukan lagi transparan\/nge-float di atas video,\r\n     tapi background putih permanen & posisinya normal (sebelum hero) *\/\r\n  #bingxue-home .bx-header,\r\n  #bingxue-home .bx-header.is-scrolled,\r\n  #bingxue-home .bx-header.is-open {\r\n    position: static;\r\n    background: var(--bx-white);\r\n    backdrop-filter: none;\r\n    padding: 16px 0;\r\n    box-shadow: 0 1px 0 var(--bx-line);\r\n  }\r\n  #bingxue-home .bx-logo-img--light { display: none; }\r\n  #bingxue-home .bx-logo-img--dark { display: block; }\r\n  #bingxue-home .bx-burger span,\r\n  #bingxue-home .bx-header.is-scrolled .bx-burger span,\r\n  #bingxue-home .bx-header.is-open .bx-burger span { background: var(--bx-ink); }\r\n}\r\n@media (min-width: 961px) {\r\n  #bingxue-home .bx-nav-mobile { display: none !important; }\r\n}\r\n@media (max-width: 640px) {\r\n  #bingxue-home .bx-footer-grid { grid-template-columns: repeat(2, 1fr); }\r\n  #bingxue-home .bx-carousel { gap: 14px; }\r\n  #bingxue-home .bx-product-card { flex-basis: 160px; }\r\n  #bingxue-home .bx-product-media { height: 200px; }\r\n\r\n  \/* Hero: di mobile videonya dijaga tetap landscape (16:9),\r\n     bukan lagi dipaksa penuh 100vh (itu yang bikin videonya\r\n     kelihatan \"zoom\"\/crop parah di HP) *\/\r\n  #bingxue-home .bx-hero {\r\n    height: auto;\r\n    min-height: 0;\r\n    aspect-ratio: 16 \/ 9;\r\n  }\r\n  #bingxue-home .bx-hero-title { font-size: 34px; }\r\n  #bingxue-home .bx-hero-eyebrow { margin-bottom: 10px; font-size: 11px; }\r\n  #bingxue-home .bx-hero-sub { font-size: 13px; margin-top: 12px; }\r\n  #bingxue-home .bx-hero-controls { bottom: 14px; gap: 10px; }\r\n  #bingxue-home .bx-hero-controls button { width: 30px; height: 30px; }\r\n}\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<div id=\"bingxue-home\">\r\n\r\n  <!-- ======================= HEADER ======================= -->\r\n  <header class=\"bx-header\" id=\"bxHeader\">\r\n    <div class=\"bx-container bx-header-row\">\r\n      <a href=\"https:\/\/bingxueindonesia.co.id\/en\/new-home\/\" class=\"bx-logo\">\r\n        <img decoding=\"async\" src=\"https:\/\/bingxueindonesia.co.id\/wp-content\/uploads\/2026\/07\/3@2x.png\" alt=\"Bingxue\" class=\"bx-logo-img bx-logo-img--light\">\r\n        <img decoding=\"async\" src=\"https:\/\/bingxueindonesia.co.id\/wp-content\/uploads\/2026\/07\/1@2x.png\" alt=\"Bingxue\" class=\"bx-logo-img bx-logo-img--dark\">\r\n      <\/a>\r\n\r\n      <nav class=\"bx-nav\">\r\n        <div class=\"bx-nav-item\">\r\n          <a href=\"https:\/\/bingxueindonesia.co.id\/en\/new-tentang-kami\/\" class=\"bx-nav-link\">Tentang Kami\r\n            <svg class=\"bx-caret\" viewbox=\"0 0 10 6\" fill=\"none\"><path d=\"M1 1L5 5L9 1\" stroke=\"currentColor\" stroke-width=\"1.4\"\/><\/svg>\r\n          <\/a>\r\n          <div class=\"bx-dropdown\">\r\n            <a href=\"https:\/\/bingxueindonesia.co.id\/en\/new-tentang-kami\/\">Profil Perusahaan<\/a>\r\n            <a href=\"https:\/\/bingxueindonesia.co.id\/en\/sejarah-brand\/\">Sejarah<\/a>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"bx-nav-item\">\r\n          <a href=\"https:\/\/bingxueindonesia.co.id\/en\/new-menu\/\" class=\"bx-nav-link\">Menu<\/a>\r\n        <\/div>\r\n        <div class=\"bx-nav-item\">\r\n          <a href=\"https:\/\/bingxueindonesia.co.id\/en\/new-kemitraan\/\" class=\"bx-nav-link\">Kemitraan<\/a>\r\n        <\/div>\r\n        <div class=\"bx-nav-item\">\r\n          <a href=\"#\" class=\"bx-nav-link\">Komunitas<\/a>\r\n        <\/div>\r\n        <div class=\"bx-nav-item\">\r\n          <a href=\"#\" class=\"bx-nav-link\">Artikel<\/a>\r\n        <\/div>\r\n        <div class=\"bx-nav-item\">\r\n          <a href=\"#\" class=\"bx-nav-link\">Karir<\/a>\r\n        <\/div>\r\n        <div class=\"bx-nav-item\">\r\n          <a href=\"#\" class=\"bx-nav-link\">Kontak Kami<\/a>\r\n        <\/div>\r\n      <\/nav>\r\n\r\n      <button class=\"bx-burger\" id=\"bxBurger\" aria-label=\"Buka menu\">\r\n        <span><\/span><span><\/span><span><\/span>\r\n      <\/button>\r\n    <\/div>\r\n\r\n    <!-- mobile nav panel -->\r\n    <div class=\"bx-nav-mobile\" id=\"bxNavMobile\">\r\n      <div class=\"bx-nav-mobile-item\">\r\n        <div class=\"bx-nav-mobile-link\">Tentang Kami <svg width=\"12\" height=\"8\" viewbox=\"0 0 10 6\" fill=\"none\"><path d=\"M1 1L5 5L9 1\" stroke=\"currentColor\" stroke-width=\"1.4\"\/><\/svg><\/div>\r\n        <div class=\"bx-nav-mobile-sub\"><a href=\"https:\/\/bingxueindonesia.co.id\/en\/new-tentang-kami\/\">Profil Perusahaan<\/a><a href=\"https:\/\/bingxueindonesia.co.id\/en\/sejarah-brand\/\">Sejarah<\/a><\/div>\r\n      <\/div>\r\n      <div class=\"bx-nav-mobile-item\">\r\n        <a href=\"https:\/\/bingxueindonesia.co.id\/en\/new-menu\/\" class=\"bx-nav-mobile-link\">Menu<\/a>\r\n      <\/div>\r\n      <div class=\"bx-nav-mobile-item\">\r\n        <a href=\"https:\/\/bingxueindonesia.co.id\/en\/new-kemitraan\/\" class=\"bx-nav-mobile-link\">Kemitraan<\/a>\r\n      <\/div>\r\n      <div class=\"bx-nav-mobile-item\">\r\n        <a href=\"#\" class=\"bx-nav-mobile-link\">Komunitas<\/a>\r\n      <\/div>\r\n      <div class=\"bx-nav-mobile-item\">\r\n        <a href=\"#\" class=\"bx-nav-mobile-link\">Artikel<\/a>\r\n      <\/div>\r\n      <div class=\"bx-nav-mobile-item\">\r\n        <a href=\"#\" class=\"bx-nav-mobile-link\">Karir<\/a>\r\n      <\/div>\r\n      <div class=\"bx-nav-mobile-item\">\r\n        <a href=\"#\" class=\"bx-nav-mobile-link\">Kontak Kami<\/a>\r\n      <\/div>\r\n    <\/div>\r\n  <\/header>\r\n\r\n  <!-- ======================= 1. HERO ======================= -->\r\n  <section class=\"bx-hero\" id=\"bxHero\">\r\n    <div class=\"bx-hero-slide is-active\" data-slide=\"0\">\r\n      <!-- GANTI DI SINI: link foto JPG\/PNG -->\r\n      <img decoding=\"async\" class=\"bx-hero-video\" id=\"bxHeroVideo\" src=\"https:\/\/bingxueindonesia.co.id\/wp-content\/uploads\/2026\/07\/collage-maker-1785485416902-scaled.png\" alt=\"Bingxue\">\r\n    <\/div>\r\n\r\n    <div class=\"bx-hero-body\">\r\n      <h1 class=\"bx-hero-title\">BINGXUE<\/h1>\r\n      <p class=\"bx-hero-sub\">Meet the World in Bingxue.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"bx-hero-controls\">\r\n      <button id=\"bxPlayPause\" aria-label=\"Jeda \/ putar\">\r\n        <svg id=\"bxPlayIcon\" width=\"18\" height=\"18\" viewbox=\"0 0 14 14\" fill=\"none\"><rect x=\"2\" y=\"1\" width=\"3.5\" height=\"12\" fill=\"currentColor\"\/><rect x=\"8.5\" y=\"1\" width=\"3.5\" height=\"12\" fill=\"currentColor\"\/><\/svg>\r\n      <\/button>\r\n      <button id=\"bxMute\" aria-label=\"Bisukan \/ suarakan\">\r\n        <svg width=\"16\" height=\"14\" viewbox=\"0 0 16 14\" fill=\"none\"><path d=\"M1 5H4L8 1V13L4 9H1V5Z\" fill=\"currentColor\"\/><path d=\"M11 4C12 5 12 9 11 10\" stroke=\"currentColor\" stroke-width=\"1.3\"\/><\/svg>\r\n      <\/button>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <!-- ======================= 2. TENTANG BRAND ======================= -->\r\n  <section class=\"bx-section\">\r\n    <div class=\"bx-about\">\r\n      <div class=\"bx-about-media\"><\/div>\r\n      <div class=\"bx-about-text bx-reveal\">\r\n        <h2 class=\"bx-h2\">TENTANG<br>BINGXUE<\/h2>\r\n        <p class=\"bx-p\">Bingxue merupakan brand minuman teh internasional di bawah naungan Jinan Baodao Enterprise Management Consulting Co., Ltd. yang menghadirkan berbagai produk unggulan seperti minuman teh, es krim, kopi, dan egg waffle dengan bahan baku pilihan berkualitas.<\/p>\r\n        <a href=\"#\" class=\"bx-btn bx-btn--outline\">Pelajari Lebih Lanjut<\/a>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <!-- ======================= 3. TENTANG PRODUK ======================= -->\r\n  <section class=\"bx-section bx-section--cream\">\r\n    <div class=\"bx-product-bleed\">\r\n      <div class=\"bx-product-layout\">\r\n        <div class=\"bx-product-text bx-reveal\">\r\n          <h2 class=\"bx-h2\">TENTANG PRODUK<br>BINGXUE<\/h2>\r\n          <p class=\"bx-p\">Dilandasi oleh filosofi pengembangan produk berbasis bahan baku pilihan dari seluruh dunia. dan didedikasikan demi menghadirkan kualitas terbaik untuk pelanggan.<\/p>\r\n          <a href=\"#\" class=\"bx-btn bx-btn--outline\">Pelajari Lebih Lanjut<\/a>\r\n        <\/div>\r\n\r\n        <div class=\"bx-product-gallery\">\r\n          <div class=\"bx-carousel\" id=\"bxCarousel\">\r\n            <!-- SET ASLI \u2014 ini satu-satunya yang perlu kamu edit kalau mau\r\n                 ganti\/tambah\/kurangi produk. Duplikat buat efek infinite-loop\r\n                 sekarang dibuat otomatis oleh JS (lihat script di bawah),\r\n                 jadi JANGAN copy-paste manual lagi di sini. -->\r\n            <div class=\"bx-product-card\">\r\n              <div class=\"bx-product-media\" style=\"background:url('https:\/\/bingxueindonesia.co.id\/wp-content\/uploads\/2026\/07\/570-x-570-jasmine-silk.png') center\/cover no-repeat;\"><\/div>\r\n              <div class=\"bx-product-name\">Jasmine Silk Milk Tea<\/div>\r\n            <\/div>\r\n            <div class=\"bx-product-card\">\r\n              <div class=\"bx-product-media\" style=\"background:url('https:\/\/bingxueindonesia.co.id\/wp-content\/uploads\/2026\/07\/570-x-570-oolong-silk.png') center\/cover no-repeat;\"><\/div>\r\n              <div class=\"bx-product-name\">Oolong Silk Milk Tea<\/div>\r\n            <\/div>\r\n            <div class=\"bx-product-card\">\r\n              <div class=\"bx-product-media\" style=\"background:url('https:\/\/bingxueindonesia.co.id\/wp-content\/uploads\/2026\/07\/570-x-570-DOUBLE-STRAWBERRY.png') center\/cover no-repeat;\"><\/div>\r\n              <div class=\"bx-product-name\">Double Strawberry Sundae<\/div>\r\n            <\/div>\r\n            <div class=\"bx-product-card\">\r\n              <div class=\"bx-product-media\" style=\"background:url('https:\/\/bingxueindonesia.co.id\/wp-content\/uploads\/2026\/04\/Web_Milk-Tea-Cloud-Pudding-Ice-Cream-.png') center\/cover no-repeat;\"><\/div>\r\n              <div class=\"bx-product-name\">Milk Tea Cloud Pudding Ice Cream<\/div>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <!-- ======================= 4. PERJALANAN KAMI ======================= -->\r\n  <section class=\"bx-story\">\r\n    <div class=\"bx-story-media\"><\/div>\r\n    <div class=\"bx-story-body bx-reveal\">\r\n      <h2 class=\"bx-story-title\">PERJALANAN KAMI<\/h2>\r\n      <p class=\"bx-story-p\">Sejak tahun 2023, BINGXUE telah berekspansi ke 14 negara, termasuk Indonesia, Malaysia, Vietnam, Kamboja, Singapura, Myanmar, Laos, Kazakhstan, Filipina, Amerika Serikat, Kanada, Brunei Darussalam, Thailand, dan Sri Lanka. BINGXUE menghadirkan minuman segar berkualitas dengan harga terjangkau bagi para konsumen muda di seluruh dunia.<\/p>\r\n      <a href=\"#\" class=\"bx-btn bx-btn--outline-light\">Pelajari Lebih Lanjut<\/a>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <!-- ======================= 5. FOOTER ======================= -->\r\n  <footer class=\"bx-footer\">\r\n    <div class=\"bx-container\">\r\n      <div class=\"bx-footer-grid\">\r\n        <div class=\"bx-footer-col\">\r\n          <h4>Tentang Kami<\/h4>\r\n          <a href=\"https:\/\/bingxueindonesia.co.id\/en\/new-tentang-kami\/\">Profil Perusahaan<\/a>\r\n          <a href=\"https:\/\/bingxueindonesia.co.id\/en\/sejarah-brand\/\">Sejarah<\/a>\r\n        <\/div>\r\n        <div class=\"bx-footer-col\">\r\n          <h4>Menu<\/h4>\r\n        <\/div>\r\n        <div class=\"bx-footer-col\">\r\n          <h4>Kemitraan<\/h4>\r\n        <\/div>\r\n        <div class=\"bx-footer-col\">\r\n          <h4>Komunitas &amp; Artikel<\/h4>\r\n        <\/div>\r\n        <div class=\"bx-footer-col\">\r\n          <h4>Karir<\/h4>\r\n        <\/div>\r\n        <div class=\"bx-footer-social\">\r\n          <a href=\"#\" aria-label=\"Instagram\">\r\n            <svg width=\"16\" height=\"16\" viewbox=\"0 0 24 24\" fill=\"none\"><rect x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"6\" stroke=\"currentColor\" stroke-width=\"1.6\"\/><circle cx=\"12\" cy=\"12\" r=\"4.5\" stroke=\"currentColor\" stroke-width=\"1.6\"\/><circle cx=\"17.2\" cy=\"6.8\" r=\"1.1\" fill=\"currentColor\"\/><\/svg>\r\n          <\/a>\r\n          <a href=\"#\" aria-label=\"TikTok\">\r\n            <svg width=\"16\" height=\"16\" viewbox=\"0 0 24 24\" fill=\"none\"><path d=\"M14 3v10.8a3.4 3.4 0 1 1-3.2-3.4\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\"\/><path d=\"M14 3c.4 2.6 2.1 4.2 4.6 4.4\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\"\/><\/svg>\r\n          <\/a>\r\n          <a href=\"#\" aria-label=\"Facebook\">\r\n            <svg width=\"16\" height=\"16\" viewbox=\"0 0 24 24\" fill=\"none\"><path d=\"M14 21v-7h2.5l.5-3H14V9.2c0-.9.3-1.5 1.6-1.5H17V5.1C16.6 5 15.7 5 14.7 5c-2.1 0-3.6 1.3-3.6 3.7V11H9v3h2.1v7h2.9Z\" stroke=\"currentColor\" stroke-width=\"1.4\" stroke-linejoin=\"round\"\/><\/svg>\r\n          <\/a>\r\n        <\/div>\r\n      <\/div>\r\n      <div class=\"bx-footer-bottom\">\r\n        <span>\u00a9 Bingxue Indonesia 2026<\/span>\r\n        <div class=\"bx-footer-links\">\r\n          <a href=\"#\">Hubungi Kami<\/a>\r\n          <a href=\"#\">Kebijakan Privasi<\/a>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/footer>\r\n\r\n<\/div>\r\n\r\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/lenis@latest\/dist\/lenis.min.js\"><\/script>\r\n<script>\r\n(function(){\r\n  \/* Smooth scroll (motion kayak Chagee) \u2014 cukup blok ini,\r\n     gak perlu diutak-atik lagi kecuali mau ubah \"feel\"-nya *\/\r\n  if (typeof Lenis !== 'undefined') {\r\n    new Lenis({\r\n      autoRaf: true,      \/\/ otomatis jalanin animation loop, gak perlu raf manual\r\n      duration: 1.2,       \/\/ makin besar = makin \"berat\"\/panjang jarak berhentinya\r\n      easing: function (t) { return Math.min(1, 1.001 - Math.pow(2, -10 * t)); },\r\n      wheelMultiplier: 1,\r\n      touchMultiplier: 1.5\r\n    });\r\n  }\r\n\r\n  var root = document.getElementById('bingxue-home');\r\n\r\n  \/* ---- header scroll state ---- *\/\r\n  var header = document.getElementById('bxHeader');\r\n  function onScroll(){\r\n    if (window.scrollY > 40) header.classList.add('is-scrolled');\r\n    else header.classList.remove('is-scrolled');\r\n  }\r\n  window.addEventListener('scroll', onScroll);\r\n  onScroll();\r\n\r\n  \/* ---- mobile burger ---- *\/\r\n  var burger = document.getElementById('bxBurger');\r\n  burger.addEventListener('click', function(){\r\n    header.classList.toggle('is-open');\r\n  });\r\n  root.querySelectorAll('.bx-nav-mobile-link').forEach(function(link){\r\n    link.addEventListener('click', function(e){\r\n      var item = link.closest('.bx-nav-mobile-item');\r\n      if (item.querySelector('.bx-nav-mobile-sub')) {\r\n        e.preventDefault();\r\n        item.classList.toggle('is-open');\r\n      }\r\n    });\r\n  });\r\n\r\n  \/* ---- hero video controls ---- *\/\r\n  var heroVideo = document.getElementById('bxHeroVideo');\r\n  var playing = true;\r\n\r\n  var playBtn = document.getElementById('bxPlayPause');\r\n  var playIcon = document.getElementById('bxPlayIcon');\r\n  playBtn.addEventListener('click', function(){\r\n    playing = !playing;\r\n    if (playing) {\r\n      if (heroVideo) heroVideo.play();\r\n      playIcon.innerHTML = '<rect x=\"2\" y=\"1\" width=\"3.5\" height=\"12\" fill=\"currentColor\"\/><rect x=\"8.5\" y=\"1\" width=\"3.5\" height=\"12\" fill=\"currentColor\"\/>';\r\n    } else {\r\n      if (heroVideo) heroVideo.pause();\r\n      playIcon.innerHTML = '<path d=\"M2 1L12 7L2 13V1Z\" fill=\"currentColor\"\/>';\r\n    }\r\n  });\r\n\r\n  var muteBtn = document.getElementById('bxMute');\r\n  var muted = true; \/* video mulai dalam kondisi muted, wajib untuk autoplay di semua browser *\/\r\n  muteBtn.addEventListener('click', function(){\r\n    muted = !muted;\r\n    muteBtn.style.opacity = muted ? '0.5' : '1';\r\n    if (heroVideo) heroVideo.muted = muted;\r\n  });\r\n\r\n  \/* ---- product carousel: auto-scroll + drag, infinite loop ---- *\/\r\n  var carousel = document.getElementById('bxCarousel');\r\n  var autoSpeed = 1.2;       \/\/ px per frame \u2014 kecilin\/gedein buat atur kecepatan auto-geser\r\n  var isDragging = false;\r\n  var dragStartX = 0;\r\n  var dragStartScroll = 0;\r\n  var setWidth = 0;   \/\/ lebar 1 set produk asli (termasuk gap ke kartu berikutnya)\r\n  var scrollPos = 0;  \/\/ posisi scroll kita sendiri (float), independen dari baca-ulang DOM\r\n\r\n  var masterCards = Array.prototype.slice.call(carousel.children); \/\/ 4 kartu asli\r\n\r\n  function measureSetWidth(){\r\n    if (masterCards.length === 0) return 0;\r\n    var gap = parseFloat(getComputedStyle(carousel).columnGap) || 0;\r\n    var first = masterCards[0];\r\n    var last = masterCards[masterCards.length - 1];\r\n    return (last.offsetLeft + last.offsetWidth) - first.offsetLeft + gap;\r\n  }\r\n\r\n  function ensureEnoughClones(){\r\n    setWidth = measureSetWidth();\r\n    if (setWidth <= 0) return;\r\n    \/* WAJIB: total lebar konten harus selalu lebih lebar dari\r\n       (area kelihatan + 1 set penuh). Kalau ini kurang, browser bakal\r\n       mentok di ujung DOM sebelum sempat \"reset\" \u2014 itu penyebab\r\n       gerakannya kelihatan berhenti\/nge-jeda sebelum loop ulang. *\/\r\n    var needed = carousel.clientWidth + setWidth;\r\n    var guard = 0;\r\n    while (carousel.scrollWidth < needed && guard < 30) {\r\n      masterCards.forEach(function(card){\r\n        var clone = card.cloneNode(true);\r\n        clone.setAttribute('aria-hidden', 'true');\r\n        carousel.appendChild(clone);\r\n      });\r\n      guard++;\r\n    }\r\n  }\r\n  ensureEnoughClones();\r\n  window.addEventListener('resize', ensureEnoughClones);\r\n  window.addEventListener('load', ensureEnoughClones); \/\/ ukuran final setelah gambar produk selesai load\r\n\r\n  function wrapScroll(value){\r\n    if (setWidth <= 0) return value;\r\n    var wrapped = value % setWidth;\r\n    if (wrapped < 0) wrapped += setWidth;\r\n    return wrapped;\r\n  }\r\n\r\n  function autoScrollStep(){\r\n    if (!isDragging) {\r\n      scrollPos = wrapScroll(scrollPos + autoSpeed);\r\n      carousel.scrollLeft = scrollPos;\r\n    }\r\n    requestAnimationFrame(autoScrollStep);\r\n  }\r\n  requestAnimationFrame(autoScrollStep);\r\n\r\n  function startDrag(clientX){\r\n    isDragging = true;\r\n    carousel.classList.add('is-dragging');\r\n    dragStartX = clientX;\r\n    dragStartScroll = scrollPos;\r\n  }\r\n  function moveDrag(clientX){\r\n    if (!isDragging) return;\r\n    var walk = clientX - dragStartX;\r\n    scrollPos = wrapScroll(dragStartScroll - walk);\r\n    carousel.scrollLeft = scrollPos;\r\n  }\r\n  function endDrag(){\r\n    isDragging = false;\r\n    carousel.classList.remove('is-dragging');\r\n    scrollPos = carousel.scrollLeft; \/\/ sinkronkan kembali ke posisi asli DOM\r\n  }\r\n\r\n  \/* mouse (desktop) *\/\r\n  carousel.addEventListener('mousedown', function(e){\r\n    startDrag(e.pageX);\r\n    e.preventDefault();\r\n  });\r\n  window.addEventListener('mousemove', function(e){ moveDrag(e.pageX); });\r\n  window.addEventListener('mouseup', endDrag);\r\n  carousel.addEventListener('mouseleave', function(){ if (isDragging) endDrag(); });\r\n\r\n  \/* touch (mobile) \u2014 dibiarkan pakai swipe natif, cuma di-pause auto-scroll-nya *\/\r\n  carousel.addEventListener('touchstart', function(e){\r\n    isDragging = true;\r\n    carousel.classList.add('is-dragging');\r\n  }, { passive: true });\r\n  carousel.addEventListener('touchend', function(){ endDrag(); });\r\n\r\n  \/* ---- scroll reveal ---- *\/\r\n  var revealEls = root.querySelectorAll('.bx-reveal');\r\n  if ('IntersectionObserver' in window) {\r\n    var io = new IntersectionObserver(function(entries){\r\n      entries.forEach(function(entry){\r\n        if (entry.isIntersecting) entry.target.classList.add('is-visible');\r\n      });\r\n    }, { threshold: 0.2 });\r\n    revealEls.forEach(function(el){ io.observe(el); });\r\n  } else {\r\n    revealEls.forEach(function(el){ el.classList.add('is-visible'); });\r\n  }\r\n})();\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Bingxue Indonesia \u2014 Homepage Redesign (Draft) \/* ========================================================= BINGXUE HOMEPAGE REDESIGN \u2014 DRAFT &#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212; CARA PAKAI DI WORDPRESS \/ ELEMENTOR: 1. Buat page baru di WordPress. 2. Tambahkan widget &#8220;HTML&#8221; (Elementor) di page tersebut. 3. Copy SELURUH isi file ini (dari sampai penutup di paling bawah) lalu paste ke widget HTML tsb. Elementor HTML widget [&hellip;]<\/p>","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-8670","page","type-page","status-publish","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.7 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>New Home - Bingxue<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/bingxueindonesia.co.id\/en\/new-home\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"New Home - Bingxue\" \/>\n<meta property=\"og:description\" content=\"Bingxue Indonesia \u2014 Homepage Redesign (Draft) \/* ========================================================= BINGXUE HOMEPAGE REDESIGN \u2014 DRAFT --------------------------------------------------------- CARA PAKAI DI WORDPRESS \/ ELEMENTOR: 1. Buat page baru di WordPress. 2. Tambahkan widget &quot;HTML&quot; (Elementor) di page tersebut. 3. Copy SELURUH isi file ini (dari sampai penutup di paling bawah) lalu paste ke widget HTML tsb. Elementor HTML widget [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/bingxueindonesia.co.id\/en\/new-home\/\" \/>\n<meta property=\"og:site_name\" content=\"Bingxue\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/bingxueindonesia\/\" \/>\n<meta property=\"article:modified_time\" content=\"2026-08-12T10:20:12+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/bingxueindonesia.co.id\/new-home\/\",\"url\":\"https:\/\/bingxueindonesia.co.id\/new-home\/\",\"name\":\"New Home - Bingxue\",\"isPartOf\":{\"@id\":\"https:\/\/bingxueindonesia.co.id\/#website\"},\"datePublished\":\"2026-07-27T08:59:14+00:00\",\"dateModified\":\"2026-08-12T10:20:12+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/bingxueindonesia.co.id\/new-home\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/bingxueindonesia.co.id\/new-home\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/bingxueindonesia.co.id\/new-home\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/bingxueindonesia.co.id\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"New Home\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/bingxueindonesia.co.id\/#website\",\"url\":\"https:\/\/bingxueindonesia.co.id\/\",\"name\":\"Bingxue\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/bingxueindonesia.co.id\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/bingxueindonesia.co.id\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/bingxueindonesia.co.id\/#organization\",\"name\":\"Bingxue\",\"url\":\"https:\/\/bingxueindonesia.co.id\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/bingxueindonesia.co.id\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/bingxueindonesia.co.id\/wp-content\/uploads\/2026\/08\/cropped-1@2x-1.png\",\"contentUrl\":\"https:\/\/bingxueindonesia.co.id\/wp-content\/uploads\/2026\/08\/cropped-1@2x-1.png\",\"width\":1901,\"height\":410,\"caption\":\"Bingxue\"},\"image\":{\"@id\":\"https:\/\/bingxueindonesia.co.id\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/bingxueindonesia\/\",\"https:\/\/www.instagram.com\/bingxue.indonesia\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"New Home - Bingxue","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/bingxueindonesia.co.id\/en\/new-home\/","og_locale":"en_US","og_type":"article","og_title":"New Home - Bingxue","og_description":"Bingxue Indonesia \u2014 Homepage Redesign (Draft) \/* ========================================================= BINGXUE HOMEPAGE REDESIGN \u2014 DRAFT --------------------------------------------------------- CARA PAKAI DI WORDPRESS \/ ELEMENTOR: 1. Buat page baru di WordPress. 2. Tambahkan widget \"HTML\" (Elementor) di page tersebut. 3. Copy SELURUH isi file ini (dari sampai penutup di paling bawah) lalu paste ke widget HTML tsb. Elementor HTML widget [&hellip;]","og_url":"https:\/\/bingxueindonesia.co.id\/en\/new-home\/","og_site_name":"Bingxue","article_publisher":"https:\/\/www.facebook.com\/bingxueindonesia\/","article_modified_time":"2026-08-12T10:20:12+00:00","twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/bingxueindonesia.co.id\/new-home\/","url":"https:\/\/bingxueindonesia.co.id\/new-home\/","name":"New Home - Bingxue","isPartOf":{"@id":"https:\/\/bingxueindonesia.co.id\/#website"},"datePublished":"2026-07-27T08:59:14+00:00","dateModified":"2026-08-12T10:20:12+00:00","breadcrumb":{"@id":"https:\/\/bingxueindonesia.co.id\/new-home\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/bingxueindonesia.co.id\/new-home\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/bingxueindonesia.co.id\/new-home\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/bingxueindonesia.co.id\/"},{"@type":"ListItem","position":2,"name":"New Home"}]},{"@type":"WebSite","@id":"https:\/\/bingxueindonesia.co.id\/#website","url":"https:\/\/bingxueindonesia.co.id\/","name":"Bingxue","description":"","publisher":{"@id":"https:\/\/bingxueindonesia.co.id\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/bingxueindonesia.co.id\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/bingxueindonesia.co.id\/#organization","name":"Bingxue","url":"https:\/\/bingxueindonesia.co.id\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/bingxueindonesia.co.id\/#\/schema\/logo\/image\/","url":"https:\/\/bingxueindonesia.co.id\/wp-content\/uploads\/2026\/08\/cropped-1@2x-1.png","contentUrl":"https:\/\/bingxueindonesia.co.id\/wp-content\/uploads\/2026\/08\/cropped-1@2x-1.png","width":1901,"height":410,"caption":"Bingxue"},"image":{"@id":"https:\/\/bingxueindonesia.co.id\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/bingxueindonesia\/","https:\/\/www.instagram.com\/bingxue.indonesia\/"]}]}},"jetpack_sharing_enabled":true,"jetpack-related-posts":[],"_links":{"self":[{"href":"https:\/\/bingxueindonesia.co.id\/en\/wp-json\/wp\/v2\/pages\/8670","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bingxueindonesia.co.id\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/bingxueindonesia.co.id\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/bingxueindonesia.co.id\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/bingxueindonesia.co.id\/en\/wp-json\/wp\/v2\/comments?post=8670"}],"version-history":[{"count":100,"href":"https:\/\/bingxueindonesia.co.id\/en\/wp-json\/wp\/v2\/pages\/8670\/revisions"}],"predecessor-version":[{"id":9046,"href":"https:\/\/bingxueindonesia.co.id\/en\/wp-json\/wp\/v2\/pages\/8670\/revisions\/9046"}],"wp:attachment":[{"href":"https:\/\/bingxueindonesia.co.id\/en\/wp-json\/wp\/v2\/media?parent=8670"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}