{"id":881,"date":"2026-02-12T09:43:35","date_gmt":"2026-02-12T09:43:35","guid":{"rendered":"https:\/\/sanphotonow.com\/?page_id=881"},"modified":"2026-08-28T06:05:41","modified_gmt":"2026-08-28T06:05:41","slug":"lien-he","status":"publish","type":"page","link":"https:\/\/sanphotonow.com\/en\/lien-he\/","title":{"rendered":"Contact"},"content":{"rendered":"<style>\n\/* =========================================================\n   NEXBOT CONTACT PAGE\n   Scoped CSS\n========================================================= *\/\n\n.nxb-contact-page {\n  --primary: #2563eb;\n  --primary-dark: #1d4ed8;\n  --primary-soft: #eff6ff;\n  --primary-border: #dbeafe;\n\n  --indigo: #4f46e5;\n  --cyan: #0ea5e9;\n\n  --text: #0f172a;\n  --text-2: #334155;\n  --muted: #64748b;\n\n  --border: #e2e8f0;\n  --bg: #ffffff;\n  --bg-soft: #f8fbff;\n\n  --radius: 22px;\n\n  --shadow:\n    0 18px 60px rgba(30, 64, 175, 0.08);\n\n  font-family:\n    Inter,\n    -apple-system,\n    BlinkMacSystemFont,\n    \"Segoe UI\",\n    Roboto,\n    Helvetica,\n    Arial,\n    sans-serif;\n\n  color: var(--text);\n\n  background:\n    radial-gradient(\n      circle at 8% 8%,\n      rgba(37, 99, 235, 0.055),\n      transparent 27%\n    ),\n    radial-gradient(\n      circle at 93% 12%,\n      rgba(79, 70, 229, 0.05),\n      transparent 27%\n    ),\n    linear-gradient(\n      180deg,\n      #ffffff 0%,\n      #fbfdff 100%\n    );\n\n  width: 100%;\n\n  overflow: hidden;\n}\n\n.nxb-contact-page *,\n.nxb-contact-page *::before,\n.nxb-contact-page *::after {\n  box-sizing: border-box;\n}\n\n.nxb-contact-page a {\n  text-decoration: none;\n}\n\n.nxb-contact-page svg {\n  display: block;\n}\n\n.nxb-container {\n  width: min(1180px, calc(100% - 40px));\n  margin: 0 auto;\n}\n\n\n\/* =========================================================\n   HERO\n========================================================= *\/\n\n.nxb-contact-hero {\n  position: relative;\n\n  padding: 82px 0 65px;\n}\n\n.nxb-hero-grid {\n  display: grid;\n\n  grid-template-columns:\n    minmax(0, 1fr)\n    minmax(430px, 0.95fr);\n\n  gap: 64px;\n\n  align-items: center;\n}\n\n\n\/* LEFT *\/\n\n.nxb-eyebrow {\n  display: inline-flex;\n  align-items: center;\n\n  gap: 9px;\n\n  margin-bottom: 20px;\n\n  color: var(--primary);\n\n  font-size: 13px;\n  line-height: 1;\n  font-weight: 750;\n\n  text-transform: uppercase;\n  letter-spacing: 0.08em;\n}\n\n.nxb-eyebrow-icon {\n  width: 30px;\n  height: 30px;\n\n  display: grid;\n  place-items: center;\n\n  border-radius: 9px;\n\n  color: var(--primary);\n\n  background: var(--primary-soft);\n\n  border: 1px solid var(--primary-border);\n}\n\n.nxb-eyebrow-icon svg {\n  width: 15px;\n  height: 15px;\n}\n\n.nxb-hero-title {\n  margin: 0;\n\n  max-width: 700px;\n\n  color: var(--text);\n\n  font-size: clamp(44px, 5vw, 68px);\n  line-height: 1.04;\n\n  font-weight: 780;\n\n  letter-spacing: -0.045em;\n}\n\n.nxb-gradient-text {\n  display: inline-block;\n\n  color: transparent;\n\n  background:\n    linear-gradient(\n      110deg,\n      #2563eb 0%,\n      #4f46e5 52%,\n      #0ea5e9 100%\n    );\n\n  background-clip: text;\n  -webkit-background-clip: text;\n}\n\n.nxb-hero-desc {\n  max-width: 640px;\n\n  margin: 24px 0 0;\n\n  color: var(--muted);\n\n  font-size: 16px;\n  line-height: 1.75;\n}\n\n\n\/* =========================================================\n   TWO FEATURES ONLY\n========================================================= *\/\n\n.nxb-feature-bar {\n  display: grid;\n\n  grid-template-columns:\n    1fr 1fr;\n\n  gap: 0;\n\n  max-width: 590px;\n\n  margin-top: 34px;\n\n  border:\n    1px solid #e3ebf5;\n\n  border-radius: 18px;\n\n  background:\n    rgba(255, 255, 255, 0.9);\n\n  box-shadow:\n    0 14px 40px rgba(30, 64, 175, 0.065);\n\n  overflow: hidden;\n}\n\n.nxb-feature-item {\n  min-width: 0;\n\n  display: flex;\n  align-items: center;\n\n  gap: 13px;\n\n  padding: 17px 19px;\n}\n\n.nxb-feature-item + .nxb-feature-item {\n  border-left:\n    1px solid #e6edf6;\n}\n\n.nxb-feature-icon {\n  width: 45px;\n  height: 45px;\n\n  flex: 0 0 45px;\n\n  display: grid;\n  place-items: center;\n\n  border-radius: 13px;\n\n  color: var(--primary);\n\n  background:\n    linear-gradient(\n      145deg,\n      #ffffff,\n      #eff6ff\n    );\n\n  border: 1px solid var(--primary-border);\n}\n\n.nxb-feature-icon svg {\n  width: 20px;\n  height: 20px;\n}\n\n.nxb-feature-copy {\n  min-width: 0;\n}\n\n.nxb-feature-title {\n  display: block;\n\n  margin-bottom: 4px;\n\n  color: var(--text);\n\n  font-size: 14px;\n  line-height: 1.3;\n\n  font-weight: 720;\n\n  white-space: nowrap;\n}\n\n.nxb-feature-desc {\n  display: block;\n\n  color: var(--muted);\n\n  font-size: 12px;\n  line-height: 1.35;\n\n  white-space: nowrap;\n}\n\n\n\/* =========================================================\n   HERO VISUAL\n========================================================= *\/\n\n.nxb-visual-area {\n  position: relative;\n\n  width: 100%;\n  min-height: 500px;\n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n\n\/* background glow *\/\n\n.nxb-visual-bg {\n  position: absolute;\n\n  width: 470px;\n  height: 470px;\n\n  border-radius: 50%;\n\n  background:\n    radial-gradient(\n      circle,\n      rgba(37, 99, 235, 0.15) 0%,\n      rgba(37, 99, 235, 0.075) 35%,\n      rgba(79, 70, 229, 0.035) 52%,\n      transparent 72%\n    );\n}\n\n\n\/* ORBIT *\/\n\n.nxb-orbit-ring {\n  position: absolute;\n\n  width: 420px;\n  height: 420px;\n\n  border-radius: 50%;\n\n  border:\n    1.5px dashed rgba(37, 99, 235, 0.22);\n}\n\n.nxb-orbit-ring::before {\n  content: \"\";\n\n  position: absolute;\n\n  top: -6px;\n  left: 50%;\n\n  width: 12px;\n  height: 12px;\n\n  border-radius: 50%;\n\n  background: #60a5fa;\n\n  box-shadow:\n    0 0 0 7px rgba(96, 165, 250, 0.10);\n}\n\n.nxb-orbit-ring::after {\n  content: \"\";\n\n  position: absolute;\n\n  bottom: 28px;\n  right: 62px;\n\n  width: 9px;\n  height: 9px;\n\n  border-radius: 50%;\n\n  background: #4f46e5;\n}\n\n\n\/* Decorative dots *\/\n\n.nxb-dot-grid {\n  position: absolute;\n\n  top: 112px;\n  left: 10px;\n\n  width: 92px;\n  height: 62px;\n\n  opacity: 0.38;\n\n  background-image:\n    radial-gradient(\n      circle,\n      #60a5fa 2px,\n      transparent 2.5px\n    );\n\n  background-size:\n    15px 15px;\n}\n\n\n\/* Decorative plus *\/\n\n.nxb-plus {\n  position: absolute;\n\n  color: #93c5fd;\n\n  font-weight: 300;\n\n  font-size: 31px;\n}\n\n.nxb-plus-one {\n  top: 72px;\n  right: 48px;\n}\n\n.nxb-plus-two {\n  bottom: 60px;\n  left: 48px;\n}\n\n\n\/* =========================================================\n   ENVELOPE\n========================================================= *\/\n\n.nxb-envelope-wrap {\n  position: relative;\n\n  z-index: 4;\n\n  width: 365px;\n  height: 285px;\n\n  margin-top: 55px;\n}\n\n.nxb-letter {\n  position: absolute;\n\n  z-index: 3;\n\n  top: -72px;\n  left: 50%;\n\n  width: 224px;\n  height: 225px;\n\n  transform:\n    translateX(-50%)\n    rotate(1deg);\n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  border-radius:\n    28px 28px 34px 34px;\n\n  background:\n    linear-gradient(\n      150deg,\n      #ffffff 0%,\n      #f9fbff 100%\n    );\n\n  border:\n    1px solid #e0e9f6;\n\n  box-shadow:\n    0 18px 40px rgba(37, 99, 235, 0.10);\n}\n\n.nxb-letter::before {\n  content: \"NEXBOT\";\n\n  position: absolute;\n\n  top: 22px;\n\n  color: #64748b;\n\n  font-size: 10px;\n  font-weight: 800;\n\n  letter-spacing: 0.16em;\n}\n\n.nxb-n-logo {\n  width: 91px;\n  height: 91px;\n}\n\n\n\/* envelope base *\/\n\n.nxb-envelope-base {\n  position: absolute;\n\n  inset: 43px 0 0;\n\n  overflow: hidden;\n\n  border-radius: 28px;\n\n  background:\n    linear-gradient(\n      145deg,\n      #3b82f6 0%,\n      #2563eb 54%,\n      #1d4ed8 100%\n    );\n\n  box-shadow:\n    0 32px 75px rgba(37, 99, 235, 0.24);\n}\n\n.nxb-envelope-base::before {\n  content: \"\";\n\n  position: absolute;\n\n  inset: 0;\n\n  background:\n    linear-gradient(\n      150deg,\n      rgba(255,255,255,0.08),\n      transparent 45%\n    );\n}\n\n\n\/* left flap *\/\n\n.nxb-envelope-left {\n  position: absolute;\n\n  z-index: 5;\n\n  bottom: 0;\n  left: 0;\n\n  width: 52%;\n  height: 190px;\n\n  background:\n    linear-gradient(\n      135deg,\n      #4f8df8,\n      #2563eb\n    );\n\n  clip-path:\n    polygon(\n      0 0,\n      100% 54%,\n      0 100%\n    );\n}\n\n\n\/* right flap *\/\n\n.nxb-envelope-right {\n  position: absolute;\n\n  z-index: 5;\n\n  bottom: 0;\n  right: 0;\n\n  width: 52%;\n  height: 190px;\n\n  background:\n    linear-gradient(\n      220deg,\n      #3b82f6,\n      #1d4ed8\n    );\n\n  clip-path:\n    polygon(\n      100% 0,\n      0 54%,\n      100% 100%\n    );\n}\n\n\n\/* front flap *\/\n\n.nxb-envelope-front {\n  position: absolute;\n\n  z-index: 6;\n\n  bottom: 0;\n\n  width: 100%;\n  height: 170px;\n\n  background:\n    linear-gradient(\n      180deg,\n      #4e8df8 0%,\n      #2563eb 100%\n    );\n\n  clip-path:\n    polygon(\n      0 100%,\n      0 48%,\n      50% 0,\n      100% 48%,\n      100% 100%\n    );\n\n  filter:\n    drop-shadow(\n      0 -1px 0 rgba(255,255,255,0.18)\n    );\n}\n\n\n\/* =========================================================\n   FLOATING BADGES\n========================================================= *\/\n\n.nxb-badge {\n  position: absolute;\n\n  z-index: 8;\n\n  display: flex;\n  align-items: center;\n\n  gap: 10px;\n\n  padding: 12px 15px;\n\n  border-radius: 15px;\n\n  color: var(--text-2);\n\n  background:\n    rgba(255,255,255,0.94);\n\n  border:\n    1px solid #dce8f8;\n\n  box-shadow:\n    0 17px 42px rgba(37,99,235,0.13);\n\n  backdrop-filter: blur(10px);\n}\n\n.nxb-badge-icon {\n  width: 36px;\n  height: 36px;\n\n  flex: 0 0 36px;\n\n  display: grid;\n  place-items: center;\n\n  border-radius: 11px;\n\n  color: var(--primary);\n\n  background: #eff6ff;\n}\n\n.nxb-badge-icon svg {\n  width: 18px;\n  height: 18px;\n}\n\n.nxb-badge strong {\n  display: block;\n\n  margin-bottom: 1px;\n\n  color: var(--text);\n\n  font-size: 11px;\n\n  font-weight: 780;\n\n  white-space: nowrap;\n}\n\n.nxb-badge small {\n  display: block;\n\n  color: var(--muted);\n\n  font-size: 9.5px;\n\n  white-space: nowrap;\n}\n\n\n\/* left badge *\/\n\n.nxb-badge-send {\n  left: -24px;\n  bottom: 76px;\n\n  animation:\n    nxb-float-1 4.8s ease-in-out infinite;\n}\n\n\n\/* right badge *\/\n\n.nxb-badge-reply {\n  right: -28px;\n  bottom: 52px;\n\n  animation:\n    nxb-float-2 5.2s ease-in-out infinite;\n}\n\n\n\/* bottom badge *\/\n\n.nxb-badge-security {\n  left: 50%;\n  bottom: -42px;\n\n  transform: translateX(-50%);\n\n  animation:\n    nxb-float-3 5.4s ease-in-out infinite;\n}\n\n@keyframes nxb-float-1 {\n\n  0%,\n  100% {\n    transform: translateY(0);\n  }\n\n  50% {\n    transform: translateY(-8px);\n  }\n\n}\n\n@keyframes nxb-float-2 {\n\n  0%,\n  100% {\n    transform: translateY(0);\n  }\n\n  50% {\n    transform: translateY(9px);\n  }\n\n}\n\n@keyframes nxb-float-3 {\n\n  0%,\n  100% {\n    transform:\n      translateX(-50%)\n      translateY(0);\n  }\n\n  50% {\n    transform:\n      translateX(-50%)\n      translateY(-7px);\n  }\n\n}\n\n\n\/* paper plane *\/\n\n.nxb-paper-plane {\n  position: absolute;\n\n  z-index: 6;\n\n  top: 115px;\n  right: -4px;\n\n  width: 54px;\n  height: 54px;\n\n  color: #2563eb;\n\n  transform:\n    rotate(-13deg);\n\n  filter:\n    drop-shadow(\n      0 11px 13px rgba(37,99,235,0.15)\n    );\n}\n\n.nxb-plane-trail {\n  position: absolute;\n\n  top: 150px;\n  right: 35px;\n\n  width: 90px;\n  height: 55px;\n\n  border-bottom:\n    2px dashed rgba(96,165,250,0.55);\n\n  border-radius: 0 0 55px 55px;\n\n  transform:\n    rotate(15deg);\n}\n\n\n\/* =========================================================\n   MAIN CONTACT\n========================================================= *\/\n\n.nxb-contact-main {\n  padding: 20px 0 90px;\n}\n\n.nxb-main-grid {\n  display: grid;\n\n  grid-template-columns:\n    minmax(300px, 0.78fr)\n    minmax(0, 1.42fr);\n\n  gap: 24px;\n}\n\n.nxb-card {\n  border:\n    1px solid var(--border);\n\n  border-radius: var(--radius);\n\n  background:\n    rgba(255,255,255,0.97);\n\n  box-shadow: var(--shadow);\n}\n\n.nxb-info-card,\n.nxb-form-card {\n  padding: 32px;\n}\n\n.nxb-card-title {\n  margin: 0 0 26px;\n\n  color: var(--text);\n\n  font-size: 23px;\n  line-height: 1.3;\n\n  font-weight: 760;\n\n  letter-spacing: -0.025em;\n}\n\n\n\/* =========================================================\n   CONTACT INFO\n========================================================= *\/\n\n.nxb-info-row {\n  display: flex;\n\n  gap: 15px;\n\n  padding: 20px 0;\n\n  border-bottom:\n    1px solid #edf2f7;\n}\n\n.nxb-info-row:first-of-type {\n  padding-top: 0;\n}\n\n.nxb-info-row:last-child {\n  padding-bottom: 0;\n\n  border-bottom: 0;\n}\n\n.nxb-info-icon {\n  width: 46px;\n  height: 46px;\n\n  flex: 0 0 46px;\n\n  display: grid;\n  place-items: center;\n\n  border-radius: 14px;\n\n  color: var(--primary);\n\n  background: var(--primary-soft);\n\n  border:\n    1px solid var(--primary-border);\n}\n\n.nxb-info-icon svg {\n  width: 20px;\n  height: 20px;\n}\n\n.nxb-info-label {\n  display: block;\n\n  margin:\n    2px 0 7px;\n\n  color: var(--text);\n\n  font-size: 13px;\n  line-height: 1.3;\n\n  font-weight: 720;\n}\n\n.nxb-info-value,\n.nxb-info-value a {\n  color: var(--muted);\n\n  font-size: 14px;\n  line-height: 1.7;\n}\n\n.nxb-info-value a:hover {\n  color: var(--primary);\n}\n\n\n\/* =========================================================\n   FORM\n========================================================= *\/\n\n.nxb-form-grid {\n  display: grid;\n\n  grid-template-columns:\n    1fr 1fr;\n\n  gap: 20px;\n}\n\n.nxb-field {\n  min-width: 0;\n}\n\n.nxb-field-full {\n  grid-column: 1 \/ -1;\n}\n\n.nxb-field label {\n  display: block;\n\n  margin-bottom: 9px;\n\n  color: var(--text-2);\n\n  font-size: 13px;\n  line-height: 1.4;\n\n  font-weight: 650;\n}\n\n.nxb-required {\n  color: #dc2626;\n}\n\n.nxb-field input,\n.nxb-field select,\n.nxb-field textarea {\n  width: 100%;\n\n  margin: 0;\n\n  outline: none;\n\n  color: var(--text);\n\n  background: #fbfdff;\n\n  border:\n    1px solid #dbe3ee;\n\n  border-radius: 12px;\n\n  font-family:\n    inherit;\n\n  font-size: 14px;\n\n  transition:\n    border-color .2s ease,\n    box-shadow .2s ease,\n    background .2s ease;\n}\n\n.nxb-field input,\n.nxb-field select {\n  height: 52px;\n\n  padding:\n    0 15px;\n}\n\n.nxb-field textarea {\n  min-height: 155px;\n\n  padding: 14px 15px;\n\n  resize: vertical;\n}\n\n.nxb-field input::placeholder,\n.nxb-field textarea::placeholder {\n  color: #94a3b8;\n}\n\n.nxb-field input:focus,\n.nxb-field select:focus,\n.nxb-field textarea:focus {\n  background: #ffffff;\n\n  border-color:\n    #60a5fa;\n\n  box-shadow:\n    0 0 0 4px rgba(37,99,235,0.08);\n}\n\n\n\/* privacy *\/\n\n.nxb-privacy {\n  display: flex;\n  align-items: center;\n\n  gap: 9px;\n\n  margin-top: 18px;\n\n  padding:\n    13px 15px;\n\n  border-radius: 12px;\n\n  color: var(--muted);\n\n  background: #f8fbff;\n\n  border:\n    1px solid #e4edf8;\n\n  font-size: 12px;\n  line-height: 1.5;\n}\n\n.nxb-privacy svg {\n  width: 16px;\n  height: 16px;\n\n  flex: 0 0 16px;\n\n  color: var(--primary);\n}\n\n.nxb-privacy a {\n  color: var(--primary);\n\n  font-weight: 650;\n}\n\n\n\/* submit *\/\n\n.nxb-submit {\n  width: 100%;\n  height: 54px;\n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  gap: 9px;\n\n  margin-top: 16px;\n\n  border: 0;\n\n  border-radius: 13px;\n\n  cursor: pointer;\n\n  color: #ffffff;\n\n  background:\n    linear-gradient(\n      100deg,\n      #4f46e5,\n      #2563eb 55%,\n      #0ea5e9\n    );\n\n  box-shadow:\n    0 13px 30px rgba(37,99,235,0.20);\n\n  font-size: 14px;\n\n  font-weight: 720;\n\n  transition:\n    transform .2s ease,\n    box-shadow .2s ease;\n}\n\n.nxb-submit:hover {\n  transform: translateY(-2px);\n\n  box-shadow:\n    0 17px 38px rgba(37,99,235,0.26);\n}\n\n.nxb-submit svg {\n  width: 17px;\n  height: 17px;\n}\n\n\n\/* =========================================================\n   SUPPORT BANNER\n========================================================= *\/\n\n.nxb-support-bar {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n\n  gap: 25px;\n\n  margin-top: 24px;\n\n  padding:\n    26px 30px;\n}\n\n.nxb-support-left {\n  display: flex;\n  align-items: center;\n\n  gap: 16px;\n}\n\n.nxb-support-icon {\n  width: 55px;\n  height: 55px;\n\n  flex: 0 0 55px;\n\n  display: grid;\n  place-items: center;\n\n  border-radius: 17px;\n\n  color: #ffffff;\n\n  background:\n    linear-gradient(\n      135deg,\n      #4f46e5,\n      #2563eb\n    );\n\n  box-shadow:\n    0 12px 28px rgba(37,99,235,0.22);\n}\n\n.nxb-support-icon svg {\n  width: 24px;\n  height: 24px;\n}\n\n.nxb-support-bar h3 {\n  margin:\n    0 0 5px;\n\n  color: var(--text);\n\n  font-size: 18px;\n\n  font-weight: 730;\n}\n\n.nxb-support-bar p {\n  margin: 0;\n\n  color: var(--muted);\n\n  font-size: 14px;\n  line-height: 1.6;\n}\n\n.nxb-support-actions {\n  display: flex;\n\n  gap: 10px;\n\n  flex-shrink: 0;\n}\n\n.nxb-support-button {\n  min-height: 44px;\n\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n\n  gap: 8px;\n\n  padding:\n    0 16px;\n\n  border-radius: 11px;\n\n  font-family: inherit;\n\n  font-size: 13px;\n\n  font-weight: 680;\n\n  cursor: pointer;\n\n  transition:\n    transform .2s ease,\n    background .2s ease;\n}\n\n.nxb-support-button svg {\n  width: 17px;\n  height: 17px;\n}\n\n.nxb-call-button {\n  color: var(--text-2);\n\n  background: #ffffff;\n\n  border:\n    1px solid var(--border);\n}\n\n.nxb-call-button:hover {\n  color: var(--primary);\n\n  transform:\n    translateY(-1px);\n}\n\n.nxb-chat-button {\n  border:\n    1px solid var(--primary);\n\n  color: #ffffff;\n\n  background:\n    var(--primary);\n}\n\n.nxb-chat-button:hover {\n  background:\n    var(--primary-dark);\n\n  transform:\n    translateY(-1px);\n}\n\n\n\/* =========================================================\n   LIVE CHAT FLOATING\n========================================================= *\/\n\n.nxb-livechat {\n  position: fixed;\n\n  z-index: 9999;\n\n  right: 24px;\n  bottom: 24px;\n\n  font-family:\n    Inter,\n    -apple-system,\n    BlinkMacSystemFont,\n    \"Segoe UI\",\n    Roboto,\n    sans-serif;\n}\n\n\n\/* floating button *\/\n\n.nxb-chat-trigger {\n  position: relative;\n\n  width: 60px;\n  height: 60px;\n\n  display: grid;\n  place-items: center;\n\n  border: 0;\n\n  border-radius: 18px;\n\n  cursor: pointer;\n\n  color: #ffffff;\n\n  background:\n    linear-gradient(\n      135deg,\n      #4f46e5,\n      #2563eb,\n      #0ea5e9\n    );\n\n  box-shadow:\n    0 18px 45px rgba(37,99,235,0.34);\n\n  transition:\n    transform .2s ease;\n}\n\n.nxb-chat-trigger:hover {\n  transform:\n    translateY(-3px);\n}\n\n.nxb-chat-trigger svg {\n  width: 27px;\n  height: 27px;\n}\n\n.nxb-online-dot {\n  position: absolute;\n\n  top: -2px;\n  right: -2px;\n\n  width: 14px;\n  height: 14px;\n\n  border-radius: 50%;\n\n  background: #22c55e;\n\n  border:\n    3px solid white;\n}\n\n\n\/* Chat popup *\/\n\n.nxb-chat-popup {\n  position: absolute;\n\n  right: 0;\n  bottom: 74px;\n\n  width:\n    min(370px, calc(100vw - 32px));\n\n  overflow: hidden;\n\n  border-radius: 20px;\n\n  background: #ffffff;\n\n  border:\n    1px solid var(--border);\n\n  box-shadow:\n    0 28px 80px rgba(15,23,42,0.18);\n\n  opacity: 0;\n  visibility: hidden;\n\n  transform:\n    translateY(15px)\n    scale(.97);\n\n  transform-origin:\n    bottom right;\n\n  transition:\n    opacity .2s ease,\n    visibility .2s ease,\n    transform .2s ease;\n}\n\n.nxb-chat-popup.is-open {\n  opacity: 1;\n  visibility: visible;\n\n  transform:\n    translateY(0)\n    scale(1);\n}\n\n\n\/* chat header *\/\n\n.nxb-chat-header {\n  display: flex;\n  align-items: center;\n\n  gap: 11px;\n\n  padding:\n    17px 18px;\n\n  color: white;\n\n  background:\n    linear-gradient(\n      120deg,\n      #1d4ed8,\n      #4f46e5\n    );\n}\n\n.nxb-chat-avatar {\n  width: 42px;\n  height: 42px;\n\n  flex: 0 0 42px;\n\n  display: grid;\n  place-items: center;\n\n  border-radius: 13px;\n\n  color: white;\n\n  background:\n    rgba(255,255,255,0.14);\n\n  border:\n    1px solid rgba(255,255,255,0.2);\n}\n\n.nxb-chat-avatar svg {\n  width: 22px;\n  height: 22px;\n}\n\n.nxb-chat-head-copy {\n  min-width: 0;\n}\n\n.nxb-chat-name {\n  margin-bottom: 3px;\n\n  font-size: 14px;\n\n  font-weight: 720;\n}\n\n.nxb-chat-status {\n  display: flex;\n  align-items: center;\n\n  gap: 6px;\n\n  color:\n    rgba(255,255,255,0.8);\n\n  font-size: 11px;\n}\n\n.nxb-chat-status-dot {\n  width: 7px;\n  height: 7px;\n\n  border-radius: 50%;\n\n  background: #4ade80;\n}\n\n.nxb-chat-close {\n  width: 32px;\n  height: 32px;\n\n  margin-left: auto;\n\n  display: grid;\n  place-items: center;\n\n  border: 0;\n\n  border-radius: 9px;\n\n  cursor: pointer;\n\n  color: #ffffff;\n\n  background:\n    rgba(255,255,255,0.1);\n}\n\n.nxb-chat-close svg {\n  width: 17px;\n  height: 17px;\n}\n\n\n\/* messages *\/\n\n.nxb-chat-body {\n  height: 300px;\n\n  overflow-y: auto;\n\n  padding: 18px;\n\n  background:\n    linear-gradient(\n      180deg,\n      #f8fbff,\n      #ffffff\n    );\n}\n\n.nxb-chat-message {\n  max-width: 84%;\n\n  padding:\n    11px 13px;\n\n  border-radius:\n    15px 15px 15px 5px;\n\n  color: var(--text-2);\n\n  background: white;\n\n  border:\n    1px solid var(--border);\n\n  box-shadow:\n    0 5px 16px rgba(15,23,42,0.04);\n\n  font-size: 13px;\n\n  line-height: 1.55;\n}\n\n.nxb-chat-message-user {\n  margin-left: auto;\n  margin-top: 12px;\n\n  color: #ffffff;\n\n  background:\n    linear-gradient(\n      135deg,\n      #2563eb,\n      #4f46e5\n    );\n\n  border: 0;\n\n  border-radius:\n    15px 15px 5px 15px;\n}\n\n\n\/* footer *\/\n\n.nxb-chat-footer {\n  padding: 12px;\n\n  border-top:\n    1px solid var(--border);\n\n  background: white;\n}\n\n.nxb-chat-input-wrap {\n  display: flex;\n  align-items: flex-end;\n\n  gap: 8px;\n\n  padding:\n    8px 8px 8px 12px;\n\n  border:\n    1px solid #dbe3ee;\n\n  border-radius: 13px;\n\n  background: #f8fafc;\n}\n\n.nxb-chat-input {\n  flex: 1;\n\n  min-width: 0;\n  min-height: 34px;\n\n  max-height: 80px;\n\n  padding:\n    7px 0;\n\n  border: 0;\n  outline: 0;\n\n  resize: none;\n\n  color: var(--text);\n\n  background: transparent;\n\n  font-family: inherit;\n\n  font-size: 13px;\n}\n\n.nxb-chat-input::placeholder {\n  color: #94a3b8;\n}\n\n.nxb-chat-send {\n  width: 38px;\n  height: 38px;\n\n  flex: 0 0 38px;\n\n  display: grid;\n  place-items: center;\n\n  border: 0;\n\n  border-radius: 10px;\n\n  cursor: pointer;\n\n  color: #ffffff;\n\n  background: var(--primary);\n}\n\n.nxb-chat-send svg {\n  width: 17px;\n  height: 17px;\n}\n\n\n\/* =========================================================\n   TABLET\n========================================================= *\/\n\n@media (max-width: 1050px) {\n\n  .nxb-hero-grid {\n    grid-template-columns: 1fr;\n\n    gap: 36px;\n  }\n\n  .nxb-visual-area {\n    min-height: 520px;\n  }\n\n  .nxb-main-grid {\n    grid-template-columns: 1fr;\n  }\n\n}\n\n\n\/* =========================================================\n   MOBILE\n========================================================= *\/\n\n@media (max-width: 700px) {\n\n  .nxb-container {\n    width:\n      min(100% - 28px, 1180px);\n  }\n\n  .nxb-contact-hero {\n    padding:\n      55px 0 45px;\n  }\n\n  .nxb-hero-title {\n    font-size:\n      clamp(38px, 12vw, 48px);\n\n    letter-spacing:\n      -0.04em;\n  }\n\n  .nxb-hero-desc {\n    font-size: 15px;\n  }\n\n\n  \/* 2 features mobile *\/\n\n  .nxb-feature-bar {\n    grid-template-columns: 1fr;\n\n    max-width: 100%;\n  }\n\n  .nxb-feature-item + .nxb-feature-item {\n    border-left: 0;\n\n    border-top:\n      1px solid #e6edf6;\n  }\n\n  .nxb-feature-title,\n  .nxb-feature-desc {\n    white-space: normal;\n  }\n\n\n  \/* visual *\/\n\n  .nxb-visual-area {\n    min-height: 440px;\n\n    transform:\n      scale(.88);\n\n    margin:\n      -20px 0 -35px;\n  }\n\n  .nxb-envelope-wrap {\n    width: 335px;\n  }\n\n  .nxb-orbit-ring {\n    width: 380px;\n    height: 380px;\n  }\n\n  .nxb-badge-send {\n    left: -3px;\n  }\n\n  .nxb-badge-reply {\n    right: -4px;\n  }\n\n\n  \/* forms *\/\n\n  .nxb-form-grid {\n    grid-template-columns: 1fr;\n  }\n\n  .nxb-field-full {\n    grid-column: auto;\n  }\n\n  .nxb-info-card,\n  .nxb-form-card {\n    padding:\n      24px 20px;\n  }\n\n\n  \/* support *\/\n\n  .nxb-support-bar {\n    flex-direction: column;\n\n    align-items: stretch;\n\n    padding:\n      24px 20px;\n  }\n\n  .nxb-support-actions {\n    display: grid;\n\n    grid-template-columns: 1fr;\n  }\n\n  .nxb-support-button {\n    width: 100%;\n  }\n\n\n  \/* chat *\/\n\n  .nxb-livechat {\n    right: 14px;\n    bottom: 14px;\n  }\n\n}\n\n\n@media (max-width: 420px) {\n\n  .nxb-visual-area {\n    transform:\n      scale(.78);\n\n    margin:\n      -50px 0 -65px;\n  }\n\n}\n<\/style>\n\n\n\n<section class=\"nxb-contact-page\">\n\n\n  <!-- ======================================================\n       HERO\n  ======================================================= -->\n\n  <section class=\"nxb-contact-hero\">\n\n    <div class=\"nxb-container nxb-hero-grid\">\n\n\n      <!-- LEFT -->\n      <div>\n\n\n        <div class=\"nxb-eyebrow\">\n\n          <span class=\"nxb-eyebrow-icon\">\n\n            <svg\n              viewbox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.8\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            >\n              <path d=\"M21 15a4 4 0 0 1-4 4H8l-5 3V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4z\"\/>\n              <path d=\"M8 9h8\"\/>\n              <path d=\"M8 13h5\"\/>\n            <\/svg>\n\n          <\/span>\n\n          Li\u00ean h\u1ec7 v\u1edbi Nexbot\n\n        <\/div>\n\n\n\n        <h1 class=\"nxb-hero-title\">\n\n          Ch\u00fang t\u00f4i lu\u00f4n s\u1eb5n s\u00e0ng\n\n          <span class=\"nxb-gradient-text\">\n            l\u1eafng nghe b\u1ea1n\n          <\/span>\n\n        <\/h1>\n\n\n\n        <p class=\"nxb-hero-desc\">\n\n          B\u1ea1n c\u1ea7n t\u01b0 v\u1ea5n gi\u1ea3i ph\u00e1p, t\u00ecm hi\u1ec3u s\u1ea3n ph\u1ea9m\n          ho\u1eb7c h\u1ed7 tr\u1ee3 k\u1ef9 thu\u1eadt?\n\n          \u0110\u1ed9i ng\u0169 Nexbot lu\u00f4n s\u1eb5n s\u00e0ng \u0111\u1ed3ng h\u00e0nh\n          v\u00e0 ph\u1ea3n h\u1ed3i b\u1ea1n trong th\u1eddi gian s\u1edbm nh\u1ea5t.\n\n        <\/p>\n\n\n\n        <!-- ONLY 2 FEATURES -->\n        <div class=\"nxb-feature-bar\">\n\n\n          <!-- FEATURE 1 -->\n\n          <div class=\"nxb-feature-item\">\n\n            <div class=\"nxb-feature-icon\">\n\n              <svg\n                viewbox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              >\n                <path d=\"M21 15a4 4 0 0 1-4 4H8l-5 3V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4z\"\/>\n                <path d=\"M8 10h8\"\/>\n                <path d=\"M8 14h5\"\/>\n              <\/svg>\n\n            <\/div>\n\n            <div class=\"nxb-feature-copy\">\n\n              <strong class=\"nxb-feature-title\">\n                Ph\u1ea3n h\u1ed3i nhanh ch\u00f3ng\n              <\/strong>\n\n              <span class=\"nxb-feature-desc\">\n                H\u1ed7 tr\u1ee3 trong th\u1eddi gian s\u1edbm nh\u1ea5t\n              <\/span>\n\n            <\/div>\n\n          <\/div>\n\n\n\n          <!-- FEATURE 2 -->\n\n          <div class=\"nxb-feature-item\">\n\n            <div class=\"nxb-feature-icon\">\n\n              <svg\n                viewbox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              >\n                <path d=\"M4 14v-2a8 8 0 0 1 16 0v2\"\/>\n                <rect x=\"3\" y=\"13\" width=\"4\" height=\"6\" rx=\"2\"\/>\n                <rect x=\"17\" y=\"13\" width=\"4\" height=\"6\" rx=\"2\"\/>\n                <path d=\"M18 19c0 1.1-.9 2-2 2h-3\"\/>\n              <\/svg>\n\n            <\/div>\n\n            <div class=\"nxb-feature-copy\">\n\n              <strong class=\"nxb-feature-title\">\n                H\u1ed7 tr\u1ee3 t\u1eadn t\u00e2m\n              <\/strong>\n\n              <span class=\"nxb-feature-desc\">\n                \u0110\u1ed9i ng\u0169 chuy\u00ean nghi\u1ec7p\n              <\/span>\n\n            <\/div>\n\n          <\/div>\n\n\n        <\/div>\n\n      <\/div>\n\n\n\n      <!-- ==================================================\n           HERO VISUAL\n      =================================================== -->\n\n      <div class=\"nxb-visual-area\">\n\n\n        <div class=\"nxb-visual-bg\"><\/div>\n\n\n        <div class=\"nxb-orbit-ring\"><\/div>\n\n\n        <div class=\"nxb-dot-grid\"><\/div>\n\n\n        <div class=\"nxb-plus nxb-plus-one\">\n          +\n        <\/div>\n\n\n        <div class=\"nxb-plus nxb-plus-two\">\n          +\n        <\/div>\n\n\n\n        <!-- PLANE TRAIL -->\n\n        <div class=\"nxb-plane-trail\"><\/div>\n\n\n        <svg\n          class=\"nxb-paper-plane\"\n          viewbox=\"0 0 24 24\"\n          fill=\"currentColor\"\n        >\n          <path d=\"M21.8 2.2c-.3-.3-.7-.3-1.1-.2L2.8 8.8c-.5.2-.8.6-.8 1.1 0 .5.3.9.8 1.1l7.1 2.7 2.7 7.1c.2.5.6.8 1.1.8h.1c.5 0 .9-.3 1.1-.8L22 3.3c.1-.4.1-.8-.2-1.1zM13.7 18l-1.8-4.7 5.8-5.8-7.1 4.2L5.8 10l13-5-5.1 13z\"\/>\n        <\/svg>\n\n\n\n        <!-- ENVELOPE -->\n\n        <div class=\"nxb-envelope-wrap\">\n\n\n          <div class=\"nxb-envelope-base\"><\/div>\n\n\n\n          <!-- LETTER -->\n\n          <div class=\"nxb-letter\">\n\n            <svg\n              class=\"nxb-n-logo\"\n              viewbox=\"0 0 100 100\"\n              fill=\"none\"\n            >\n\n              <defs>\n\n                <lineargradient\n                  id=\"nxb-logo-gradient\"\n                  x1=\"10\"\n                  y1=\"12\"\n                  x2=\"88\"\n                  y2=\"90\"\n                >\n\n                  <stop\n                    stop-color=\"#4338CA\"\n                  \/>\n\n                  <stop\n                    offset=\".45\"\n                    stop-color=\"#4F46E5\"\n                  \/>\n\n                  <stop\n                    offset=\".72\"\n                    stop-color=\"#2563EB\"\n                  \/>\n\n                  <stop\n                    offset=\"1\"\n                    stop-color=\"#0EA5E9\"\n                  \/>\n\n                <\/lineargradient>\n\n              <\/defs>\n\n\n              <path\n                d=\"M21 74L34 26C36 18 46 16 51 23L64 41L69 24C71 16 83 18 81 27L68 75C66 83 56 84 51 78L38 60L33 77C31 85 19 82 21 74Z\"\n                fill=\"url(#nxb-logo-gradient)\"\n              \/>\n\n            <\/svg>\n\n          <\/div>\n\n\n\n          <!-- ENVELOPE FLAPS -->\n\n          <div class=\"nxb-envelope-left\"><\/div>\n\n          <div class=\"nxb-envelope-right\"><\/div>\n\n          <div class=\"nxb-envelope-front\"><\/div>\n\n\n\n          <!-- SEND BADGE -->\n\n          <div class=\"nxb-badge nxb-badge-send\">\n\n\n            <span class=\"nxb-badge-icon\">\n\n              <svg\n                viewbox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              >\n                <path d=\"M22 2L11 13\"\/>\n                <path d=\"M22 2l-7 20-4-9-9-4z\"\/>\n              <\/svg>\n\n            <\/span>\n\n\n            <div>\n\n              <strong>\n                G\u1eedi y\u00eau c\u1ea7u\n              <\/strong>\n\n              <small>\n                Nhanh ch\u00f3ng\n              <\/small>\n\n            <\/div>\n\n          <\/div>\n\n\n\n          <!-- REPLY BADGE -->\n\n          <div class=\"nxb-badge nxb-badge-reply\">\n\n\n            <span class=\"nxb-badge-icon\">\n\n              <svg\n                viewbox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              >\n                <path d=\"M21 15a4 4 0 0 1-4 4H8l-5 3V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4z\"\/>\n                <path d=\"M8 10h.01\"\/>\n                <path d=\"M12 10h.01\"\/>\n                <path d=\"M16 10h.01\"\/>\n              <\/svg>\n\n            <\/span>\n\n\n            <div>\n\n              <strong>\n                Nh\u1eadn ph\u1ea3n h\u1ed3i\n              <\/strong>\n\n              <small>\n                \u0110\u1ed9i ng\u0169 Nexbot\n              <\/small>\n\n            <\/div>\n\n          <\/div>\n\n\n\n          <!-- SECURITY BADGE -->\n\n          <div class=\"nxb-badge nxb-badge-security\">\n\n\n            <span class=\"nxb-badge-icon\">\n\n              <svg\n                viewbox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              >\n                <path d=\"M12 3l8 4v5c0 5-3.5 8.5-8 10-4.5-1.5-8-5-8-10V7l8-4z\"\/>\n                <path d=\"M9 12l2 2 4-4\"\/>\n              <\/svg>\n\n            <\/span>\n\n\n            <div>\n\n              <strong>\n                B\u1ea3o m\u1eadt\n              <\/strong>\n\n              <small>\n                An to\u00e0n d\u1eef li\u1ec7u\n              <\/small>\n\n            <\/div>\n\n          <\/div>\n\n\n        <\/div>\n\n      <\/div>\n\n    <\/div>\n\n  <\/section>\n\n\n\n  <!-- ======================================================\n       CONTACT MAIN\n  ======================================================= -->\n\n  <section class=\"nxb-contact-main\">\n\n    <div class=\"nxb-container\">\n\n\n      <div class=\"nxb-main-grid\">\n\n\n        <!-- INFO CARD -->\n\n        <aside class=\"nxb-card nxb-info-card\">\n\n\n          <h2 class=\"nxb-card-title\">\n            Th\u00f4ng tin li\u00ean h\u1ec7\n          <\/h2>\n\n\n\n          <!-- ADDRESS -->\n\n          <div class=\"nxb-info-row\">\n\n            <div class=\"nxb-info-icon\">\n\n              <svg\n                viewbox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              >\n                <path d=\"M20 10c0 5-8 12-8 12S4 15 4 10a8 8 0 1 1 16 0z\"\/>\n                <circle cx=\"12\" cy=\"10\" r=\"2.5\"\/>\n              <\/svg>\n\n            <\/div>\n\n\n            <div>\n\n              <span class=\"nxb-info-label\">\n                VP H\u00e0 N\u1ed9i\n              <\/span>\n\n              <div class=\"nxb-info-value\">\n\n                T\u1ea7ng 18, T\u00f2a nh\u00e0 28 Nguy\u1ec5n L\u01b0\u01a1ng B\u1eb1ng\n                <br>\n\n                Ph\u01b0\u1eddng \u0110\u1ed1ng \u0110a, Th\u00e0nh ph\u1ed1 H\u00e0 N\u1ed9i\n\n              <\/div>\n\n            <\/div>\n\n          <\/div>\n\n\n\n          <!-- PHONE -->\n\n          <div class=\"nxb-info-row\">\n\n            <div class=\"nxb-info-icon\">\n\n              <svg\n                viewbox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              >\n                <path d=\"M22 16.92v3a2 2 0 0 1-2.18 2A19.79 19.79 0 0 1 3.09 5.18 2 2 0 0 1 5.08 3h3a2 2 0 0 1 2 1.72c.12.9.33 1.78.62 2.63a2 2 0 0 1-.45 2.11L9 10.71a16 16 0 0 0 4.29 4.29l1.25-1.25a2 2 0 0 1 2.11-.45c.85.29 1.73.5 2.63.62A2 2 0 0 1 22 16.92z\"\/>\n              <\/svg>\n\n            <\/div>\n\n\n            <div>\n\n              <span class=\"nxb-info-label\">\n                \u0110i\u1ec7n tho\u1ea1i\n              <\/span>\n\n              <div class=\"nxb-info-value\">\n\n                <a href=\"tel:02477700888\">\n                  024 7770 0888\n                <\/a>\n\n              <\/div>\n\n            <\/div>\n\n          <\/div>\n\n\n\n          <!-- EMAIL -->\n\n          <div class=\"nxb-info-row\">\n\n            <div class=\"nxb-info-icon\">\n\n              <svg\n                viewbox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              >\n                <rect\n                  x=\"3\"\n                  y=\"5\"\n                  width=\"18\"\n                  height=\"14\"\n                  rx=\"2\"\n                \/>\n\n                <path d=\"M3 7l9 6 9-6\"\/>\n              <\/svg>\n\n            <\/div>\n\n\n            <div>\n\n              <span class=\"nxb-info-label\">\n                Email\n              <\/span>\n\n              <div class=\"nxb-info-value\">\n\n                <a href=\"mailto:support@sanphotonow.com\">\n                  support@sanphotonow.com\n                <\/a>\n\n              <\/div>\n\n            <\/div>\n\n          <\/div>\n\n\n\n          <!-- SUPPORT -->\n\n          <div class=\"nxb-info-row\">\n\n            <div class=\"nxb-info-icon\">\n\n              <svg\n                viewbox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              >\n                <path d=\"M4 14v-2a8 8 0 0 1 16 0v2\"\/>\n                <rect x=\"3\" y=\"13\" width=\"4\" height=\"6\" rx=\"2\"\/>\n                <rect x=\"17\" y=\"13\" width=\"4\" height=\"6\" rx=\"2\"\/>\n                <path d=\"M18 19c0 1.1-.9 2-2 2h-3\"\/>\n              <\/svg>\n\n            <\/div>\n\n\n            <div>\n\n              <span class=\"nxb-info-label\">\n                H\u1ed7 tr\u1ee3 kh\u00e1ch h\u00e0ng\n              <\/span>\n\n              <div class=\"nxb-info-value\">\n\n                T\u01b0 v\u1ea5n gi\u1ea3i ph\u00e1p, tri\u1ec3n khai s\u1ea3n ph\u1ea9m\n                v\u00e0 h\u1ed7 tr\u1ee3 k\u1ef9 thu\u1eadt d\u00e0nh cho kh\u00e1ch h\u00e0ng Nexbot.\n\n              <\/div>\n\n            <\/div>\n\n          <\/div>\n\n\n        <\/aside>\n\n\n\n        <!-- ==================================================\n             CONTACT FORM\n        =================================================== -->\n\n        <div class=\"nxb-card nxb-form-card\">\n\n\n          <h2 class=\"nxb-card-title\">\n            G\u1eedi y\u00eau c\u1ea7u cho ch\u00fang t\u00f4i\n          <\/h2>\n\n\n          <form id=\"nxbContactForm\" action=\"\">\n\n\n            <div class=\"nxb-form-grid\">\n\n\n              <div class=\"nxb-field\">\n\n                <label>\n                  H\u1ecd v\u00e0 t\u00ean\n                  <span class=\"nxb-required\">*<\/span>\n                <\/label>\n\n                <input\n                  type=\"text\"\n                  name=\"name\"\n                  autocomplete=\"name\"\n                  placeholder=\"Nh\u1eadp h\u1ecd v\u00e0 t\u00ean\"\n                  required\n>\n\n              <\/div>\n\n\n\n              <div class=\"nxb-field\">\n\n                <label>\n                  Email\n                  <span class=\"nxb-required\">*<\/span>\n                <\/label>\n\n                <input\n                  type=\"email\"\n                  name=\"email\"\n                  autocomplete=\"email\"\n                  placeholder=\"name@company.com\"\n                  required\n>\n\n              <\/div>\n\n\n\n              <div class=\"nxb-field\">\n\n                <label>\n                  S\u1ed1 \u0111i\u1ec7n tho\u1ea1i\n                <\/label>\n\n                <input\n                  type=\"tel\"\n                  name=\"phone\"\n                  autocomplete=\"tel\"\n                  placeholder=\"Nh\u1eadp s\u1ed1 \u0111i\u1ec7n tho\u1ea1i\"\n                >\n\n              <\/div>\n\n\n\n              <div class=\"nxb-field\">\n\n                <label>\n                  Ch\u1ee7 \u0111\u1ec1\n                  <span class=\"nxb-required\">*<\/span>\n                <\/label>\n\n                <select\n                  name=\"subject\"\n                  required\n>\n\n                  <option value=\"\">\n                    Ch\u1ecdn ch\u1ee7 \u0111\u1ec1\n                  <\/option>\n\n                  <option value=\"consult\">\n                    T\u01b0 v\u1ea5n gi\u1ea3i ph\u00e1p\n                  <\/option>\n\n                  <option value=\"product\">\n                    T\u00ecm hi\u1ec3u s\u1ea3n ph\u1ea9m\n                  <\/option>\n\n                  <option value=\"support\">\n                    H\u1ed7 tr\u1ee3 k\u1ef9 thu\u1eadt\n                  <\/option>\n\n                  <option value=\"partner\">\n                    H\u1ee3p t\u00e1c kinh doanh\n                  <\/option>\n\n                  <option value=\"other\">\n                    N\u1ed9i dung kh\u00e1c\n                  <\/option>\n\n                <\/select>\n\n              <\/div>\n\n\n\n              <div class=\"nxb-field nxb-field-full\">\n\n                <label>\n                  N\u1ed9i dung\n                  <span class=\"nxb-required\">*<\/span>\n                <\/label>\n\n                <textarea\n                  name=\"message\"\n                  placeholder=\"H\u00e3y cho Nexbot bi\u1ebft ch\u00fang t\u00f4i c\u00f3 th\u1ec3 h\u1ed7 tr\u1ee3 b\u1ea1n nh\u01b0 th\u1ebf n\u00e0o...\"\n                  required\n><\/textarea>\n\n              <\/div>\n\n\n            <\/div>\n\n\n\n            <div class=\"nxb-privacy\">\n\n              <svg\n                viewbox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              >\n                <rect\n                  x=\"5\"\n                  y=\"10\"\n                  width=\"14\"\n                  height=\"11\"\n                  rx=\"2\"\n                \/>\n\n                <path d=\"M8 10V7a4 4 0 0 1 8 0v3\"\/>\n              <\/svg>\n\n\n              <span>\n\n                Th\u00f4ng tin c\u1ee7a b\u1ea1n \u0111\u01b0\u1ee3c b\u1ea3o m\u1eadt theo\n\n                <a href=\"\/en\/privacy-policy\/\">\n                  Ch\u00ednh s\u00e1ch b\u1ea3o m\u1eadt\n                <\/a>\n\n                c\u1ee7a Nexbot.\n\n              <\/span>\n\n            <\/div>\n\n\n\n            <button\n              type=\"submit\"\n              class=\"nxb-submit\"\n            >\n\n              <span>\n                G\u1eedi y\u00eau c\u1ea7u\n              <\/span>\n\n\n              <svg\n                viewbox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              >\n                <path d=\"M22 2L11 13\"\/>\n                <path d=\"M22 2l-7 20-4-9-9-4z\"\/>\n              <\/svg>\n\n            <\/button>\n\n\n          <input type=\"hidden\" name=\"trp-form-language\" value=\"en\"\/><\/form>\n\n        <\/div>\n\n      <\/div>\n\n\n\n      <!-- ==================================================\n           SUPPORT BANNER\n      =================================================== -->\n\n      <div class=\"nxb-card nxb-support-bar\">\n\n\n        <div class=\"nxb-support-left\">\n\n\n          <div class=\"nxb-support-icon\">\n\n            <svg\n              viewbox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.8\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            >\n              <path d=\"M4 14v-2a8 8 0 0 1 16 0v2\"\/>\n              <rect x=\"3\" y=\"13\" width=\"4\" height=\"6\" rx=\"2\"\/>\n              <rect x=\"17\" y=\"13\" width=\"4\" height=\"6\" rx=\"2\"\/>\n              <path d=\"M18 19c0 1.1-.9 2-2 2h-3\"\/>\n            <\/svg>\n\n          <\/div>\n\n\n          <div>\n\n            <h3>\n              B\u1ea1n c\u1ea7n h\u1ed7 tr\u1ee3 ngay?\n            <\/h3>\n\n            <p>\n              G\u1ecdi hotline ho\u1eb7c tr\u00f2 chuy\u1ec7n tr\u1ef1c ti\u1ebfp v\u1edbi \u0111\u1ed9i ng\u0169 Nexbot.\n            <\/p>\n\n          <\/div>\n\n\n        <\/div>\n\n\n\n        <div class=\"nxb-support-actions\">\n\n\n          <a\n            href=\"tel:02477700888\"\n            class=\"nxb-support-button              nxb-call-button\"\n          >\n\n            <svg\n              viewbox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.8\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            >\n              <path d=\"M22 16.92v3a2 2 0 0 1-2.18 2A19.79 19.79 0 0 1 3.09 5.18 2 2 0 0 1 5.08 3h3a2 2 0 0 1 2 1.72c.12.9.33 1.78.62 2.63a2 2 0 0 1-.45 2.11L9 10.71a16 16 0 0 0 4.29 4.29l1.25-1.25a2 2 0 0 1 2.11-.45c.85.29 1.73.5 2.63.62A2 2 0 0 1 22 16.92z\"\/>\n            <\/svg>\n\n            024 7770 0888\n\n          <\/a>\n\n\n\n          <button\n            type=\"button\"\n            class=\"nxb-support-button              nxb-chat-button\"\n            id=\"nxbOpenChat\"\n          >\n\n            <svg\n              viewbox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.8\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            >\n              <path d=\"M21 15a4 4 0 0 1-4 4H8l-5 3V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4z\"\/>\n            <\/svg>\n\n            Chat tr\u1ef1c ti\u1ebfp\n\n          <\/button>\n\n\n        <\/div>\n\n\n      <\/div>\n\n\n    <\/div>\n\n  <\/section>\n\n<\/section>\n\n\n\n<!-- =========================================================\n     LIVE CHAT\n========================================================= -->\n\n<div class=\"nxb-livechat\">\n\n\n  <!-- CHAT POPUP -->\n\n  <div\n    class=\"nxb-chat-popup\"\n    id=\"nxbChatPopup\"\n  >\n\n\n    <div class=\"nxb-chat-header\">\n\n\n      <div class=\"nxb-chat-avatar\">\n\n        <svg\n          viewbox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"1.8\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n        >\n          <path d=\"M4 14v-2a8 8 0 0 1 16 0v2\"\/>\n          <rect x=\"3\" y=\"13\" width=\"4\" height=\"6\" rx=\"2\"\/>\n          <rect x=\"17\" y=\"13\" width=\"4\" height=\"6\" rx=\"2\"\/>\n        <\/svg>\n\n      <\/div>\n\n\n\n      <div class=\"nxb-chat-head-copy\">\n\n\n        <div class=\"nxb-chat-name\">\n          H\u1ed7 tr\u1ee3 Nexbot\n        <\/div>\n\n\n        <div class=\"nxb-chat-status\">\n\n          <span class=\"nxb-chat-status-dot\"><\/span>\n\n          Tr\u1ef1c tuy\u1ebfn\n\n        <\/div>\n\n\n      <\/div>\n\n\n\n      <button\n        type=\"button\"\n        class=\"nxb-chat-close\"\n        id=\"nxbCloseChat\"\n        aria-label=\"\u0110\u00f3ng chat\"\n      >\n\n        <svg\n          viewbox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"1.8\"\n          stroke-linecap=\"round\"\n        >\n          <path d=\"M6 6l12 12\"\/>\n          <path d=\"M18 6L6 18\"\/>\n        <\/svg>\n\n      <\/button>\n\n\n    <\/div>\n\n\n\n    <div\n      class=\"nxb-chat-body\"\n      id=\"nxbChatBody\"\n    >\n\n\n      <div class=\"nxb-chat-message\">\n\n        Xin ch\u00e0o! Nexbot c\u00f3 th\u1ec3 h\u1ed7 tr\u1ee3 b\u1ea1n\n        v\u1ec1 s\u1ea3n ph\u1ea9m, gi\u1ea3i ph\u00e1p ho\u1eb7c h\u1ed7 tr\u1ee3 k\u1ef9 thu\u1eadt.\n\n      <\/div>\n\n\n    <\/div>\n\n\n\n    <div class=\"nxb-chat-footer\">\n\n\n      <div class=\"nxb-chat-input-wrap\">\n\n\n        <textarea\n          id=\"nxbChatInput\"\n          class=\"nxb-chat-input\"\n          rows=\"1\"\n          placeholder=\"Nh\u1eadp tin nh\u1eafn...\"\n        ><\/textarea>\n\n\n\n        <button\n          type=\"button\"\n          class=\"nxb-chat-send\"\n          id=\"nxbChatSend\"\n          aria-label=\"G\u1eedi tin nh\u1eafn\"\n        >\n\n          <svg\n            viewbox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.8\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          >\n            <path d=\"M22 2L11 13\"\/>\n            <path d=\"M22 2l-7 20-4-9-9-4z\"\/>\n          <\/svg>\n\n        <\/button>\n\n\n      <\/div>\n\n\n    <\/div>\n\n\n  <\/div>\n\n\n\n  <!-- FLOAT BUTTON -->\n\n  <button\n    type=\"button\"\n    class=\"nxb-chat-trigger\"\n    id=\"nxbChatTrigger\"\n    aria-label=\"Chat v\u1edbi Nexbot\"\n  >\n\n    <span class=\"nxb-online-dot\"><\/span>\n\n\n    <svg\n      viewbox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      stroke-width=\"1.8\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n    >\n      <path d=\"M21 15a4 4 0 0 1-4 4H8l-5 3V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4z\"\/>\n      <path d=\"M8 10h.01\"\/>\n      <path d=\"M12 10h.01\"\/>\n      <path d=\"M16 10h.01\"\/>\n    <\/svg>\n\n\n  <\/button>\n\n\n<\/div>\n\n\n\n<script>\n(function () {\n\n\n  \/* =====================================================\n     CONTACT FORM\n  ===================================================== *\/\n\n  const contactForm =\n    document.getElementById(\"nxbContactForm\");\n\n\n  if (contactForm) {\n\n    contactForm.addEventListener(\n      \"submit\",\n      function (event) {\n\n        event.preventDefault();\n\n\n        const submitButton =\n          contactForm.querySelector(\".nxb-submit\");\n\n\n        if (!submitButton) {\n          return;\n        }\n\n\n        const originalHTML =\n          submitButton.innerHTML;\n\n\n        submitButton.disabled =\n          true;\n\n\n        submitButton.innerHTML =\n          `\n            <span>\u0110\u00e3 ti\u1ebfp nh\u1eadn y\u00eau c\u1ea7u<\/span>\n\n            <svg\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"2\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            >\n              <path d=\"M5 12l4 4L19 6\"\/>\n            <\/svg>\n          `;\n\n\n        submitButton.style.background =\n          \"linear-gradient(100deg,#16a34a,#22c55e)\";\n\n\n        setTimeout(function () {\n\n\n          contactForm.reset();\n\n\n          submitButton.disabled =\n            false;\n\n\n          submitButton.innerHTML =\n            originalHTML;\n\n\n          submitButton.style.background =\n            \"\";\n\n\n        }, 2500);\n\n\n      }\n    );\n\n  }\n\n\n\n  \/* =====================================================\n     CHAT\n  ===================================================== *\/\n\n  const chatPopup =\n    document.getElementById(\"nxbChatPopup\");\n\n\n  const chatTrigger =\n    document.getElementById(\"nxbChatTrigger\");\n\n\n  const openChatButton =\n    document.getElementById(\"nxbOpenChat\");\n\n\n  const closeChatButton =\n    document.getElementById(\"nxbCloseChat\");\n\n\n  const chatInput =\n    document.getElementById(\"nxbChatInput\");\n\n\n  const chatSend =\n    document.getElementById(\"nxbChatSend\");\n\n\n  const chatBody =\n    document.getElementById(\"nxbChatBody\");\n\n\n\n  function openChat() {\n\n    if (!chatPopup) {\n      return;\n    }\n\n\n    chatPopup.classList.add(\n      \"is-open\"\n    );\n\n\n    setTimeout(function () {\n\n      if (chatInput) {\n        chatInput.focus();\n      }\n\n    }, 150);\n\n  }\n\n\n\n  function closeChat() {\n\n    if (!chatPopup) {\n      return;\n    }\n\n\n    chatPopup.classList.remove(\n      \"is-open\"\n    );\n\n  }\n\n\n\n  if (chatTrigger) {\n\n    chatTrigger.addEventListener(\n      \"click\",\n      function () {\n\n        if (!chatPopup) {\n          return;\n        }\n\n\n        chatPopup.classList.toggle(\n          \"is-open\"\n        );\n\n      }\n    );\n\n  }\n\n\n\n  if (openChatButton) {\n\n    openChatButton.addEventListener(\n      \"click\",\n      openChat\n    );\n\n  }\n\n\n\n  if (closeChatButton) {\n\n    closeChatButton.addEventListener(\n      \"click\",\n      closeChat\n    );\n\n  }\n\n\n\n  \/* =====================================================\n     CHAT MESSAGE\n  ===================================================== *\/\n\n  function sendChatMessage() {\n\n\n    if (\n      !chatInput ||\n      !chatBody\n    ) {\n      return;\n    }\n\n\n    const text =\n      chatInput.value.trim();\n\n\n    if (!text) {\n      return;\n    }\n\n\n\n    const userMessage =\n      document.createElement(\"div\");\n\n\n    userMessage.className =\n      \"nxb-chat-message nxb-chat-message-user\";\n\n\n    userMessage.textContent =\n      text;\n\n\n    chatBody.appendChild(\n      userMessage\n    );\n\n\n    chatInput.value =\n      \"\";\n\n\n    chatBody.scrollTop =\n      chatBody.scrollHeight;\n\n\n\n    \/* DEMO AUTO REPLY *\/\n\n    setTimeout(function () {\n\n\n      const botMessage =\n        document.createElement(\"div\");\n\n\n      botMessage.className =\n        \"nxb-chat-message\";\n\n\n      botMessage.textContent =\n        \"C\u1ea3m \u01a1n b\u1ea1n \u0111\u00e3 li\u00ean h\u1ec7 Nexbot. \u0110\u1ed9i ng\u0169 c\u1ee7a ch\u00fang t\u00f4i \u0111\u00e3 ti\u1ebfp nh\u1eadn tin nh\u1eafn v\u00e0 s\u1ebd ph\u1ea3n h\u1ed3i b\u1ea1n trong th\u1eddi gian s\u1edbm nh\u1ea5t.\";\n\n\n      chatBody.appendChild(\n        botMessage\n      );\n\n\n      chatBody.scrollTop =\n        chatBody.scrollHeight;\n\n\n    }, 750);\n\n\n  }\n\n\n\n  if (chatSend) {\n\n    chatSend.addEventListener(\n      \"click\",\n      sendChatMessage\n    );\n\n  }\n\n\n\n  if (chatInput) {\n\n    chatInput.addEventListener(\n      \"keydown\",\n      function (event) {\n\n\n        if (\n          event.key === \"Enter\" &&\n          !event.shiftKey\n        ) {\n\n          event.preventDefault();\n\n          sendChatMessage();\n\n        }\n\n\n      }\n    );\n\n  }\n\n\n})();\n<\/script>","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-881","page","type-page","status-publish","hentry"],"acf":[],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/sanphotonow.com\/en\/wp-json\/wp\/v2\/pages\/881","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sanphotonow.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sanphotonow.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sanphotonow.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sanphotonow.com\/en\/wp-json\/wp\/v2\/comments?post=881"}],"version-history":[{"count":4,"href":"https:\/\/sanphotonow.com\/en\/wp-json\/wp\/v2\/pages\/881\/revisions"}],"predecessor-version":[{"id":7483,"href":"https:\/\/sanphotonow.com\/en\/wp-json\/wp\/v2\/pages\/881\/revisions\/7483"}],"wp:attachment":[{"href":"https:\/\/sanphotonow.com\/en\/wp-json\/wp\/v2\/media?parent=881"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}