{"id":228,"date":"2025-09-01T17:44:05","date_gmt":"2025-09-01T17:44:05","guid":{"rendered":"https:\/\/xbinnovation.com\/?page_id=228"},"modified":"2026-08-29T16:05:45","modified_gmt":"2026-08-29T16:05:45","slug":"elementor-page-228","status":"publish","type":"page","link":"https:\/\/xbinnovation.com\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"228\" class=\"elementor elementor-228\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0f1125e e-flex e-con-boxed e-con e-parent\" data-id=\"0f1125e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-003bb3d elementor-widget elementor-widget-shortcode\" data-id=\"003bb3d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><div data-post-id=\"463\" class=\"insert-page insert-page-463 \">\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"463\" class=\"elementor elementor-463\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d7277fd e-flex e-con-boxed e-con e-parent\" data-id=\"d7277fd\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c29a9e8 elementor-widget elementor-widget-html\" data-id=\"c29a9e8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div id=\"xb-header\">\r\n\r\n<style>\r\n\r\n\/* =====================================================\r\n   XBInnovation \u2014 GLOBAL HEADER\r\n   ===================================================== *\/\r\n\r\n:root {\r\n  --xb-blue: #2766cf;\r\n  --xb-blue-dark: #1e55b5;\r\n  --xb-purple: #7547c8;\r\n  --xb-text: #111827;\r\n  --xb-muted: #5b6473;\r\n  --xb-border: rgba(20, 35, 70, 0.08);\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   HEADER\r\n   ===================================================== *\/\r\n\r\n#xb-header {\r\n  position: sticky;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  z-index: 99999;\r\n\r\n  background: rgba(255, 255, 255, 0.96);\r\n\r\n  backdrop-filter: blur(18px);\r\n  -webkit-backdrop-filter: blur(18px);\r\n\r\n  border-bottom: 1px solid var(--xb-border);\r\n\r\n  transition:\r\n    box-shadow .3s ease,\r\n    background .3s ease;\r\n\r\n  overflow: visible !important;\r\n}\r\n\r\n#xb-header.xb-scrolled {\r\n  background: rgba(255, 255, 255, 0.98);\r\n\r\n  box-shadow:\r\n    0 8px 30px rgba(20, 35, 70, 0.08);\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   HEADER INNER\r\n   ===================================================== *\/\r\n\r\n.xb-header-inner {\r\n  width: min(1320px, 94%);\r\n  height: 78px;\r\n  margin: auto;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n\r\n  gap: 30px;\r\n\r\n  position: relative;\r\n  z-index: 100002;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   LOGO\r\n   ===================================================== *\/\r\n\r\n.xb-brand {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n\r\n  text-decoration: none;\r\n\r\n  flex-shrink: 0;\r\n}\r\n\r\n.xb-brand img {\r\n  width: 48px;\r\n  height: 48px;\r\n\r\n  object-fit: contain;\r\n  display: block;\r\n}\r\n\r\n.xb-brand-name {\r\n  font-family:\r\n    Arial,\r\n    Helvetica,\r\n    sans-serif;\r\n\r\n  font-size: 25px;\r\n  font-weight: 700;\r\n\r\n  letter-spacing: -0.5px;\r\n\r\n  color: var(--xb-text);\r\n\r\n  white-space: nowrap;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   DESKTOP NAVIGATION\r\n   ===================================================== *\/\r\n\r\n.xb-nav {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  gap: 4px;\r\n\r\n  margin-left: auto;\r\n}\r\n\r\n.xb-nav-item {\r\n  position: relative;\r\n}\r\n\r\n.xb-nav-link {\r\n  display: flex;\r\n  align-items: center;\r\n\r\n  gap: 6px;\r\n\r\n  padding: 10px 13px;\r\n\r\n  border-radius: 8px;\r\n\r\n  color: var(--xb-text);\r\n\r\n  text-decoration: none;\r\n\r\n  font-family:\r\n    Arial,\r\n    Helvetica,\r\n    sans-serif;\r\n\r\n  font-size: 14px;\r\n  font-weight: 500;\r\n\r\n  white-space: nowrap;\r\n\r\n  transition:\r\n    color .2s ease,\r\n    background .2s ease;\r\n}\r\n\r\n.xb-nav-link:hover {\r\n  color: var(--xb-blue);\r\n\r\n  background:\r\n    rgba(39, 102, 207, 0.06);\r\n}\r\n\r\n.xb-nav-link.active {\r\n  color: var(--xb-blue);\r\n}\r\n\r\n.xb-chevron {\r\n  font-size: 10px;\r\n\r\n  transition:\r\n    transform .2s ease;\r\n}\r\n\r\n.xb-nav-item:hover .xb-chevron {\r\n  transform:\r\n    rotate(180deg);\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   SOLUTIONS DROPDOWN \u2014 DESKTOP\r\n   ===================================================== *\/\r\n\r\n.xb-dropdown {\r\n  position: absolute;\r\n\r\n  top: calc(100% + 10px);\r\n  left: 50%;\r\n\r\n  transform:\r\n    translateX(-50%)\r\n    translateY(-7px);\r\n\r\n  min-width: 245px;\r\n\r\n  padding: 10px;\r\n\r\n  background:\r\n    rgba(255, 255, 255, 0.99);\r\n\r\n  border:\r\n    1px solid var(--xb-border);\r\n\r\n  border-radius: 14px;\r\n\r\n  box-shadow:\r\n    0 20px 55px\r\n    rgba(20, 35, 70, 0.15);\r\n\r\n  opacity: 0;\r\n  visibility: hidden;\r\n\r\n  transition:\r\n    opacity .2s ease,\r\n    visibility .2s ease,\r\n    transform .2s ease;\r\n\r\n  z-index: 100010;\r\n}\r\n\r\n.xb-nav-item:hover .xb-dropdown {\r\n  opacity: 1;\r\n  visibility: visible;\r\n\r\n  transform:\r\n    translateX(-50%)\r\n    translateY(0);\r\n}\r\n\r\n.xb-dropdown-title {\r\n  display: block;\r\n\r\n  padding:\r\n    8px 13px 6px;\r\n\r\n  font-size: 10px;\r\n\r\n  font-weight: 700;\r\n\r\n  letter-spacing: 1.3px;\r\n\r\n  text-transform: uppercase;\r\n\r\n  color: #8a93a3;\r\n}\r\n\r\n.xb-dropdown a {\r\n  display: block;\r\n\r\n  padding: 13px 14px;\r\n\r\n  border-radius: 9px;\r\n\r\n  color: var(--xb-text);\r\n\r\n  text-decoration: none;\r\n\r\n  font-family:\r\n    Arial,\r\n    Helvetica,\r\n    sans-serif;\r\n\r\n  font-size: 14px;\r\n\r\n  font-weight: 500;\r\n\r\n  transition:\r\n    background .2s ease,\r\n    color .2s ease,\r\n    transform .2s ease;\r\n\r\n  cursor: pointer;\r\n}\r\n\r\n.xb-dropdown a:hover {\r\n  background:\r\n    linear-gradient(\r\n      90deg,\r\n      rgba(39, 102, 207, 0.09),\r\n      rgba(117, 71, 200, 0.09)\r\n    );\r\n\r\n  color: var(--xb-blue);\r\n\r\n  transform:\r\n    translateX(3px);\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   DESKTOP SOCIAL ICONS\r\n   ===================================================== *\/\r\n\r\n.xb-header-right {\r\n  display: flex;\r\n  align-items: center;\r\n\r\n  gap: 8px;\r\n\r\n  flex-shrink: 0;\r\n}\r\n\r\n.xb-social {\r\n  display: flex;\r\n  align-items: center;\r\n\r\n  gap: 5px;\r\n\r\n  margin-right: 5px;\r\n}\r\n\r\n.xb-social a {\r\n  width: 34px;\r\n  height: 34px;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  border-radius: 8px;\r\n\r\n  color: white;\r\n\r\n  text-decoration: none;\r\n\r\n  font-family:\r\n    Arial,\r\n    Helvetica,\r\n    sans-serif;\r\n\r\n  font-size: 12px;\r\n  font-weight: 700;\r\n\r\n  transition:\r\n    transform .2s ease,\r\n    box-shadow .2s ease;\r\n}\r\n\r\n.xb-social a:hover {\r\n  transform:\r\n    translateY(-2px);\r\n\r\n  box-shadow:\r\n    0 6px 15px\r\n    rgba(20, 35, 70, 0.15);\r\n}\r\n\r\n.xb-linkedin {\r\n  background: #0a78b8;\r\n}\r\n\r\n.xb-instagram {\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #7b36c8,\r\n      #e43d69,\r\n      #f29a39\r\n    );\r\n}\r\n\r\n.xb-youtube {\r\n  background: #e62c2c;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   MOBILE HAMBURGER\r\n   ===================================================== *\/\r\n\r\n.xb-mobile-button {\r\n  display: none;\r\n\r\n  width: 40px;\r\n  height: 40px;\r\n\r\n  border:\r\n    1px solid var(--xb-border);\r\n\r\n  border-radius: 9px;\r\n\r\n  background: white;\r\n\r\n  cursor: pointer;\r\n\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  flex-direction: column;\r\n\r\n  gap: 5px;\r\n\r\n  padding: 0;\r\n\r\n  position: relative;\r\n\r\n  z-index: 100005;\r\n\r\n  -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.xb-mobile-button span {\r\n  display: block;\r\n\r\n  width: 19px;\r\n  height: 2px;\r\n\r\n  background:\r\n    var(--xb-text);\r\n\r\n  border-radius: 5px;\r\n\r\n  transition:\r\n    transform .2s ease;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   MOBILE MENU\r\n   ===================================================== *\/\r\n\r\n.xb-mobile-menu {\r\n  display: none !important;\r\n\r\n  position: fixed !important;\r\n\r\n  top: 70px !important;\r\n  left: 0 !important;\r\n\r\n  width: 100vw !important;\r\n\r\n  max-height:\r\n    calc(100vh - 70px);\r\n\r\n  overflow-y: auto;\r\n\r\n  background:\r\n    #ffffff !important;\r\n\r\n  border-top:\r\n    1px solid var(--xb-border);\r\n\r\n  box-shadow:\r\n    0 20px 40px\r\n    rgba(20, 35, 70, 0.16);\r\n\r\n  padding:\r\n    15px 5% 30px;\r\n\r\n  z-index: 100001 !important;\r\n}\r\n\r\n.xb-mobile-menu.open {\r\n  display: block !important;\r\n\r\n  visibility: visible !important;\r\n  opacity: 1 !important;\r\n\r\n  pointer-events: auto !important;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   MOBILE LINKS\r\n   ===================================================== *\/\r\n\r\n.xb-mobile-menu > a {\r\n  display: block !important;\r\n\r\n  padding: 15px 12px;\r\n\r\n  color: var(--xb-text) !important;\r\n\r\n  text-decoration: none !important;\r\n\r\n  font-family:\r\n    Arial,\r\n    Helvetica,\r\n    sans-serif;\r\n\r\n  font-size: 16px;\r\n\r\n  font-weight: 500;\r\n\r\n  border-radius: 8px;\r\n\r\n  cursor: pointer;\r\n\r\n  background: transparent;\r\n\r\n  -webkit-tap-highlight-color: transparent;\r\n\r\n  pointer-events: auto !important;\r\n}\r\n\r\n.xb-mobile-menu > a:hover,\r\n.xb-mobile-menu > a:active {\r\n  background:\r\n    #f4f7ff !important;\r\n\r\n  color:\r\n    var(--xb-blue) !important;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   MOBILE SOLUTIONS TITLE\r\n   ===================================================== *\/\r\n\r\n.xb-mobile-section {\r\n  margin-top: 8px;\r\n\r\n  padding:\r\n    14px 12px 6px;\r\n\r\n  font-size: 11px;\r\n\r\n  font-weight: 700;\r\n\r\n  letter-spacing: 1.3px;\r\n\r\n  text-transform: uppercase;\r\n\r\n  color: #8a93a3;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   MOBILE SOCIAL ICONS\r\n   ===================================================== *\/\r\n\r\n.xb-mobile-social {\r\n  display: flex;\r\n\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  gap: 10px;\r\n\r\n  margin-top: 18px;\r\n\r\n  padding-top: 20px;\r\n\r\n  border-top:\r\n    1px solid rgba(20, 35, 70, 0.08);\r\n}\r\n\r\n.xb-mobile-social-link {\r\n  width: 42px;\r\n  height: 42px;\r\n\r\n  display: flex !important;\r\n\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  border-radius: 9px;\r\n\r\n  color: white !important;\r\n\r\n  text-decoration: none !important;\r\n\r\n  font-family:\r\n    Arial,\r\n    Helvetica,\r\n    sans-serif;\r\n\r\n  font-size: 13px;\r\n\r\n  font-weight: 700;\r\n\r\n  transition:\r\n    transform .2s ease,\r\n    box-shadow .2s ease;\r\n\r\n  pointer-events: auto !important;\r\n}\r\n\r\n.xb-mobile-social-link:hover,\r\n.xb-mobile-social-link:active {\r\n  transform:\r\n    translateY(-2px);\r\n\r\n  color: white !important;\r\n}\r\n\r\n.xb-mobile-social-link.xb-linkedin {\r\n  background: #0a78b8;\r\n}\r\n\r\n.xb-mobile-social-link.xb-instagram {\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #7b36c8,\r\n      #e43d69,\r\n      #f29a39\r\n    );\r\n}\r\n\r\n.xb-mobile-social-link.xb-youtube {\r\n  background: #e62c2c;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   TABLET\r\n   ===================================================== *\/\r\n\r\n@media(max-width: 1100px) {\r\n\r\n  .xb-nav {\r\n    gap: 0;\r\n  }\r\n\r\n  .xb-nav-link {\r\n    padding:\r\n      9px 8px;\r\n\r\n    font-size: 13px;\r\n  }\r\n\r\n  .xb-brand-name {\r\n    font-size: 21px;\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   MOBILE\r\n   ===================================================== *\/\r\n\r\n@media(max-width: 850px) {\r\n\r\n  #xb-header {\r\n    z-index: 100000 !important;\r\n\r\n    overflow: visible !important;\r\n  }\r\n\r\n  .xb-header-inner {\r\n    height: 70px;\r\n\r\n    position: relative;\r\n\r\n    z-index: 100002 !important;\r\n  }\r\n\r\n  .xb-nav,\r\n  .xb-header-right {\r\n    display: none !important;\r\n  }\r\n\r\n  .xb-mobile-button {\r\n    display: flex !important;\r\n\r\n    position: relative;\r\n\r\n    z-index: 100005 !important;\r\n  }\r\n\r\n  .xb-brand img {\r\n    width: 43px;\r\n    height: 43px;\r\n  }\r\n\r\n  .xb-brand-name {\r\n    font-size: 21px;\r\n  }\r\n\r\n\r\n  \/*\r\n   * Keep GTranslate separate.\r\n   * The native GTranslate floating selector\r\n   * can remain visible at bottom-right.\r\n   *\/\r\n\r\n  nav.trp-floating-switcher,\r\n  .trp-floating-switcher {\r\n    z-index: 99990 !important;\r\n  }\r\n\r\n\r\n  \/*\r\n   * Mobile navigation always sits above GTranslate.\r\n   *\/\r\n\r\n  .xb-mobile-menu {\r\n    z-index: 100001 !important;\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   GTRANSLATE COMPATIBILITY\r\n   ===================================================== *\/\r\n\r\nhtml {\r\n  margin-top: 0 !important;\r\n}\r\n\r\nbody {\r\n  top: 0 !important;\r\n}\r\n\r\n\r\n\/*\r\n * IMPORTANT:\r\n * No custom translation JavaScript here.\r\n *\r\n * GTranslate's native selector handles translation.\r\n *\/\r\n\r\n\r\n\/* =====================================================\r\n   END CSS\r\n   ===================================================== *\/\r\n\r\n<\/style>\r\n\r\n\r\n<!-- =====================================================\r\n     HEADER\r\n     ===================================================== -->\r\n\r\n<header class=\"xb-header-inner\">\r\n\r\n\r\n  <!-- ===================================================\r\n       LOGO\r\n       =================================================== -->\r\n\r\n  <a\r\n    class=\"xb-brand\"\r\n    href=\"https:\/\/xbinnovation.com\/\"\r\n  >\r\n\r\n    <img decoding=\"async\"\r\n      src=\"https:\/\/xbinnovation.com\/wp-content\/uploads\/2025\/08\/XBInnovation-ISO-CT-T-1.png\"\r\n      alt=\"XBInnovation\"\r\n    >\r\n\r\n    <span class=\"xb-brand-name\">\r\n      XBInnovation\r\n    <\/span>\r\n\r\n  <\/a>\r\n\r\n\r\n  <!-- ===================================================\r\n       DESKTOP NAVIGATION\r\n       =================================================== -->\r\n\r\n  <nav class=\"xb-nav\">\r\n\r\n\r\n    <!-- HOME -->\r\n\r\n    <div class=\"xb-nav-item\">\r\n\r\n      <a\r\n        class=\"xb-nav-link active\"\r\n        href=\"https:\/\/xbinnovation.com\/\"\r\n      >\r\n        Home\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n\r\n    <!-- SOLUTIONS -->\r\n\r\n    <div class=\"xb-nav-item\">\r\n\r\n      <a\r\n        class=\"xb-nav-link\"\r\n        href=\"#\"\r\n        onclick=\"return false;\"\r\n      >\r\n\r\n        Solutions\r\n\r\n        <span class=\"xb-chevron\">\r\n          \u25be\r\n        <\/span>\r\n\r\n      <\/a>\r\n\r\n\r\n      <div class=\"xb-dropdown\">\r\n\r\n        <span class=\"xb-dropdown-title\">\r\n          Our solutions\r\n        <\/span>\r\n\r\n\r\n        <a\r\n          href=\"https:\/\/xbinnovation.com\/?page_id=97\"\r\n        >\r\n          Social XB\r\n        <\/a>\r\n\r\n\r\n        <a\r\n          href=\"https:\/\/xbinnovation.com\/?page_id=797\"\r\n        >\r\n          Ecosystem XB\r\n        <\/a>\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n\r\n    <!-- ABOUT US -->\r\n\r\n    <div class=\"xb-nav-item\">\r\n\r\n      <a\r\n        class=\"xb-nav-link\"\r\n        href=\"https:\/\/xbinnovation.com\/?page_id=91\"\r\n      >\r\n        About us\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n\r\n    <!-- FUTURE PROJECTS -->\r\n\r\n    <div class=\"xb-nav-item\">\r\n\r\n      <a\r\n        class=\"xb-nav-link\"\r\n        href=\"https:\/\/xbinnovation.com\/?page_id=656\"\r\n      >\r\n        Future projects\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n\r\n    <!-- CONTACT -->\r\n\r\n    <div class=\"xb-nav-item\">\r\n\r\n      <a\r\n        class=\"xb-nav-link\"\r\n        href=\"https:\/\/xbinnovation.com\/?page_id=102\"\r\n      >\r\n        Contact us\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n  <\/nav>\r\n\r\n\r\n  <!-- ===================================================\r\n       DESKTOP SOCIAL MEDIA\r\n       =================================================== -->\r\n\r\n  <div class=\"xb-header-right\">\r\n\r\n    <div class=\"xb-social\">\r\n\r\n      <a\r\n        class=\"xb-linkedin\"\r\n        href=\"https:\/\/www.linkedin.com\/company\/xbinnovation\"\r\n        target=\"_blank\"\r\n        rel=\"noopener\"\r\n        aria-label=\"LinkedIn\"\r\n      >\r\n        in\r\n      <\/a>\r\n\r\n\r\n      <a\r\n        class=\"xb-instagram\"\r\n        href=\"https:\/\/www.instagram.com\/xbinnovation\/\"\r\n        target=\"_blank\"\r\n        rel=\"noopener\"\r\n        aria-label=\"Instagram\"\r\n      >\r\n        \u25ce\r\n      <\/a>\r\n\r\n\r\n      <a\r\n        class=\"xb-youtube\"\r\n        href=\"https:\/\/www.youtube.com\/@XBinnovating\"\r\n        target=\"_blank\"\r\n        rel=\"noopener\"\r\n        aria-label=\"YouTube\"\r\n      >\r\n        \u25b6\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n\r\n\r\n  <!-- ===================================================\r\n       MOBILE HAMBURGER\r\n       =================================================== -->\r\n\r\n  <button\r\n    class=\"xb-mobile-button\"\r\n    id=\"xb-mobile-toggle\"\r\n    aria-label=\"Open navigation\"\r\n    aria-expanded=\"false\"\r\n    type=\"button\"\r\n  >\r\n\r\n    <span><\/span>\r\n    <span><\/span>\r\n    <span><\/span>\r\n\r\n  <\/button>\r\n\r\n\r\n<\/header>\r\n\r\n\r\n<!-- =====================================================\r\n     MOBILE NAVIGATION\r\n     ===================================================== -->\r\n\r\n<div\r\n  class=\"xb-mobile-menu\"\r\n  id=\"xb-mobile-menu\"\r\n>\r\n\r\n\r\n  <!-- HOME -->\r\n\r\n  <a\r\n    href=\"https:\/\/xbinnovation.com\/\"\r\n  >\r\n    Home\r\n  <\/a>\r\n\r\n\r\n  <!-- SOLUTIONS -->\r\n\r\n  <div class=\"xb-mobile-section\">\r\n    Solutions\r\n  <\/div>\r\n\r\n\r\n  <a\r\n    href=\"https:\/\/xbinnovation.com\/?page_id=97\"\r\n  >\r\n    Social XB\r\n  <\/a>\r\n\r\n\r\n  <a\r\n    href=\"https:\/\/xbinnovation.com\/?page_id=797\"\r\n  >\r\n    Ecosystem XB\r\n  <\/a>\r\n\r\n\r\n  <!-- ABOUT -->\r\n\r\n  <a\r\n    href=\"https:\/\/xbinnovation.com\/?page_id=91\"\r\n  >\r\n    About us\r\n  <\/a>\r\n\r\n\r\n  <!-- FUTURE PROJECTS -->\r\n\r\n  <a\r\n    href=\"https:\/\/xbinnovation.com\/?page_id=656\"\r\n  >\r\n    Future projects\r\n  <\/a>\r\n\r\n\r\n  <!-- CONTACT -->\r\n\r\n  <a\r\n    href=\"https:\/\/xbinnovation.com\/?page_id=102\"\r\n  >\r\n    Contact us\r\n  <\/a>\r\n\r\n\r\n  <!-- =================================================\r\n       MOBILE SOCIAL MEDIA\r\n       ================================================= -->\r\n\r\n  <div class=\"xb-mobile-social\">\r\n\r\n\r\n    <a\r\n      class=\"xb-mobile-social-link xb-linkedin\"\r\n      href=\"https:\/\/www.linkedin.com\/company\/xbinnovation\"\r\n      target=\"_blank\"\r\n      rel=\"noopener\"\r\n      aria-label=\"LinkedIn\"\r\n    >\r\n      in\r\n    <\/a>\r\n\r\n\r\n    <a\r\n      class=\"xb-mobile-social-link xb-instagram\"\r\n      href=\"https:\/\/www.instagram.com\/xbinnovation\/\"\r\n      target=\"_blank\"\r\n      rel=\"noopener\"\r\n      aria-label=\"Instagram\"\r\n    >\r\n      \u25ce\r\n    <\/a>\r\n\r\n\r\n    <a\r\n      class=\"xb-mobile-social-link xb-youtube\"\r\n      href=\"https:\/\/www.youtube.com\/@XBinnovating\"\r\n      target=\"_blank\"\r\n      rel=\"noopener\"\r\n      aria-label=\"YouTube\"\r\n    >\r\n      \u25b6\r\n    <\/a>\r\n\r\n\r\n  <\/div>\r\n\r\n\r\n<\/div>\r\n\r\n\r\n<!-- =====================================================\r\n     JAVASCRIPT\r\n     ===================================================== -->\r\n\r\n<script>\r\n\r\n(function () {\r\n\r\n  \/* =====================================================\r\n     MOBILE MENU INITIALIZATION\r\n     ===================================================== *\/\r\n\r\n  function initXBMobileMenu() {\r\n\r\n    var mobileButton =\r\n      document.getElementById(\r\n        \"xb-mobile-toggle\"\r\n      );\r\n\r\n    var mobileMenu =\r\n      document.getElementById(\r\n        \"xb-mobile-menu\"\r\n      );\r\n\r\n\r\n    if (\r\n      !mobileButton ||\r\n      !mobileMenu\r\n    ) {\r\n      return;\r\n    }\r\n\r\n\r\n    \/*\r\n     * Prevent duplicate initialization.\r\n     *\/\r\n\r\n    if (\r\n      mobileButton.getAttribute(\r\n        \"data-xb-menu-ready\"\r\n      ) === \"true\"\r\n    ) {\r\n      return;\r\n    }\r\n\r\n\r\n    mobileButton.setAttribute(\r\n      \"data-xb-menu-ready\",\r\n      \"true\"\r\n    );\r\n\r\n\r\n    \/* =================================================\r\n       OPEN \/ CLOSE\r\n       ================================================= *\/\r\n\r\n    mobileButton.addEventListener(\r\n      \"click\",\r\n      function (event) {\r\n\r\n        event.preventDefault();\r\n\r\n        event.stopPropagation();\r\n\r\n\r\n        var isOpen =\r\n          mobileMenu.classList.contains(\r\n            \"open\"\r\n          );\r\n\r\n\r\n        if (isOpen) {\r\n\r\n          mobileMenu.classList.remove(\r\n            \"open\"\r\n          );\r\n\r\n          mobileButton.setAttribute(\r\n            \"aria-expanded\",\r\n            \"false\"\r\n          );\r\n\r\n        } else {\r\n\r\n          mobileMenu.classList.add(\r\n            \"open\"\r\n          );\r\n\r\n          mobileButton.setAttribute(\r\n            \"aria-expanded\",\r\n            \"true\"\r\n          );\r\n\r\n        }\r\n\r\n      },\r\n      false\r\n    );\r\n\r\n\r\n    \/* =================================================\r\n       CLOSE AFTER NAVIGATION\r\n       ================================================= *\/\r\n\r\n    var links =\r\n      mobileMenu.querySelectorAll(\r\n        \"a\"\r\n      );\r\n\r\n\r\n    links.forEach(\r\n      function (link) {\r\n\r\n        link.addEventListener(\r\n          \"click\",\r\n          function () {\r\n\r\n            mobileMenu.classList.remove(\r\n              \"open\"\r\n            );\r\n\r\n            mobileButton.setAttribute(\r\n              \"aria-expanded\",\r\n              \"false\"\r\n            );\r\n\r\n          }\r\n        );\r\n\r\n      }\r\n    );\r\n\r\n\r\n    \/* =================================================\r\n       CLOSE WHEN CLICKING OUTSIDE\r\n       ================================================= *\/\r\n\r\n    document.addEventListener(\r\n      \"click\",\r\n      function (event) {\r\n\r\n        if (\r\n          mobileMenu.classList.contains(\r\n            \"open\"\r\n          ) &&\r\n          !mobileMenu.contains(\r\n            event.target\r\n          ) &&\r\n          !mobileButton.contains(\r\n            event.target\r\n          )\r\n        ) {\r\n\r\n          mobileMenu.classList.remove(\r\n            \"open\"\r\n          );\r\n\r\n          mobileButton.setAttribute(\r\n            \"aria-expanded\",\r\n            \"false\"\r\n          );\r\n\r\n        }\r\n\r\n      },\r\n      false\r\n    );\r\n\r\n  }\r\n\r\n\r\n  \/* =====================================================\r\n     HEADER SCROLL EFFECT\r\n     ===================================================== *\/\r\n\r\n  function initXBHeaderScroll() {\r\n\r\n    var header =\r\n      document.getElementById(\r\n        \"xb-header\"\r\n      );\r\n\r\n\r\n    if (!header) {\r\n      return;\r\n    }\r\n\r\n\r\n    function updateHeader() {\r\n\r\n      if (\r\n        window.scrollY > 20\r\n      ) {\r\n\r\n        header.classList.add(\r\n          \"xb-scrolled\"\r\n        );\r\n\r\n      } else {\r\n\r\n        header.classList.remove(\r\n          \"xb-scrolled\"\r\n        );\r\n\r\n      }\r\n\r\n    }\r\n\r\n\r\n    window.addEventListener(\r\n      \"scroll\",\r\n      updateHeader\r\n    );\r\n\r\n\r\n    updateHeader();\r\n\r\n  }\r\n\r\n\r\n  \/* =====================================================\r\n     INITIALIZE\r\n     ===================================================== *\/\r\n\r\n  initXBMobileMenu();\r\n\r\n  initXBHeaderScroll();\r\n\r\n\r\n  \/* =====================================================\r\n     DOM READY\r\n     ===================================================== *\/\r\n\r\n  if (\r\n    document.readyState ===\r\n    \"loading\"\r\n  ) {\r\n\r\n    document.addEventListener(\r\n      \"DOMContentLoaded\",\r\n      function () {\r\n\r\n        initXBMobileMenu();\r\n        initXBHeaderScroll();\r\n\r\n      }\r\n    );\r\n\r\n  }\r\n\r\n\r\n  \/* =====================================================\r\n     WINDOW LOAD\r\n     ===================================================== *\/\r\n\r\n  window.addEventListener(\r\n    \"load\",\r\n    function () {\r\n\r\n      initXBMobileMenu();\r\n      initXBHeaderScroll();\r\n\r\n    }\r\n  );\r\n\r\n\r\n  \/* =====================================================\r\n     ELEMENTOR COMPATIBILITY\r\n     ===================================================== *\/\r\n\r\n  if (window.jQuery) {\r\n\r\n    jQuery(window).on(\r\n      \"elementor\/frontend\/init\",\r\n      function () {\r\n\r\n        initXBMobileMenu();\r\n        initXBHeaderScroll();\r\n\r\n      }\r\n    );\r\n\r\n  }\r\n\r\n\r\n})();\r\n\r\n<\/script>\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<\/div>\n<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2852b59 e-flex e-con-boxed e-con e-parent\" data-id=\"2852b59\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f602535 elementor-widget elementor-widget-html\" data-id=\"f602535\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div style=\"\r\n  display: flex; \r\n  align-items: center; \r\n  justify-content: center; \r\n  background: #f5f5f5; \r\n  padding: 10px; \r\n  border: 1px solid #ddd; \r\n  font-family: sans-serif;\r\n  overflow: hidden;\r\n\">\r\n  <strong style=\"margin-right: 10px; white-space: nowrap;\">Latest News:<\/strong>\r\n  <div id=\"rss-ticker\" style=\"\r\n    overflow: hidden; \r\n    white-space: nowrap; \r\n    width: 80%; \r\n    font-size: 16px; \r\n    position: relative;\r\n  \">\r\n    <span id=\"rss-content\" style=\"display:inline-block; white-space: nowrap;\">Loading feed...<\/span>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\nasync function loadRSSTicker() {\r\n  const url = \"https:\/\/script.google.com\/macros\/s\/AKfycbyh7uj0yY-N6Tc9IZGncskaXD97RJ_BtAF-ZQI6jeWk2Em2zXBioT-YirXvMLzzjqAPBA\/exec\";\r\n  \r\n  try {\r\n    const response = await fetch(url);\r\n    const text = await response.text();\r\n    const parser = new DOMParser();\r\n    const xml = parser.parseFromString(text, \"application\/xml\");\r\n    const items = xml.querySelectorAll(\"item title\");\r\n\r\n    if (items.length === 0) {\r\n      document.getElementById(\"rss-content\").textContent = \"\u26a0\ufe0f No feed items found.\";\r\n      return;\r\n    }\r\n\r\n    let tickerText = \"\";\r\n    items.forEach((item, i) => {\r\n      if (i < 5) tickerText += \" \ud83d\udd39 \" + item.textContent + \" \";\r\n    });\r\n\r\n    document.getElementById(\"rss-content\").textContent = tickerText;\r\n    startTicker();\r\n  } catch (e) {\r\n    document.getElementById(\"rss-content\").textContent = \"\u26a0\ufe0f Error loading feed.\";\r\n    console.error(e);\r\n  }\r\n}\r\n\r\nfunction startTicker() {\r\n  const ticker = document.getElementById(\"rss-ticker\");\r\n  const content = document.getElementById(\"rss-content\");\r\n\r\n  let pos = ticker.offsetWidth;\r\n  let speed = 1; \/\/ increase this number for faster scroll\r\n  let paused = false;\r\n\r\n  function step() {\r\n    if (!paused) {\r\n      pos -= speed;\r\n      if (pos < -content.offsetWidth) pos = ticker.offsetWidth;\r\n      content.style.transform = `translateX(${pos}px)`;\r\n    }\r\n    requestAnimationFrame(step);\r\n  }\r\n\r\n  ticker.addEventListener(\"mouseenter\", () => paused = true);\r\n  ticker.addEventListener(\"mouseleave\", () => paused = false);\r\n\r\n  step();\r\n}\r\n\r\nloadRSSTicker();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a165f39 e-flex e-con-boxed e-con e-parent\" data-id=\"a165f39\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-684fe99 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"684fe99\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================================\r\n     XBInnovation \u2014 Homepage Hero\r\n     ========================================================= -->\r\n\r\n<section class=\"xb-hero\">\r\n\r\n  <div class=\"xb-hero-bg\"><\/div>\r\n\r\n  <div class=\"xb-hero-content\">\r\n\r\n    <!-- =====================================================\r\n         HERO TEXT\r\n         ===================================================== -->\r\n\r\n    <div class=\"xb-hero-text\">\r\n\r\n      <div class=\"xb-eyebrow\">\r\n        SCIENCE \u00d7 TECHNOLOGY \u00d7 COMMUNITY\r\n      <\/div>\r\n\r\n      <h1>\r\n        Empowering science\r\n        <br>\r\n        through <span>technology<\/span>\r\n      <\/h1>\r\n\r\n      <p>\r\n        XBInnovation develops software and builds a global ecosystem\r\n        that empowers researchers, accelerates discoveries,\r\n        and connects scientific minds.\r\n      <\/p>\r\n\r\n      <div class=\"xb-hero-buttons\">\r\n\r\n        <!-- SOCIAL XB -->\r\n\r\n        <a\r\n          href=\"https:\/\/xbinnovation.com\/?page_id=97\"\r\n          class=\"xb-btn xb-btn-primary\"\r\n        >\r\n          Social XB\r\n          <span>\u2192<\/span>\r\n        <\/a>\r\n\r\n\r\n        <!-- ECOSYSTEM XB -->\r\n\r\n        <a\r\n          href=\"https:\/\/xbinnovation.com\/?page_id=797\"\r\n          class=\"xb-btn xb-btn-secondary\"\r\n        >\r\n          Ecosystem XB\r\n          <span>\u2192<\/span>\r\n        <\/a>\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n\r\n    <!-- =====================================================\r\n         HERO VISUAL\r\n         ===================================================== -->\r\n\r\n    <div class=\"xb-hero-visual\">\r\n\r\n      <!-- Network circles -->\r\n\r\n      <div class=\"xb-network xb-network-1\"><\/div>\r\n      <div class=\"xb-network xb-network-2\"><\/div>\r\n      <div class=\"xb-network xb-network-3\"><\/div>\r\n\r\n\r\n      <!-- ===================================================\r\n           SOCIAL XB PREVIEW\r\n           =================================================== -->\r\n\r\n      <div class=\"xb-product-preview xb-social-preview\">\r\n\r\n        <div class=\"xb-preview-label\">\r\n          Social XB\r\n        <\/div>\r\n\r\n        <img decoding=\"async\"\r\n          src=\"https:\/\/xbinnovation.com\/wp-content\/uploads\/2026\/06\/V2Photo2.png\"\r\n          alt=\"Social XB software\"\r\n        >\r\n\r\n      <\/div>\r\n\r\n\r\n      <!-- ===================================================\r\n           ECOSYSTEM XB PREVIEW\r\n           =================================================== -->\r\n\r\n      <div class=\"xb-product-preview xb-ecosystem-preview\">\r\n\r\n        <div class=\"xb-preview-label\">\r\n          Ecosystem XB\r\n        <\/div>\r\n\r\n        <img decoding=\"async\"\r\n          src=\"https:\/\/xbinnovation.com\/wp-content\/uploads\/2026\/08\/EcosystemXB.png\"\r\n          alt=\"Ecosystem XB platform\"\r\n        >\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<!-- =========================================================\r\n     TWO SOLUTIONS \/ ONE MISSION\r\n     ========================================================= -->\r\n\r\n<section class=\"xb-mission\">\r\n\r\n  <div class=\"xb-mission-inner\">\r\n\r\n\r\n    <div class=\"xb-mission-eyebrow\">\r\n      TWO SOLUTIONS \u00b7 ONE MISSION\r\n    <\/div>\r\n\r\n\r\n    <h2>\r\n      Advancing science through\r\n      <span>technology.<\/span>\r\n    <\/h2>\r\n\r\n\r\n    <p class=\"xb-mission-description\">\r\n      From analyzing behavior to connecting scientific minds,\r\n      XBInnovation builds technology designed to help researchers\r\n      work faster, collaborate better, and discover more.\r\n    <\/p>\r\n\r\n\r\n    <!-- =====================================================\r\n         THREE CONCEPTS\r\n         ===================================================== -->\r\n\r\n    <div class=\"xb-mission-pillars\">\r\n\r\n\r\n      <!-- ANALYZE -->\r\n\r\n      <div class=\"xb-pillar\">\r\n\r\n        <div class=\"xb-pillar-number\">\r\n          01\r\n        <\/div>\r\n\r\n        <div class=\"xb-pillar-content\">\r\n\r\n          <h3>\r\n            Analyze\r\n          <\/h3>\r\n\r\n          <p>\r\n            Turn scientific data into meaningful insights.\r\n          <\/p>\r\n\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n\r\n      <!-- CONNECT -->\r\n\r\n      <div class=\"xb-pillar\">\r\n\r\n        <div class=\"xb-pillar-number\">\r\n          02\r\n        <\/div>\r\n\r\n        <div class=\"xb-pillar-content\">\r\n\r\n          <h3>\r\n            Connect\r\n          <\/h3>\r\n\r\n          <p>\r\n            Bring researchers, ideas, and opportunities together.\r\n          <\/p>\r\n\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n\r\n      <!-- DISCOVER -->\r\n\r\n      <div class=\"xb-pillar\">\r\n\r\n        <div class=\"xb-pillar-number\">\r\n          03\r\n        <\/div>\r\n\r\n        <div class=\"xb-pillar-content\">\r\n\r\n          <h3>\r\n            Discover\r\n          <\/h3>\r\n\r\n          <p>\r\n            Accelerate the path from research to new knowledge.\r\n          <\/p>\r\n\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<style>\r\n\r\n\/* =========================================================\r\n   HERO\r\n   ========================================================= *\/\r\n\r\n.xb-hero {\r\n\r\n  position: relative;\r\n\r\n  overflow: hidden;\r\n\r\n  \/*\r\n     Reduced from 560px to approximately 500px.\r\n     This makes the hero feel lighter and lets visitors\r\n     see that there is more content below.\r\n  *\/\r\n\r\n  min-height: 500px;\r\n\r\n  display: flex;\r\n\r\n  align-items: center;\r\n\r\n  background:\r\n    linear-gradient(\r\n      110deg,\r\n      #ffffff 0%,\r\n      #f7f9ff 45%,\r\n      #eeeaff 75%,\r\n      #ddd9ff 100%\r\n    );\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   HERO BACKGROUND\r\n   ========================================================= *\/\r\n\r\n.xb-hero-bg {\r\n\r\n  position: absolute;\r\n\r\n  inset: 0;\r\n\r\n  pointer-events: none;\r\n\r\n  background:\r\n\r\n    radial-gradient(\r\n      circle at 75% 50%,\r\n      rgba(71, 111, 220, .16),\r\n      transparent 35%\r\n    ),\r\n\r\n    radial-gradient(\r\n      circle at 95% 20%,\r\n      rgba(125, 73, 205, .18),\r\n      transparent 30%\r\n    );\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   HERO CONTENT\r\n   ========================================================= *\/\r\n\r\n.xb-hero-content {\r\n\r\n  position: relative;\r\n\r\n  z-index: 2;\r\n\r\n  width:\r\n    min(1180px, 92%);\r\n\r\n  margin: auto;\r\n\r\n  display: grid;\r\n\r\n  grid-template-columns:\r\n    48% 52%;\r\n\r\n  align-items: center;\r\n\r\n  gap: 20px;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   HERO TEXT\r\n   ========================================================= *\/\r\n\r\n.xb-hero-text {\r\n\r\n  padding:\r\n    45px 0;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   EYEBROW\r\n   ========================================================= *\/\r\n\r\n.xb-eyebrow {\r\n\r\n  font-family:\r\n    Arial,\r\n    sans-serif;\r\n\r\n  font-size: 12px;\r\n\r\n  letter-spacing: 2px;\r\n\r\n  font-weight: 700;\r\n\r\n  color: #3264c5;\r\n\r\n  margin-bottom: 18px;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   HERO HEADING\r\n   ========================================================= *\/\r\n\r\n.xb-hero h1 {\r\n\r\n  margin: 0;\r\n\r\n  font-family:\r\n    Arial,\r\n    sans-serif;\r\n\r\n  font-size:\r\n    clamp(42px, 5vw, 68px);\r\n\r\n  line-height: 1.04;\r\n\r\n  font-weight: 700;\r\n\r\n  color: #111827;\r\n}\r\n\r\n\r\n.xb-hero h1 span {\r\n\r\n  background:\r\n    linear-gradient(\r\n      90deg,\r\n      #2764cc,\r\n      #7447c7\r\n    );\r\n\r\n  -webkit-background-clip: text;\r\n\r\n  background-clip: text;\r\n\r\n  color: transparent;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   HERO PARAGRAPH\r\n   ========================================================= *\/\r\n\r\n.xb-hero p {\r\n\r\n  max-width: 560px;\r\n\r\n  margin:\r\n    24px 0;\r\n\r\n  font-size: 18px;\r\n\r\n  line-height: 1.6;\r\n\r\n  color: #374151;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   HERO BUTTONS\r\n   ========================================================= *\/\r\n\r\n.xb-hero-buttons {\r\n\r\n  display: flex;\r\n\r\n  gap: 16px;\r\n\r\n  flex-wrap: wrap;\r\n}\r\n\r\n\r\n.xb-btn {\r\n\r\n  display: inline-flex;\r\n\r\n  align-items: center;\r\n\r\n  gap: 14px;\r\n\r\n  padding:\r\n    14px 23px;\r\n\r\n  border-radius: 10px;\r\n\r\n  text-decoration: none;\r\n\r\n  font-size: 15px;\r\n\r\n  font-weight: 600;\r\n\r\n  transition:\r\n    all .25s ease;\r\n}\r\n\r\n\r\n.xb-btn span {\r\n\r\n  font-size: 20px;\r\n\r\n  line-height: 0;\r\n}\r\n\r\n\r\n\/* PRIMARY *\/\r\n\r\n.xb-btn-primary {\r\n\r\n  color: white;\r\n\r\n  background:\r\n    linear-gradient(\r\n      90deg,\r\n      #2162c7,\r\n      #3977df\r\n    );\r\n\r\n  box-shadow:\r\n    0 8px 25px\r\n    rgba(40, 95, 190, .25);\r\n}\r\n\r\n\r\n.xb-btn-primary:hover {\r\n\r\n  transform:\r\n    translateY(-2px);\r\n\r\n  box-shadow:\r\n    0 12px 30px\r\n    rgba(40, 95, 190, .35);\r\n}\r\n\r\n\r\n\/* SECONDARY *\/\r\n\r\n.xb-btn-secondary {\r\n\r\n  color: #2460c4;\r\n\r\n  background:\r\n    rgba(255,255,255,.75);\r\n\r\n  border:\r\n    1px solid #3973d5;\r\n}\r\n\r\n\r\n.xb-btn-secondary:hover {\r\n\r\n  background:\r\n    #2460c4;\r\n\r\n  color: white;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   HERO VISUAL\r\n   ========================================================= *\/\r\n\r\n.xb-hero-visual {\r\n\r\n  position: relative;\r\n\r\n  min-height: 450px;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   PRODUCT PREVIEWS\r\n   ========================================================= *\/\r\n\r\n.xb-product-preview {\r\n\r\n  position: absolute;\r\n\r\n  background: white;\r\n\r\n  border-radius: 14px;\r\n\r\n  overflow: hidden;\r\n\r\n  box-shadow:\r\n    0 25px 70px\r\n    rgba(30,40,80,.20);\r\n\r\n  border:\r\n    1px solid\r\n    rgba(255,255,255,.8);\r\n\r\n  transition:\r\n    transform .4s ease,\r\n    box-shadow .4s ease;\r\n}\r\n\r\n\r\n.xb-product-preview:hover {\r\n\r\n  transform:\r\n    translateY(-6px);\r\n\r\n  box-shadow:\r\n    0 30px 80px\r\n    rgba(30,40,80,.28);\r\n}\r\n\r\n\r\n.xb-product-preview img {\r\n\r\n  display: block;\r\n\r\n  width: 100%;\r\n\r\n  height: auto;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SOCIAL XB\r\n   ========================================================= *\/\r\n\r\n.xb-social-preview {\r\n\r\n  width: 330px;\r\n\r\n  top: 50px;\r\n\r\n  right: 5px;\r\n\r\n  z-index: 3;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   ECOSYSTEM XB\r\n   ========================================================= *\/\r\n\r\n.xb-ecosystem-preview {\r\n\r\n  width: 390px;\r\n\r\n  bottom: 25px;\r\n\r\n  left: 20px;\r\n\r\n  z-index: 4;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   PREVIEW LABEL\r\n   ========================================================= *\/\r\n\r\n.xb-preview-label {\r\n\r\n  padding:\r\n    9px 14px;\r\n\r\n  font-size: 13px;\r\n\r\n  font-weight: 700;\r\n\r\n  color: #ffffff;\r\n\r\n  background:\r\n    linear-gradient(\r\n      90deg,\r\n      #2764cc,\r\n      #7447c7\r\n    );\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   NETWORK EFFECT\r\n   ========================================================= *\/\r\n\r\n.xb-network {\r\n\r\n  position: absolute;\r\n\r\n  border-radius: 50%;\r\n\r\n  border:\r\n    1px solid\r\n    rgba(80,110,210,.15);\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n\r\n.xb-network-1 {\r\n\r\n  width: 460px;\r\n\r\n  height: 460px;\r\n\r\n  top: 0;\r\n\r\n  right: -60px;\r\n}\r\n\r\n\r\n.xb-network-2 {\r\n\r\n  width: 330px;\r\n\r\n  height: 330px;\r\n\r\n  top: 75px;\r\n\r\n  right: 5px;\r\n}\r\n\r\n\r\n.xb-network-3 {\r\n\r\n  width: 210px;\r\n\r\n  height: 210px;\r\n\r\n  top: 135px;\r\n\r\n  right: 65px;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   MISSION SECTION\r\n   ========================================================= *\/\r\n\r\n.xb-mission {\r\n\r\n  position: relative;\r\n\r\n  background: #ffffff;\r\n\r\n  padding:\r\n    55px 20px 60px;\r\n\r\n  text-align: center;\r\n}\r\n\r\n\r\n.xb-mission-inner {\r\n\r\n  width:\r\n    min(1050px, 92%);\r\n\r\n  margin: auto;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   MISSION EYEBROW\r\n   ========================================================= *\/\r\n\r\n.xb-mission-eyebrow {\r\n\r\n  font-family:\r\n    Arial,\r\n    sans-serif;\r\n\r\n  font-size: 11px;\r\n\r\n  font-weight: 700;\r\n\r\n  letter-spacing: 2px;\r\n\r\n  color: #3970ce;\r\n\r\n  margin-bottom: 12px;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   MISSION HEADING\r\n   ========================================================= *\/\r\n\r\n.xb-mission h2 {\r\n\r\n  margin: 0;\r\n\r\n  font-family:\r\n    Arial,\r\n    sans-serif;\r\n\r\n  font-size:\r\n    clamp(28px, 4vw, 42px);\r\n\r\n  line-height: 1.15;\r\n\r\n  font-weight: 700;\r\n\r\n  color: #111827;\r\n}\r\n\r\n\r\n.xb-mission h2 span {\r\n\r\n  background:\r\n    linear-gradient(\r\n      90deg,\r\n      #2764cc,\r\n      #7447c7\r\n    );\r\n\r\n  -webkit-background-clip: text;\r\n\r\n  background-clip: text;\r\n\r\n  color: transparent;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   MISSION DESCRIPTION\r\n   ========================================================= *\/\r\n\r\n.xb-mission-description {\r\n\r\n  max-width: 680px;\r\n\r\n  margin:\r\n    16px auto 35px;\r\n\r\n  font-size: 16px;\r\n\r\n  line-height: 1.65;\r\n\r\n  color: #5b6473;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   THREE PILLARS\r\n   ========================================================= *\/\r\n\r\n.xb-mission-pillars {\r\n\r\n  display: grid;\r\n\r\n  grid-template-columns:\r\n    repeat(3, 1fr);\r\n\r\n  gap: 18px;\r\n\r\n  max-width: 900px;\r\n\r\n  margin: auto;\r\n}\r\n\r\n\r\n.xb-pillar {\r\n\r\n  display: flex;\r\n\r\n  align-items: flex-start;\r\n\r\n  text-align: left;\r\n\r\n  padding:\r\n    20px;\r\n\r\n  border:\r\n    1px solid\r\n    rgba(40,80,150,.10);\r\n\r\n  border-radius: 14px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #ffffff,\r\n      #f8faff\r\n    );\r\n\r\n  transition:\r\n    transform .25s ease,\r\n    box-shadow .25s ease;\r\n}\r\n\r\n\r\n.xb-pillar:hover {\r\n\r\n  transform:\r\n    translateY(-4px);\r\n\r\n  box-shadow:\r\n    0 12px 30px\r\n    rgba(40,70,130,.10);\r\n}\r\n\r\n\r\n\/* NUMBER *\/\r\n\r\n.xb-pillar-number {\r\n\r\n  flex-shrink: 0;\r\n\r\n  font-family:\r\n    Arial,\r\n    sans-serif;\r\n\r\n  font-size: 12px;\r\n\r\n  font-weight: 700;\r\n\r\n  color: #3970ce;\r\n\r\n  margin-right: 14px;\r\n\r\n  padding-top: 3px;\r\n}\r\n\r\n\r\n\/* TEXT *\/\r\n\r\n.xb-pillar-content h3 {\r\n\r\n  margin:\r\n    0 0 5px;\r\n\r\n  font-family:\r\n    Arial,\r\n    sans-serif;\r\n\r\n  font-size: 17px;\r\n\r\n  font-weight: 700;\r\n\r\n  color: #111827;\r\n}\r\n\r\n\r\n.xb-pillar-content p {\r\n\r\n  margin: 0;\r\n\r\n  font-size: 13px;\r\n\r\n  line-height: 1.5;\r\n\r\n  color: #687386;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   MOBILE\r\n   ========================================================= *\/\r\n\r\n@media(max-width: 850px) {\r\n\r\n\r\n  \/* HERO *\/\r\n\r\n  .xb-hero {\r\n\r\n    min-height:\r\n      auto;\r\n  }\r\n\r\n\r\n  .xb-hero-content {\r\n\r\n    grid-template-columns:\r\n      1fr;\r\n\r\n    width: 90%;\r\n  }\r\n\r\n\r\n  .xb-hero-text {\r\n\r\n    padding:\r\n      55px 0 15px;\r\n\r\n    text-align: center;\r\n  }\r\n\r\n\r\n  .xb-hero p {\r\n\r\n    margin-left: auto;\r\n\r\n    margin-right: auto;\r\n  }\r\n\r\n\r\n  .xb-hero-buttons {\r\n\r\n    justify-content: center;\r\n  }\r\n\r\n\r\n  \/* VISUAL *\/\r\n\r\n  .xb-hero-visual {\r\n\r\n    min-height:\r\n      420px;\r\n  }\r\n\r\n\r\n  .xb-social-preview {\r\n\r\n    width: 58%;\r\n\r\n    right: 2%;\r\n\r\n    top: 15px;\r\n  }\r\n\r\n\r\n  .xb-ecosystem-preview {\r\n\r\n    width: 68%;\r\n\r\n    left: 2%;\r\n\r\n    bottom: 15px;\r\n  }\r\n\r\n\r\n  \/* MISSION *\/\r\n\r\n  .xb-mission {\r\n\r\n    padding:\r\n      45px 15px 50px;\r\n  }\r\n\r\n\r\n  .xb-mission-pillars {\r\n\r\n    grid-template-columns:\r\n      1fr;\r\n\r\n    max-width: 400px;\r\n  }\r\n\r\n\r\n  .xb-pillar {\r\n\r\n    padding:\r\n      18px;\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SMALL MOBILE\r\n   ========================================================= *\/\r\n\r\n@media(max-width: 500px) {\r\n\r\n\r\n  .xb-hero h1 {\r\n\r\n    font-size:\r\n      42px;\r\n  }\r\n\r\n\r\n  .xb-hero p {\r\n\r\n    font-size:\r\n      16px;\r\n  }\r\n\r\n\r\n  .xb-btn {\r\n\r\n    padding:\r\n      13px 19px;\r\n\r\n    font-size:\r\n      14px;\r\n  }\r\n\r\n\r\n  .xb-hero-visual {\r\n\r\n    min-height:\r\n      350px;\r\n  }\r\n\r\n\r\n  .xb-network-1 {\r\n\r\n    width: 340px;\r\n\r\n    height: 340px;\r\n\r\n    right: -50px;\r\n  }\r\n\r\n\r\n  .xb-network-2 {\r\n\r\n    width: 260px;\r\n\r\n    height: 260px;\r\n\r\n    right: -10px;\r\n  }\r\n\r\n\r\n  .xb-network-3 {\r\n\r\n    width: 170px;\r\n\r\n    height: 170px;\r\n\r\n    right: 35px;\r\n  }\r\n\r\n\r\n  .xb-mission h2 {\r\n\r\n    font-size:\r\n      30px;\r\n  }\r\n\r\n}\r\n\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-0d91ac4 e-flex e-con-boxed e-con e-parent\" data-id=\"0d91ac4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-eca8adc elementor-widget elementor-widget-html\" data-id=\"eca8adc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"testimonials\">\r\n  <h2>User Testimonials<\/h2>\r\n  <div class=\"testimonials-grid\" id=\"testimonials-container\">\r\n    <p>Loading testimonials...<\/p>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n.testimonials {\r\n  font-family: 'Manrope', sans-serif;\r\n  text-align: center;\r\n  padding: 40px 20px;\r\n  background: #f9f9f9;\r\n}\r\n.testimonials-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\r\n  gap: 20px;\r\n  margin-top: 20px;\r\n}\r\n.testimonial-card {\r\n  background: #fff;\r\n  padding: 20px;\r\n  border-radius: 12px;\r\n  box-shadow: 0 4px 12px rgba(0,0,0,0.08);\r\n  text-align: left;\r\n  opacity: 0;\r\n  transform: translateY(20px);\r\n  animation: slideFadeIn 0.6s ease forwards;\r\n}\r\n@keyframes slideFadeIn {\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n}\r\n.testimonial-avatar {\r\n  width: 50px;\r\n  height: 50px;\r\n  border-radius: 50%;\r\n  background: #0073e6;\r\n  color: #fff;\r\n  font-weight: bold;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  margin-bottom: 10px;\r\n}\r\n.testimonial-quote {\r\n  font-style: italic;\r\n  font-size: 1rem;\r\n  margin: 10px 0;\r\n}\r\n.testimonial-author {\r\n  font-weight: bold;\r\n  margin: 5px 0 0;\r\n}\r\n.testimonial-position {\r\n  font-size: 0.9rem;\r\n  color: #333;\r\n  margin: 2px 0;\r\n}\r\n.testimonial-university {\r\n  font-size: 0.9rem;\r\n  color: #555;\r\n}\r\n<\/style>\r\n\r\n<script>\r\nasync function loadTestimonials() {\r\n  const url = \"https:\/\/sheetdb.io\/api\/v1\/sw0m3oryc554b\"; \/\/ Your SheetDB API\r\n\r\n  try {\r\n    const response = await fetch(url);\r\n    if (!response.ok) throw new Error(\"Network response was not OK\");\r\n    const data = await response.json();\r\n\r\n    const container = document.getElementById(\"testimonials-container\");\r\n    container.innerHTML = \"\";\r\n\r\n    data.forEach((row, i) => {\r\n      \/\/ Keys with trailing spaces as in SheetDB JSON\r\n      const authorKey = \"Author \";\r\n      const universityKey = \"University \";\r\n\r\n      \/\/ Author and university with fallback\r\n      let authorName = row[authorKey] && row[authorKey].trim() !== \"\" ? row[authorKey].trim() : \"Anonymous\";\r\n      let university = row[universityKey] && row[universityKey].trim() !== \"\" ? row[universityKey].trim() : \"\";\r\n\r\n      \/\/ Initials fallback\r\n      let initials = row.Initials && row.Initials.trim() !== \"\"\r\n        ? row.Initials.trim()\r\n        : authorName.split(\" \").map(n => n[0]).join(\"\").toUpperCase() || \"?\";\r\n\r\n      const card = document.createElement(\"div\");\r\n      card.className = \"testimonial-card\";\r\n      card.style.animationDelay = `${i * 0.2}s`; \/\/ staggered slide\/fade\r\n      card.innerHTML = `\r\n        <div class=\"testimonial-avatar\">${initials}<\/div>\r\n        <p class=\"testimonial-quote\">\"${row.Quote || \"\"}\"<\/p>\r\n        <p class=\"testimonial-author\">${authorName}<\/p>\r\n        <p class=\"testimonial-position\">${row.Position || \"\"}<\/p>\r\n        <p class=\"testimonial-university\">${university}<\/p>\r\n      `;\r\n      container.appendChild(card);\r\n    });\r\n\r\n  } catch (error) {\r\n    console.error(\"Error loading testimonials:\", error);\r\n    document.getElementById(\"testimonials-container\").innerHTML = \"<p>\u26a0\ufe0f Failed to load testimonials.<\/p>\";\r\n  }\r\n}\r\n\r\nwindow.addEventListener(\"load\", loadTestimonials);\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-dc15a90 e-flex e-con-boxed e-con e-parent\" data-id=\"dc15a90\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-800ae7b elementor-widget elementor-widget-shortcode\" data-id=\"800ae7b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><div data-post-id=\"887\" class=\"insert-page insert-page-887 \">\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"887\" class=\"elementor elementor-887\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bcd3be2 e-flex e-con-boxed e-con e-parent\" data-id=\"bcd3be2\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<footer class=\"elementor-element elementor-element-0974392 e-con-full e-flex e-con e-child\" data-id=\"0974392\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-caadf7f elementor-widget elementor-widget-heading\" data-id=\"caadf7f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<p class=\"elementor-heading-title elementor-size-default\">\u00a9 2023-2026 XBInnovation. All rights <\/p>\t\t\t\t<\/div>\n\t\t\t\t<\/footer>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<\/div>\n<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Latest News: Loading feed&#8230; SCIENCE \u00d7 TECHNOLOGY \u00d7 COMMUNITY Empowering science through technology XBInnovation develops software and builds a global ecosystem that empowers researchers, accelerates discoveries, and connects scientific minds. Social XB \u2192 Ecosystem XB \u2192 Social XB Ecosystem XB TWO SOLUTIONS \u00b7 ONE MISSION Advancing science through technology. From analyzing behavior to connecting scientific [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-228","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/xbinnovation.com\/index.php?rest_route=\/wp\/v2\/pages\/228","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/xbinnovation.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/xbinnovation.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/xbinnovation.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/xbinnovation.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=228"}],"version-history":[{"count":275,"href":"https:\/\/xbinnovation.com\/index.php?rest_route=\/wp\/v2\/pages\/228\/revisions"}],"predecessor-version":[{"id":934,"href":"https:\/\/xbinnovation.com\/index.php?rest_route=\/wp\/v2\/pages\/228\/revisions\/934"}],"wp:attachment":[{"href":"https:\/\/xbinnovation.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=228"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}