{"id":3625,"date":"2025-04-29T12:22:55","date_gmt":"2025-04-29T12:22:55","guid":{"rendered":"https:\/\/ordervize.com\/demo\/"},"modified":"2026-06-11T13:33:48","modified_gmt":"2026-06-11T13:33:48","slug":"demo","status":"publish","type":"page","link":"https:\/\/ordervize.com\/en\/demo\/","title":{"rendered":"DEMO"},"content":{"rendered":"\n<style>\n\/* ============================================================================\n   OrderVize site design system  (.ovz)\n   ----------------------------------------------------------------------------\n   Theming model \u2014 the site loads LIGHT by default (body.color-switch-light)\n   and the Kadence color toggle swaps it to body.color-switch-dark.\n   So: LIGHT tokens are the default on .ovz; DARK tokens are an explicit\n   override under `body.color-switch-dark .ovz`. Every component reads the\n   CSS variables, so both themes are correct by construction.\n\n   Integration: paste this whole file ONCE into\n   WP Admin \u2192 Appearance \u2192 Customize \u2192 Additional CSS.\n   Then every page block (which uses .ovz-* classes) themes automatically.\n   (Each page block can also inline this if you prefer fully standalone blocks.)\n   ============================================================================ *\/\n\n.ovz {\n  \/* brand *\/\n  --ovz-brand-1: #16094b;\n  --ovz-brand-2: #14246d;\n  --ovz-accent:  #0d6efd;\n  --ovz-accent-2:#00a8ff;\n  --ovz-gold:    #f4b740;\n  --ovz-gold-deep:#b9821a;\n\n  \/* LIGHT theme (default \u2014 site loads light) *\/\n  --ovz-page:\n    radial-gradient(circle at 12% 0%, rgba(0,168,255,0.14), transparent 38%),\n    radial-gradient(circle at 90% 8%, rgba(13,110,253,0.10), transparent 42%),\n    linear-gradient(135deg, #f7faff 0%, #eef4ff 55%, #ffffff 100%);\n  --ovz-hero:\n    radial-gradient(circle at 80% 20%, rgba(0,168,255,0.16), transparent 45%),\n    linear-gradient(135deg, #eaf1ff 0%, #f4f8ff 60%, #ffffff 100%);\n  --ovz-band:\n    radial-gradient(circle at 85% 15%, rgba(0,168,255,0.16), transparent 50%),\n    linear-gradient(135deg, #0d2a6b, #103e9e);            \/* dark feature band stays dark in both *\/\n  --ovz-heading: #0f172a;\n  --ovz-text:    #3b4763;\n  --ovz-muted:   #6b7790;\n  --ovz-surface: #ffffff;\n  --ovz-surface-2:#f3f7ff;\n  --ovz-border:  #dbe2f0;\n  --ovz-grid:    rgba(13,28,80,0.05);\n  --ovz-shadow:  0 18px 45px rgba(15,23,42,0.10);\n  --ovz-shadow-lg:0 34px 70px rgba(15,23,42,0.16);\n  --ovz-shot-chrome:#eef2fc;\n  --ovz-shot-bar:#e4ebfa;\n  --ovz-shot-url:#5a6a8c;\n  --ovz-on-accent:#ffffff;\n\n  \/* layout *\/\n  width: 100vw !important;\n  margin-left: calc(50% - 50vw) !important;\n  margin-right: calc(50% - 50vw) !important;\n  overflow-x: hidden !important;\n  font-family: Arial, Helvetica, sans-serif !important;\n  font-size: 16px;\n  line-height: 1.6;\n  background: var(--ovz-page) !important;\n  color: var(--ovz-text) !important;\n}\n\n\/* DARK theme overrides *\/\nbody.color-switch-dark .ovz,\nbody.kadence-light-mode .ovz.is-dark-preview \/* preview helper, harmless live *\/ {\n  --ovz-page:\n    radial-gradient(circle at 12% 0%, rgba(0,168,255,0.22), transparent 35%),\n    linear-gradient(135deg, #16094b 0%, #14246d 52%, #070b18 100%);\n  --ovz-hero:\n    radial-gradient(circle at 80% 18%, rgba(0,168,255,0.22), transparent 45%),\n    linear-gradient(135deg, #16094b 0%, #14246d 55%, #0a1230 100%);\n  --ovz-band:\n    radial-gradient(circle at 85% 15%, rgba(0,168,255,0.20), transparent 50%),\n    linear-gradient(135deg, #0b1330, #131a3f);\n  --ovz-heading: #ffffff;\n  --ovz-text:    #e7edff;\n  --ovz-muted:   #b3c1e4;\n  --ovz-surface: rgba(255,255,255,0.075);\n  --ovz-surface-2: rgba(255,255,255,0.05);\n  --ovz-border:  rgba(255,255,255,0.18);\n  --ovz-grid:    rgba(255,255,255,0.04);\n  --ovz-shadow:  0 24px 60px rgba(0,0,0,0.28);\n  --ovz-shadow-lg:0 40px 80px rgba(0,0,0,0.45);\n  --ovz-shot-chrome:#11162b;\n  --ovz-shot-bar:#171d36;\n  --ovz-shot-url:#aab6d6;\n}\n\n.ovz * { box-sizing: border-box; }\n.ovz h1,.ovz h2,.ovz h3,.ovz h4,.ovz p,.ovz li,.ovz a,.ovz span,.ovz div,.ovz summary,.ovz label,.ovz input,.ovz select,.ovz textarea,.ovz button {\n  font-family: Arial, Helvetica, sans-serif !important;\n}\n\n\/* ---------- layout helpers ---------- *\/\n.ovz-container { width: min(1180px, 92%) !important; margin: 0 auto !important; }\n.ovz-section { padding: 64px 0 !important; position: relative; }\n.ovz-section.tight { padding: 44px 0 !important; }\n\n\/* a section that is always dark (feature band \/ moat) regardless of theme *\/\n.ovz-darkband { background: var(--ovz-band) !important; --ovz-heading:#fff; --ovz-text:#e7edff; --ovz-muted:#b3c1e4; --ovz-surface:rgba(255,255,255,0.09); --ovz-border:rgba(255,255,255,0.2); }\n\/* a section that uses the soft surface tint *\/\n.ovz-tint { background: var(--ovz-surface-2) !important; }\n\n\/* ---------- titles ---------- *\/\n.ovz-title { max-width: 900px; margin: 0 0 42px 0 !important; }\n.ovz-title.center { text-align: center; margin-left:auto !important; margin-right:auto !important; }\n.ovz-eyebrow { display:block; color: var(--ovz-accent-2) !important; text-transform:uppercase; letter-spacing:1.5px; font-weight:900; font-size:14px; margin-bottom:12px; }\n.ovz-darkband .ovz-eyebrow { color:#7fd4ff !important; }\n.ovz-title h2 { color: var(--ovz-heading) !important; font-size: clamp(30px,3.4vw,48px); line-height:1.1 !important; font-weight:900; margin:0 0 16px 0 !important; }\n.ovz-title p { color: var(--ovz-text) !important; font-size:18px; line-height:1.72; margin:0 !important; }\n\n\/* ---------- buttons ---------- *\/\n.ovz-btns { display:flex; flex-wrap:wrap; gap:14px; align-items:center; }\n.ovz-btn {\n  display:inline-flex !important; align-items:center; justify-content:center;\n  min-height:52px; padding:15px 26px; border-radius:12px; text-decoration:none !important;\n  font-size:15px; font-weight:900; line-height:1.2; text-align:center; transition:.25s ease; cursor:pointer; border:0;\n}\n.ovz-btn-primary { background: linear-gradient(135deg, var(--ovz-accent), var(--ovz-accent-2)) !important; color:#fff !important; box-shadow:0 15px 35px rgba(0,168,255,0.28); }\n.ovz-btn-secondary { background: var(--ovz-surface) !important; border:1px solid var(--ovz-border) !important; color: var(--ovz-heading) !important; }\n.ovz-btn-gold { background: linear-gradient(135deg, var(--ovz-gold), var(--ovz-gold-deep)) !important; color:#2a1c00 !important; box-shadow:0 15px 35px rgba(244,183,64,0.25); }\n.ovz-btn:hover { transform: translateY(-3px); }\n\n\/* ---------- hero ---------- *\/\n.ovz-hero { background: var(--ovz-hero) !important; padding: 80px 0 66px !important; overflow:hidden; }\n.ovz-hero::before { content:\"\"; position:absolute; inset:0; pointer-events:none;\n  background-image: linear-gradient(var(--ovz-grid) 1px,transparent 1px), linear-gradient(90deg,var(--ovz-grid) 1px,transparent 1px);\n  background-size:92px 92px; }\n.ovz-hero-grid { position:relative; z-index:2; display:grid; grid-template-columns:1.05fr .95fr; gap:46px; align-items:center; }\n.ovz-badge { display:inline-flex !important; align-items:center; gap:8px; padding:9px 18px; border-radius:999px;\n  background: var(--ovz-surface) !important; border:1px solid var(--ovz-border) !important; color: var(--ovz-heading) !important;\n  font-size:14px; font-weight:800; margin:0 0 24px 0 !important; box-shadow: var(--ovz-shadow); }\n.ovz-hero h1 { color: var(--ovz-heading) !important; font-size: clamp(38px,5vw,62px); line-height:1.05 !important; letter-spacing:-1.4px;\n  font-weight:900; text-transform:uppercase; margin:0 0 22px 0 !important; }\n.ovz-hero h1 .hl { color: var(--ovz-accent-2) !important; }\n.ovz-hero p.lead { color: var(--ovz-text) !important; font-size:18.5px; line-height:1.62; max-width:600px; margin:0 0 26px 0 !important; }\n\n\/* trust strip *\/\n.ovz-trust { display:flex; flex-wrap:wrap; gap:10px 22px; margin-top:26px; }\n.ovz-trust span { display:inline-flex; align-items:center; gap:8px; color: var(--ovz-muted) !important; font-size:14px; font-weight:700; }\n.ovz-trust span::before { content:\"\"; width:7px; height:7px; border-radius:50%; background: var(--ovz-accent-2); flex:0 0 auto; }\n\n\/* ---------- screenshot frame ---------- *\/\n.ovz-shot { border-radius:16px; overflow:hidden; border:1px solid var(--ovz-border); box-shadow: var(--ovz-shadow-lg); background: var(--ovz-shot-chrome); }\n.ovz-shot-bar { display:flex; align-items:center; gap:8px; padding:11px 14px; background: var(--ovz-shot-bar); border-bottom:1px solid var(--ovz-border); }\n.ovz-dot { width:11px; height:11px; border-radius:50%; flex:0 0 auto; }\n.ovz-dot.r{background:#ff5f57;} .ovz-dot.y{background:#febc2e;} .ovz-dot.g{background:#28c840;}\n.ovz-shot-url { margin-left:10px; flex:1; background: rgba(127,127,127,0.14); color: var(--ovz-shot-url) !important; font-size:12px; font-weight:700; padding:6px 12px; border-radius:7px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }\n.ovz-shot img { display:block; width:100%; height:auto; }\n.ovz-shot-cap { text-align:center; color: var(--ovz-muted) !important; font-size:12.5px; font-weight:700; margin:12px 0 0 0 !important; }\n\n\/* ---------- grids & cards ---------- *\/\n.ovz-grid { display:grid; gap:24px; }\n.ovz-grid-2 { grid-template-columns:repeat(2,1fr); }\n.ovz-grid-3 { grid-template-columns:repeat(3,1fr); }\n.ovz-grid-4 { grid-template-columns:repeat(4,1fr); }\n.ovz-card { background: var(--ovz-surface) !important; border:1px solid var(--ovz-border) !important; border-radius:20px; padding:30px; box-shadow: var(--ovz-shadow); }\n.ovz-card h3 { color: var(--ovz-heading) !important; font-size:23px; font-weight:900; line-height:1.2; margin:0 0 14px 0 !important; }\n.ovz-card p { color: var(--ovz-text) !important; font-size:16.5px; line-height:1.72; margin:0 !important; }\n\n.ovz-icon { width:52px; height:52px; border-radius:15px; background:linear-gradient(135deg,var(--ovz-accent),var(--ovz-accent-2)) !important;\n  display:flex; align-items:center; justify-content:center; margin-bottom:20px; }\n.ovz-icon svg { width:26px; height:26px; stroke:#fff; fill:none; stroke-width:2; }\n\n\/* bullet list *\/\n.ovz-list { list-style:none !important; padding:0 !important; margin:20px 0 0 0 !important; }\n.ovz-list li { position:relative; padding-left:28px; color: var(--ovz-text) !important; line-height:1.6; margin-bottom:10px; font-size:16px; }\n.ovz-list li::before { content:\"\"; position:absolute; left:0; top:.55em; width:8px; height:8px; border-radius:50%; background: var(--ovz-accent-2); }\n\n\/* ---------- audience lanes ---------- *\/\n.ovz-lanes { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }\n.ovz-lane { display:flex; flex-direction:column; border-radius:20px; padding:32px; background: var(--ovz-surface) !important; border:1px solid var(--ovz-border) !important; box-shadow: var(--ovz-shadow); }\n.ovz-lane.supplier { border-top:4px solid var(--ovz-accent-2) !important; }\n.ovz-lane.distributor { border-top:4px solid var(--ovz-gold) !important; }\n.ovz-tag { display:inline-block; width:fit-content; font-size:12.5px; font-weight:900; letter-spacing:1px; text-transform:uppercase; padding:6px 12px; border-radius:999px; margin-bottom:16px; }\n.ovz-lane.supplier .ovz-tag { background: rgba(0,168,255,0.16) !important; color:#0e7fc0 !important; }\n.ovz-lane.distributor .ovz-tag { background: rgba(244,183,64,0.20) !important; color: var(--ovz-gold-deep) !important; }\nbody.color-switch-dark .ovz-lane.supplier .ovz-tag { color:#8fd6ff !important; }\nbody.color-switch-dark .ovz-lane.distributor .ovz-tag { color: var(--ovz-gold) !important; }\n.ovz-lane h3 { color: var(--ovz-heading) !important; font-size:24px; font-weight:900; margin:0 0 12px 0 !important; }\n.ovz-lane p { color: var(--ovz-text) !important; font-size:16.5px; line-height:1.7; margin:0 0 18px 0 !important; }\n.ovz-lane .ovz-list { margin-top:0 !important; margin-bottom:22px !important; flex:1; }\n.ovz-lane.distributor .ovz-list li::before { background: var(--ovz-gold); }\n.ovz-lane .ovz-btn { width:100%; margin-top:auto; }\n\n\/* ---------- moat \/ split callout ---------- *\/\n.ovz-split { display:grid; grid-template-columns:78px 1fr; gap:26px; align-items:center; }\n.ovz-split-icon { width:78px; height:78px; border-radius:20px; background:rgba(0,168,255,0.14); border:1px solid rgba(0,168,255,0.4); display:flex; align-items:center; justify-content:center; }\n.ovz-split-icon svg { width:38px; height:38px; stroke: var(--ovz-accent-2); fill:none; stroke-width:2; }\n.ovz-split h2 { color: var(--ovz-heading) !important; font-size:clamp(26px,3vw,38px); font-weight:900; line-height:1.15; margin:0 0 12px 0 !important; }\n.ovz-split p { color: var(--ovz-text) !important; font-size:17.5px; line-height:1.7; margin:0 !important; max-width:820px; }\n\n\/* ---------- feature rows ---------- *\/\n.ovz-feature { display:grid; grid-template-columns:1fr 1.15fr; gap:46px; align-items:center; margin-bottom:56px; }\n.ovz-feature:last-child { margin-bottom:0; }\n.ovz-feature.reverse .ovz-feature-text { order:2; }\n.ovz-feature.reverse .ovz-feature-shot { order:1; }\n.ovz-feature-text h3 { color: var(--ovz-heading) !important; font-size:27px; font-weight:900; line-height:1.2; margin:16px 0 14px 0 !important; }\n.ovz-feature-text p { color: var(--ovz-text) !important; font-size:17px; line-height:1.7; margin:0 !important; }\n\n\/* ---------- steps ---------- *\/\n.ovz-step { background: var(--ovz-surface) !important; border:1px solid var(--ovz-border) !important; border-radius:20px; padding:28px; box-shadow: var(--ovz-shadow); }\n.ovz-step-n { width:44px; height:44px; border-radius:13px; background:linear-gradient(135deg,var(--ovz-accent),var(--ovz-accent-2)) !important; color:#fff !important; display:flex; align-items:center; justify-content:center; font-weight:900; font-size:18px; margin-bottom:18px; }\n.ovz-step h3 { color: var(--ovz-heading) !important; font-size:21px; font-weight:900; margin:0 0 12px 0 !important; }\n.ovz-step p { color: var(--ovz-text) !important; font-size:16px; line-height:1.7; margin:0 !important; }\n\n\/* note box *\/\n.ovz-note { margin-top:28px; background: rgba(0,168,255,0.10) !important; border:1px solid rgba(0,168,255,0.32) !important; border-radius:20px; padding:26px; }\n.ovz-note h3 { color: var(--ovz-heading) !important; font-size:22px; font-weight:900; margin:0 0 10px 0 !important; }\n.ovz-note p { color: var(--ovz-text) !important; font-size:16.5px; line-height:1.72; margin:0 !important; }\n\n\/* ---------- pricing ---------- *\/\n.ovz-pricing { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:stretch !important; }\n.ovz-price { position:relative; display:flex !important; flex-direction:column !important; background: var(--ovz-surface) !important; border:1px solid var(--ovz-border) !important; border-radius:20px; padding:32px; box-shadow: var(--ovz-shadow); }\n.ovz-price.featured { border:2px solid var(--ovz-accent) !important; }\n.ovz-price-flag { position:absolute; top:-15px; right:24px; background: var(--ovz-brand-1) !important; color:#fff !important; padding:8px 14px; border-radius:999px; font-size:12px; font-weight:900; }\n.ovz-price-pkg { color: var(--ovz-accent) !important; font-size:13px; font-weight:900; letter-spacing:1px; text-transform:uppercase; margin-bottom:10px; min-height:34px; }\n.ovz-price h3 { color: var(--ovz-heading) !important; font-size:24px; font-weight:900; line-height:1.25; margin:0 0 12px 0 !important; min-height:60px; }\n.ovz-price-desc { color: var(--ovz-muted) !important; line-height:1.6; min-height:112px; margin:0 !important; font-size:15.5px; }\n.ovz-price-amt { color: var(--ovz-heading) !important; font-size:38px; line-height:1; font-weight:900; margin:20px 0 16px 0; display:flex; align-items:flex-end; gap:10px; }\n.ovz-price-amt span { color: var(--ovz-muted) !important; font-size:16px; font-weight:800; padding-bottom:5px; }\n.ovz-price .ovz-list { margin:0 0 26px 0 !important; }\n.ovz-price .ovz-btn { width:100% !important; margin-top:auto !important; }\n.ovz-trial { text-align:center; margin:28px auto 0 auto; max-width:760px; color: var(--ovz-text) !important; font-size:16px; line-height:1.6; }\n\n\/* conditions box inside a pricing card \u2014 bottom-aligned across columns *\/\n.ovz-price-cond { margin:auto 0 18px 0; min-height:104px; padding:16px; border-radius:14px; background: var(--ovz-surface-2) !important; border:1px solid var(--ovz-border) !important; }\n.ovz-price-cond strong { display:block; color: var(--ovz-heading) !important; font-size:14px; font-weight:900; margin-bottom:6px; }\n.ovz-price-cond p { color: var(--ovz-muted) !important; font-size:14px; line-height:1.5; margin:0 !important; }\n\n\/* founder \/ team photo *\/\n.ovz-photo { width:100%; aspect-ratio:16 \/ 11; object-fit:cover; border-radius:14px; margin-bottom:18px; display:block; border:1px solid var(--ovz-border); }\n\n\/* distributor band *\/\n.ovz-distband { margin-top:34px; border-radius:20px; padding:34px; display:grid; grid-template-columns:1fr auto; gap:26px; align-items:center;\n  background: linear-gradient(135deg, rgba(244,183,64,0.12), rgba(185,130,26,0.08)) !important; border:1px solid rgba(244,183,64,0.42) !important; }\n.ovz-distband .ovz-tag { background: rgba(244,183,64,0.20) !important; color: var(--ovz-gold-deep) !important; }\nbody.color-switch-dark .ovz-distband .ovz-tag { color: var(--ovz-gold) !important; }\n.ovz-distband h3 { color: var(--ovz-heading) !important; font-size:24px; font-weight:900; margin:0 0 10px 0 !important; }\n.ovz-distband p { color: var(--ovz-text) !important; font-size:16.5px; line-height:1.65; margin:0 !important; max-width:640px; }\n.ovz-distband .ovz-btn { white-space:nowrap; }\n\n\/* ---------- FAQ ---------- *\/\n.ovz-faq { background: var(--ovz-surface) !important; border:1px solid var(--ovz-border) !important; border-radius:16px; padding:4px 26px; margin-bottom:14px; box-shadow: var(--ovz-shadow); }\n.ovz-faq summary { cursor:pointer; list-style:none; color: var(--ovz-heading) !important; font-size:18px; font-weight:800; padding:22px 0; display:flex; justify-content:space-between; align-items:center; gap:16px; }\n.ovz-faq summary::-webkit-details-marker { display:none; }\n.ovz-faq summary::after { content:\"+\"; font-size:26px; font-weight:700; color: var(--ovz-accent-2); flex:0 0 auto; }\n.ovz-faq[open] summary::after { content:\"\\2212\"; }\n.ovz-faq p { color: var(--ovz-text) !important; font-size:16px; line-height:1.72; margin:0 0 22px 0 !important; }\n\n\/* ---------- form ---------- *\/\n.ovz-form { max-width:720px; margin:0 auto; background: var(--ovz-surface) !important; border:1px solid var(--ovz-border) !important; border-radius:20px; padding:30px; text-align:left; box-shadow: var(--ovz-shadow); }\n.ovz-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }\n.ovz-field { display:flex; flex-direction:column; }\n.ovz-field.full { grid-column:1 \/ -1; }\n.ovz-field label { color: var(--ovz-muted) !important; font-size:13px; font-weight:800; text-transform:uppercase; letter-spacing:.5px; margin-bottom:7px; }\n.ovz-field input, .ovz-field select, .ovz-field textarea { width:100%; background:#fff !important; border:1px solid #cdd6ea !important; border-radius:10px; padding:13px 14px; font-size:15px; color:#111827 !important; }\n.ovz-field textarea { min-height:96px; resize:vertical; }\n.ovz-form .ovz-btn { width:100%; margin-top:18px; }\n.ovz-form-hint { color: var(--ovz-muted) !important; font-size:13px; text-align:center; margin:14px 0 0 0 !important; }\n\n\/* ---------- prose (legal pages) ---------- *\/\n.ovz-prose { max-width:880px; margin:0 auto; }\n.ovz-prose h2 { color: var(--ovz-heading) !important; font-size:26px; font-weight:900; margin:34px 0 14px 0 !important; }\n.ovz-prose h3 { color: var(--ovz-heading) !important; font-size:20px; font-weight:800; margin:26px 0 10px 0 !important; }\n.ovz-prose p, .ovz-prose li { color: var(--ovz-text) !important; font-size:16.5px; line-height:1.78; }\n.ovz-prose a { color: var(--ovz-accent) !important; }\n.ovz-prose ul, .ovz-prose ol { padding-left:22px; margin:0 0 16px 0; }\n.ovz-prose li { margin-bottom:8px; }\n.ovz-prose .ovz-card { padding:32px 34px; }\n\n\/* ---------- CTA ---------- *\/\n.ovz-cta { text-align:center; background: var(--ovz-band) !important; --ovz-heading:#fff; --ovz-text:#e7edff; }\n.ovz-cta h2 { color:#fff !important; font-size:clamp(30px,3.4vw,48px); font-weight:900; line-height:1.1; margin:0 0 18px 0 !important; }\n.ovz-cta > .ovz-container > p { color:#e7edff !important; max-width:720px; margin:0 auto 34px auto !important; font-size:18px; line-height:1.72; }\n\/* secondary button sits on the always-dark CTA band -> glassy white outline in both themes\n   (default .ovz-btn-secondary uses --ovz-surface, which is white in light mode = invisible) *\/\n.ovz-cta .ovz-btn-secondary { background: rgba(255,255,255,0.12) !important; border:1px solid rgba(255,255,255,0.42) !important; color:#fff !important; }\n.ovz-cta .ovz-btn-secondary:hover { background: rgba(255,255,255,0.22) !important; }\n\n\/* ---------- footer (always dark, brand) ---------- *\/\n.ovz-footer { background: linear-gradient(135deg,#16094b 0%,#14246d 55%,#0b1330 100%) !important; padding:58px 0 26px !important; }\n.ovz-footer .ovz-container { font-size:16px; }\n.ovz-footer-grid { display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:38px; align-items:start; max-width:1160px; margin:0 auto; }\n.ovz-footer-brand .ovz-footer-name { color:#fff !important; font-size:22px; font-weight:900; letter-spacing:-.4px; margin:0 0 12px; display:flex; align-items:center; gap:9px; }\n.ovz-footer-brand .ovz-footer-name span { color: var(--ovz-accent-2) !important; }\n.ovz-footer-tag { color:#aab8dd !important; font-size:15px; line-height:1.65; margin:0 0 18px; max-width:330px; }\n.ovz-footer h4 { color:#fff !important; font-size:13px; font-weight:900; text-transform:uppercase; letter-spacing:1.2px; margin:0 0 16px !important; }\n.ovz-footer a.ovz-footer-link { color:#b3c1e4 !important; text-decoration:none !important; display:block; margin-bottom:11px; font-size:15px; }\n.ovz-footer a.ovz-footer-link:hover { color:#fff !important; }\n.ovz-footer-social { display:flex; gap:11px; }\n.ovz-footer-social a { width:40px; height:40px; border-radius:11px; background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.14); display:flex; align-items:center; justify-content:center; }\n.ovz-footer-social a:hover { background:rgba(0,168,255,0.25); border-color: var(--ovz-accent-2); }\n.ovz-footer-social svg { width:18px; height:18px; fill:#cfe; }\n.ovz-footer-bottom { border-top:1px solid rgba(255,255,255,0.12); margin-top:42px; padding-top:22px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; }\n.ovz-footer-bottom p { color:#8fa0c8 !important; font-size:14px; margin:0 !important; }\n.ovz-footer-legal { display:flex; flex-wrap:wrap; gap:6px 20px; }\n.ovz-footer-legal a { color:#8fa0c8 !important; text-decoration:none !important; font-size:14px; }\n.ovz-footer-legal a:hover { color:#fff !important; }\n\n\/* ---------- responsive ---------- *\/\n@media (max-width:900px){\n  .ovz-footer-grid { grid-template-columns:1fr 1fr; gap:28px; }\n  .ovz-footer-brand { grid-column:1 \/ -1; }\n  .ovz-footer-bottom { flex-direction:column; align-items:flex-start; }\n}\n@media (max-width:1024px){\n  .ovz-hero-grid { grid-template-columns:1fr; gap:36px; }\n  .ovz-hero p.lead { max-width:none; }\n}\n@media (max-width:900px){\n  .ovz-grid-2,.ovz-grid-3,.ovz-grid-4,.ovz-lanes,.ovz-pricing { grid-template-columns:1fr; }\n  .ovz-feature,.ovz-feature.reverse { grid-template-columns:1fr; gap:24px; }\n  .ovz-feature.reverse .ovz-feature-text,.ovz-feature.reverse .ovz-feature-shot { order:0; }\n  .ovz-split { grid-template-columns:1fr; text-align:center; }\n  .ovz-split-icon { margin:0 auto; }\n  .ovz-distband { grid-template-columns:1fr; text-align:center; }\n  .ovz-distband .ovz-tag { margin:0 auto 14px auto; }\n  .ovz-form-grid { grid-template-columns:1fr; }\n  .ovz-section { padding:50px 0 !important; }\n  .ovz-hero { padding:54px 0 !important; }\n  .ovz-hero h1 { font-size:36px; letter-spacing:-.8px; }\n}\n\n\/* ===== Embedded Kadence Advanced Form (form id 2773) =====\n   The form ships its own \"kb-form-is-dark\" styling (light labels\/inputs), so we frame the\n   block as a continuation of the dark .ovz-cta band above it: full-bleed dark background,\n   inner form constrained and centered. Applies on Demo \/ Home \/ Contact (all reuse form 2773). *\/\n.wp-block-kadence-advanced-form2773-cpt-id {\n  background: linear-gradient(135deg, #0d2a6b, #103e9e);\n  padding: 4px 20px 64px;\n}\n.wp-block-kadence-advanced-form2773-cpt-id .kb-form,\n.wp-block-kadence-advanced-form2773-cpt-id form.kb-advanced-form {\n  max-width: 620px;\n  margin: 0 auto;\n}\n.wp-block-kadence-advanced-form2773-cpt-id .kadence-blocks-form-field { margin-bottom: 16px; }\n\n<\/style>\n<!-- ============================================================================\n     OrderVize \u2014 DEMO.  Paste into the Demo page (HTML block).\n     Replace the static form with the existing Kadence Advanced Form block.\n     ============================================================================ -->\n<div class=\"ovz\">\n\n  <section class=\"ovz-hero\">\n    <div class=\"ovz-container\">\n      <div class=\"ovz-hero-grid\">\n        <div>\n          <div class=\"ovz-badge\">100% free demo<\/div>\n          <h1>See your wines <span class=\"hl\">in the market<\/span> &mdash; live.<\/h1>\n          <p class=\"lead\">Book a free, no-pressure demo. We&#8217;ll show you exactly how Ordervize structures your catalog, benchmarks your prices against the anonymized market, and opens your B2B and B2C channels &mdash; using examples close to your own range.<\/p>\n          <div class=\"ovz-btns\">\n            <a href=\"#demo-form\" class=\"ovz-btn ovz-btn-primary\">Book a demo<\/a>\n            <a href=\"\/en\/\" class=\"ovz-btn ovz-btn-secondary\">Explore the platform<\/a>\n          <\/div>\n          <div class=\"ovz-trust\"><span>30 minutes<\/span><span>No commitment<\/span><span>6 months free after<\/span><\/div>\n        <\/div>\n        <div>\n          <div class=\"ovz-shot\">\n            <div class=\"ovz-shot-bar\"><span class=\"ovz-dot r\"><\/span><span class=\"ovz-dot y\"><\/span><span class=\"ovz-dot g\"><\/span><span class=\"ovz-shot-url\">portal.ordervize.com \/ price-intelligence<\/span><\/div>\n            <img decoding=\"async\" src=\"https:\/\/ordervize.com\/wp-content\/uploads\/2026\/06\/price-intelligence.png\" alt=\"Price intelligence preview\" loading=\"lazy\" \/>\n          <\/div>\n          <p class=\"ovz-shot-cap\">What we&#8217;ll walk you through &mdash; sample data<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"ovz-section ovz-tint\">\n    <div class=\"ovz-container\">\n      <div class=\"ovz-title center\"><span class=\"ovz-eyebrow\">What you&#8217;ll see<\/span><h2>A 30-minute tour of what matters to you<\/h2><\/div>\n      <div class=\"ovz-grid ovz-grid-3\">\n        <div class=\"ovz-card\"><div class=\"ovz-icon\"><svg viewBox=\"0 0 24 24\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M4 20V4M4 20h16\"\/><path d=\"M7 15l4-4 3 3 5-6\"\/><\/svg><\/div><h3>Your prices vs. the market<\/h3><p>How your references compare to anonymized market prices by appellation and vintage &mdash; and where you&#8217;re leaving margin on the table.<\/p><\/div>\n        <div class=\"ovz-card\"><div class=\"ovz-icon\"><svg viewBox=\"0 0 24 24\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 8l-9-5-9 5 9 5 9-5z\"\/><path d=\"M3 8v8l9 5 9-5V8\"\/><\/svg><\/div><h3>Stock &amp; exclusivity<\/h3><p>Your share of total market stock and where you hold pricing power on scarce references.<\/p><\/div>\n        <div class=\"ovz-card\"><div class=\"ovz-icon\"><svg viewBox=\"0 0 24 24\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M3 9l1-4h16l1 4\"\/><path d=\"M4 9v10a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1V9\"\/><\/svg><\/div><h3>Your sales channels<\/h3><p>How your catalog reaches Wine Torres Pro (B2B) and Selection Sommelier (B2C), and how feeds are generated.<\/p><\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section id=\"demo-form\" class=\"ovz-section ovz-cta\" style=\"padding-bottom:8px;\">\n    <div class=\"ovz-container\">\n      <h2>Book your free demo<\/h2>\n      <p style=\"margin-bottom:6px !important;\">Tell us a little about your business and we&#8217;ll schedule a time that works. No commitment &mdash; and 6 months free if you join. Prefer email? info@ordervize.com<\/p>\n    <\/div>\n  <\/section>\n  <!-- The native Kadence Advanced Form (id 2773) is appended after this block at push time;\n       the .wp-block-kadence-advanced-form2773-cpt-id rules in the design system frame it as\n       a continuation of this dark CTA band. -->\n\n<\/div>\n\n<!-- ============================================================================\n     OrderVize \u2014 motion engine (SHOWCASE build).\n     Modular effects, each guarded by target presence + reduced-motion + theme.\n     Appended to every .ovz page at build\/push (single source of truth).\n\n     >>> WordPress wptexturize GOTCHA <<<\n     This inline JS must NOT contain a bare double-ampersand AND operator, nor\n     \"--\", nor \"...\". wptexturize encodes a bare ampersand to a numeric entity on\n     render, which is a SyntaxError inside <script>. Use ?: \/ nested-if \/ the\n     \"||\" OR operator, and \"i += 1\" instead of \"i--\".\n\n     EFFECTS (toggle by deleting a block):\n       1 reveals            \u2014 scroll fade\/slide for cards, features, steps\u2026\n       2 heroEntrance+split \u2014 hero copy reveal, headline word-by-word\n       3 scrollProgress     \u2014 top progress bar + hero \"scroll\" nudge\n       4 tiltMagnetic       \u2014 card tilt toward cursor + magnetic CTA buttons\n       5 priceMicro         \u2014 animated \"best price\" badge on the hero screenshot\n       6 heroNetwork  (3D)  \u2014 particle-network hero background\n       9 dataFlowPipeline   \u2014 connector + step-by-step lighting of the 1-2-3-4\n     ============================================================================ -->\n<script data-no-optimize=\"1\" data-no-defer=\"1\" data-no-minify=\"1\" data-cfasync=\"false\">\n(function () {\n  \"use strict\";\n  if (window.__ovzAnim) return;\n  window.__ovzAnim = true;\n\n  var REDUCED = window.matchMedia ? window.matchMedia(\"(prefers-reduced-motion: reduce)\").matches : false;\n  var DESKTOP = window.innerWidth > 900;\n  function qs(s, c) { return (c || document).querySelector(s); }\n  function qsa(s, c) { return Array.prototype.slice.call((c || document).querySelectorAll(s)); }\n  function isDark() { return document.body.classList.contains(\"color-switch-dark\"); }\n  function onThemeChange(cb) {\n    new MutationObserver(cb).observe(document.body, { attributes: true, attributeFilter: [\"class\"] });\n  }\n  function loadScript(src) {\n    return new Promise(function (res, rej) {\n      var s = document.createElement(\"script\");\n      s.src = src; s.async = true; s.onload = res; s.onerror = rej;\n      s.setAttribute(\"data-no-optimize\", \"1\");\n      s.setAttribute(\"data-no-defer\", \"1\");\n      s.setAttribute(\"data-cfasync\", \"false\");\n      document.head.appendChild(s);\n    });\n  }\n  \/\/ place a full-bleed canvas behind a host's content; returns renderer bits\n  function mountCanvas(host) {\n    if (getComputedStyle(host).position === \"static\") host.style.position = \"relative\";\n    qsa(\":scope > .ovz-container\", host).forEach(function (c) { c.style.position = \"relative\"; c.style.zIndex = \"1\"; });\n    var canvas = document.createElement(\"canvas\");\n    canvas.setAttribute(\"aria-hidden\", \"true\");\n    canvas.style.cssText = \"position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;\";\n    host.insertBefore(canvas, host.firstChild);\n    return canvas;\n  }\n  function dataFlowSection() {\n    var step = qs(\".ovz-grid-4 .ovz-step\");   \/\/ grid-4 of steps == the data-flow section\n    return step ? step.closest(\"section\") : null;\n  }\n\n  \/* ======================================================================\n     GSAP EFFECTS\n     ====================================================================== *\/\n  function initGsap() {\n    if (!window.gsap) return;\n    var gsap = window.gsap;\n\n    reveals(gsap);\n    heroEntrance(gsap);\n    scrollProgress(gsap);\n    if (DESKTOP) tiltMagnetic(gsap);\n    priceMicro(gsap);\n    dataFlowPipeline(gsap);\n  }\n\n  \/\/ 1 \u2014 scroll reveals via a throttled getBoundingClientRect check. This is the\n  \/\/      most robust trigger across any theme\/scroller (no scroll-position math\n  \/\/      like ScrollTrigger, no observer quirks) \u2014 an element reveals the moment\n  \/\/      its top crosses into the viewport.\n  function reveals(gsap) {\n    var sel = \".ovz-title, .ovz-card, .ovz-lane, .ovz-price, .ovz-step, .ovz-distband, .ovz-note, .ovz-split, .ovz-feature\";\n    var els = qsa(sel).filter(function (el) { return !el.closest(\".ovz-hero\"); });\n    if (!els.length) return;\n    gsap.set(els, { opacity: 0, y: 24 });\n    var pending = els.slice();\n    function check() {\n      var vh = window.innerHeight;\n      for (var i = pending.length - 1; i >= 0; i--) {\n        var el = pending[i];\n        \/\/ reveal once the top has crossed the trigger line; still fires if the\n        \/\/ element was scrolled fully past (top negative) so nothing is skipped.\n        if (el.getBoundingClientRect().top < vh * 0.92) {\n          gsap.to(el, { opacity: 1, y: 0, duration: 0.6, ease: \"power2.out\" });\n          pending.splice(i, 1);\n        }\n      }\n    }\n    var ticking = false;\n    function onScroll() {\n      if (ticking) return;\n      ticking = true;\n      requestAnimationFrame(function () { check(); ticking = false; });\n    }\n    window.addEventListener(\"scroll\", onScroll, { passive: true });\n    window.addEventListener(\"resize\", onScroll, { passive: true });\n    check();\n  }\n\n  \/\/ 2 \u2014 hero entrance + headline word split\n  function splitWords(node) {\n    var out = [];\n    qsa(\":scope\", node); \/\/ noop to keep linter calm\n    Array.prototype.slice.call(node.childNodes).forEach(function (child) {\n      if (child.nodeType === 3) {\n        var frag = document.createDocumentFragment();\n        child.textContent.split(\/(\\s+)\/).forEach(function (tok) {\n          if (tok.trim().length === 0) { frag.appendChild(document.createTextNode(tok)); return; }\n          var w = document.createElement(\"span\");\n          w.textContent = tok; w.style.display = \"inline-block\"; w.style.willChange = \"transform\";\n          frag.appendChild(w); out.push(w);\n        });\n        node.replaceChild(frag, child);\n      } else if (child.nodeType === 1) {\n        child.style.display = \"inline-block\";\n        out = out.concat(splitWords(child));\n      }\n    });\n    return out;\n  }\n  function heroEntrance(gsap) {\n    var hero = qs(\".ovz-hero\");\n    if (!hero) return;\n    var h1 = qs(\"h1\", hero);\n    var words = [];\n    if (h1) { try { words = splitWords(h1); } catch (e) { words = []; } }\n    if (words.length) {\n      gsap.from(words, { opacity: 0, yPercent: 60, rotateX: -40, duration: 0.7, ease: \"power3.out\", stagger: 0.05, delay: 0.05 });\n    }\n    var rest = qsa(\".ovz-badge, h2, p, .ovz-btns, .ovz-trust, .ovz-shot\", hero).filter(function (el) { return !h1 || !h1.contains(el); });\n    if (rest.length) gsap.from(rest, { opacity: 0, y: 18, duration: 0.7, ease: \"power3.out\", stagger: 0.08, delay: words.length ? 0.25 : 0.05 });\n  }\n\n  \/\/ 3 \u2014 scroll progress bar + hero \"scroll\" nudge\n  function scrollProgress(gsap) {\n    var bar = document.createElement(\"div\");\n    bar.style.cssText = \"position:fixed;top:0;left:0;height:3px;width:100%;transform:scaleX(0);transform-origin:0 50%;z-index:99999;pointer-events:none;background:linear-gradient(90deg,#0d6efd,#00a8ff);\";\n    document.body.appendChild(bar);\n    var qt = gsap.quickTo(bar, \"scaleX\", { duration: 0.2, ease: \"power2.out\" });\n    window.addEventListener(\"scroll\", function () {\n      var h = document.documentElement;\n      var max = h.scrollHeight - h.clientHeight;\n      qt(max > 0 ? (h.scrollTop || window.scrollY) \/ max : 0);\n    }, { passive: true });\n\n    var hero = qs(\".ovz-hero\");\n    if (!hero) return;\n    var nudge = document.createElement(\"div\");\n    nudge.setAttribute(\"aria-hidden\", \"true\");\n    nudge.innerHTML = '<svg viewBox=\"0 0 24 24\" width=\"26\" height=\"26\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M6 9l6 6 6-6\"\/><\/svg>';\n    nudge.style.cssText = \"position:absolute;left:50%;bottom:18px;transform:translateX(-50%);z-index:2;color:rgba(120,135,170,.9);opacity:.7;pointer-events:none;\";\n    hero.appendChild(nudge);\n    gsap.to(nudge, { y: 8, repeat: -1, yoyo: true, duration: 0.9, ease: \"sine.inOut\" });\n    window.addEventListener(\"scroll\", function () {\n      gsap.to(nudge, { opacity: window.scrollY > 80 ? 0 : 0.7, duration: 0.3 });\n    }, { passive: true });\n  }\n\n  \/\/ 4 \u2014 card tilt + magnetic buttons (desktop)\n  function tiltMagnetic(gsap) {\n    qsa(\".ovz-card, .ovz-price, .ovz-lane\").forEach(function (card) {\n      card.style.transformStyle = \"preserve-3d\";\n      var rx = gsap.quickTo(card, \"rotateX\", { duration: 0.4, ease: \"power2.out\" });\n      var ry = gsap.quickTo(card, \"rotateY\", { duration: 0.4, ease: \"power2.out\" });\n      card.addEventListener(\"mousemove\", function (e) {\n        var r = card.getBoundingClientRect();\n        var px = (e.clientX - r.left) \/ r.width - 0.5;\n        var py = (e.clientY - r.top) \/ r.height - 0.5;\n        gsap.set(card, { transformPerspective: 900 });\n        ry(px * 6); rx(-py * 6);\n      });\n      card.addEventListener(\"mouseleave\", function () { rx(0); ry(0); });\n    });\n    qsa(\".ovz-btn-primary, .ovz-btn-gold\").forEach(function (btn) {\n      var qx = gsap.quickTo(btn, \"x\", { duration: 0.4, ease: \"power3.out\" });\n      var qy = gsap.quickTo(btn, \"y\", { duration: 0.4, ease: \"power3.out\" });\n      btn.addEventListener(\"mousemove\", function (e) {\n        var r = btn.getBoundingClientRect();\n        qx((e.clientX - r.left - r.width \/ 2) * 0.3);\n        qy((e.clientY - r.top - r.height \/ 2) * 0.4);\n      });\n      btn.addEventListener(\"mouseleave\", function () { qx(0); qy(0); });\n    });\n  }\n\n  \/\/ 5 \u2014 price-intelligence micro-motion (badge on the hero screenshot)\n  function priceMicro(gsap) {\n    var hero = qs(\".ovz-hero\");\n    if (!hero) return;\n    var shot = qs(\".ovz-shot\", hero);\n    if (!shot) return;\n    if (getComputedStyle(shot).position === \"static\") shot.style.position = \"relative\";\n    var pill = document.createElement(\"div\");\n    pill.style.cssText = \"position:absolute;top:14%;right:-10px;z-index:3;display:flex;align-items:center;gap:7px;background:#0f9d58;color:#fff;font:800 12px Arial;padding:7px 11px;border-radius:999px;box-shadow:0 10px 24px rgba(15,157,88,.35);\";\n    pill.innerHTML = '<span style=\"width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 0 0 rgba(255,255,255,.7)\"><\/span><span>Best price<\/span>';\n    shot.appendChild(pill);\n    gsap.from(pill, { opacity: 0, scale: 0.6, duration: 0.5, ease: \"back.out(2)\", delay: 1.1 });\n    gsap.to(pill, { y: -6, repeat: -1, yoyo: true, duration: 1.4, ease: \"sine.inOut\", delay: 1.1 });\n    gsap.to(pill.firstChild, { boxShadow: \"0 0 0 7px rgba(255,255,255,0)\", repeat: -1, duration: 1.4, ease: \"power1.out\" });\n  }\n\n  \/\/ 9 \u2014 data-flow: step numbers pop + glow in sequence when the section enters\n  function dataFlowPipeline(gsap) {\n    var sec = dataFlowSection();\n    if (!sec) return;\n    var nums = qsa(\".ovz-grid-4 .ovz-step-n\", sec);\n    if (nums.length < 2) return;\n    gsap.set(nums, { scale: 0.7, transformOrigin: \"center center\" });\n    var done = false;\n    function check() {\n      if (done) return;\n      var vh = window.innerHeight;\n      if (sec.getBoundingClientRect().top < vh * 0.8) {\n        done = true;\n        gsap.to(nums, { scale: 1, boxShadow: \"0 12px 28px rgba(0,168,255,.5)\", duration: 0.5, ease: \"back.out(2.2)\", stagger: 0.18 });\n      }\n    }\n    var ticking = false;\n    window.addEventListener(\"scroll\", function () { if (ticking) return; ticking = true; requestAnimationFrame(function () { check(); ticking = false; }); }, { passive: true });\n    check();\n  }\n\n  \/* ======================================================================\n     THREE.js SCENES\n     ====================================================================== *\/\n  function initThree() {\n    var hero = qs(\".ovz-hero\");\n    if (!hero) return;\n    if (qs(\".ovz-prose\")) return;   \/\/ legal\/utility pages stay calm: no particle network\n    var THREE_CDN = \"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/three.js\/r128\/three.min.js\";\n    (window.THREE ? Promise.resolve() : loadScript(THREE_CDN))\n      .then(function () { try { heroNetwork(hero); } catch (e) {} })\n      .catch(function () {});\n  }\n\n  function makeScene(host, count, build, palette) {\n    var THREE = window.THREE;\n    var canvas = mountCanvas(host);\n    var w = host.clientWidth, h = host.clientHeight || 1;\n    var renderer = new THREE.WebGLRenderer({ canvas: canvas, alpha: true, antialias: true });\n    renderer.setPixelRatio(Math.min(window.devicePixelRatio || 1, 1.5));\n    renderer.setSize(w, h, false);\n    var scene = new THREE.Scene();\n    var camera = new THREE.PerspectiveCamera(60, w \/ h, 1, 3000);\n    camera.position.z = 420;\n    var state = { THREE: THREE, host: host, canvas: canvas, renderer: renderer, scene: scene, camera: camera, w: w, h: h, running: true, raf: null };\n    build(state);\n    var rT;\n    window.addEventListener(\"resize\", function () {\n      clearTimeout(rT);\n      rT = setTimeout(function () {\n        state.w = host.clientWidth; state.h = host.clientHeight || 1;\n        camera.aspect = state.w \/ state.h; camera.updateProjectionMatrix();\n        renderer.setSize(state.w, state.h, false);\n        if (state.onResize) state.onResize();\n      }, 150);\n    });\n    if (\"IntersectionObserver\" in window) {\n      new IntersectionObserver(function (ents) {\n        ents.forEach(function (en) {\n          if (en.isIntersecting) { if (!state.running) { state.running = true; state.tick(); } }\n          else { state.running = false; if (state.raf) cancelAnimationFrame(state.raf); }\n        });\n      }, { threshold: 0 }).observe(host);\n    }\n    if (palette) onThemeChange(function () { if (state.recolor) state.recolor(); });\n    return state;\n  }\n\n  \/\/ 6 \u2014 hero connected-particle network\n  function heroNetwork(host) {\n    makeScene(host, 0, function (st) {\n      var THREE = st.THREE, w = st.w, h = st.h;\n      function pal() { return isDark() ? { node: 0x49d0ff, line: 0x2a6bd6, a: 0.55, la: 0.22 } : { node: 0x0d6efd, line: 0x6aa3ff, a: 0.5, la: 0.16 }; }\n      var p = pal();\n      var COUNT = Math.max(40, Math.min(140, Math.round((w * h) \/ 12000)));\n      if (window.innerWidth < 700) COUNT = Math.min(COUNT, 60);\n      var SX = w * 0.6, SY = h * 0.65, SZ = 200;\n      var pos = new Float32Array(COUNT * 3), vel = [];\n      for (var i = 0; i < COUNT; i++) {\n        pos[i * 3] = (Math.random() * 2 - 1) * SX; pos[i * 3 + 1] = (Math.random() * 2 - 1) * SY; pos[i * 3 + 2] = (Math.random() * 2 - 1) * SZ;\n        vel.push([(Math.random() * 2 - 1) * 0.25, (Math.random() * 2 - 1) * 0.25, (Math.random() * 2 - 1) * 0.12]);\n      }\n      var pGeo = new THREE.BufferGeometry(); pGeo.setAttribute(\"position\", new THREE.BufferAttribute(pos, 3));\n      var pMat = new THREE.PointsMaterial({ size: 3.4, color: p.node, transparent: true, opacity: p.a, sizeAttenuation: true });\n      st.scene.add(new THREE.Points(pGeo, pMat));\n      var maxL = Math.min(COUNT * 10, 2500), lp = new Float32Array(maxL * 6);\n      var lGeo = new THREE.BufferGeometry(); lGeo.setAttribute(\"position\", new THREE.BufferAttribute(lp, 3));\n      var lMat = new THREE.LineBasicMaterial({ color: p.line, transparent: true, opacity: p.la });\n      st.scene.add(new THREE.LineSegments(lGeo, lMat));\n      var DIST = Math.min(160, Math.max(95, w \/ 11)), mx = 0, my = 0;\n      host.addEventListener(\"mousemove\", function (e) { var r = host.getBoundingClientRect(); mx = (e.clientX - r.left) \/ r.width - 0.5; my = (e.clientY - r.top) \/ r.height - 0.5; });\n      st.recolor = function () { var np = pal(); pMat.color.setHex(np.node); pMat.opacity = np.a; lMat.color.setHex(np.line); lMat.opacity = np.la; };\n      st.tick = function () {\n        if (!st.running) return;\n        st.raf = requestAnimationFrame(st.tick);\n        var a = pGeo.attributes.position.array, k;\n        for (k = 0; k < COUNT; k++) {\n          a[k * 3] += vel[k][0]; a[k * 3 + 1] += vel[k][1]; a[k * 3 + 2] += vel[k][2];\n          if (a[k * 3] > SX || a[k * 3] < -SX) vel[k][0] *= -1;\n          if (a[k * 3 + 1] > SY || a[k * 3 + 1] < -SY) vel[k][1] *= -1;\n          if (a[k * 3 + 2] > SZ || a[k * 3 + 2] < -SZ) vel[k][2] *= -1;\n        }\n        pGeo.attributes.position.needsUpdate = true;\n        var n = 0, x, y;\n        for (x = 0; x < COUNT; x++) {\n          for (y = x + 1; y < COUNT; y++) {\n            var dx = a[x * 3] - a[y * 3], dy = a[x * 3 + 1] - a[y * 3 + 1], dz = a[x * 3 + 2] - a[y * 3 + 2];\n            if (n < maxL) { if ((dx * dx + dy * dy + dz * dz) < DIST * DIST) {\n              lp[n * 6] = a[x * 3]; lp[n * 6 + 1] = a[x * 3 + 1]; lp[n * 6 + 2] = a[x * 3 + 2];\n              lp[n * 6 + 3] = a[y * 3]; lp[n * 6 + 4] = a[y * 3 + 1]; lp[n * 6 + 5] = a[y * 3 + 2]; n += 1;\n            } }\n          }\n        }\n        lGeo.setDrawRange(0, n * 2); lGeo.attributes.position.needsUpdate = true;\n        st.camera.position.x += (mx * 60 - st.camera.position.x) * 0.03;\n        st.camera.position.y += (-my * 40 - st.camera.position.y) * 0.03;\n        st.camera.lookAt(st.scene.position);\n        st.renderer.render(st.scene, st.camera);\n      };\n      st.tick();\n    }, true);\n  }\n\n  \/* ======================================================================\n     BOOT\n     ====================================================================== *\/\n  function boot() {\n    if (REDUCED) return;                 \/\/ honor reduced motion: fully static\n    if (!qs(\".ovz\")) return;             \/\/ no design system on page -> do nothing\n    var GSAP = \"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.5\/gsap.min.js\";\n    (window.gsap ? Promise.resolve() : loadScript(GSAP))\n      .then(function () { try { initGsap(); } catch (e) {} try { initThree(); } catch (e) {} })\n      .catch(function () { try { initThree(); } catch (e) {} });\n  }\n  if (document.readyState === \"loading\") document.addEventListener(\"DOMContentLoaded\", boot);\n  else boot();\n})();\n<\/script>\n\n\n<style>.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=text],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=tel],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=number],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=date],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=time],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=email],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=file],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form select,.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form textarea{color:var(--global-palette9, #ffffff);border-top:0px solid transparent;border-right:0px solid transparent;border-bottom:1px solid var(--global-palette7, #EDF2F7);border-left:0px solid transparent;border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.wp-block-kadence-advanced-form2773-cpt-id{color-scheme:dark;--kb-form-text-color:var(--global-palette9, #ffffff);--kb-form-background-color:rgba(0,0,0,0);--kb-form-border-width:0px;}.wp-block-kadence-advanced-form2773-cpt-id{--kb-form-placeholder-color:var(--global-palette6, #718096);}.wp-block-kadence-advanced-form2773-cpt-id input[type=text]:focus,.wp-block-kadence-advanced-form2773-cpt-id input[type=email]:focus,.wp-block-kadence-advanced-form2773-cpt-id input[type=tel]:focus,.wp-block-kadence-advanced-form2773-cpt-id input[type=date]:focus,.wp-block-kadence-advanced-form2773-cpt-id input[type=number]:focus,.wp-block-kadence-advanced-form2773-cpt-id input[type=time]:focus,.wp-block-kadence-advanced-form2773-cpt-id input[type=file]:focus,.wp-block-kadence-advanced-form2773-cpt-id select:focus,.wp-block-kadence-advanced-form2773-cpt-id textarea:focus{border-color:var(--global-palette7, #EDF2F7);}.wp-block-kadence-advanced-form2773-cpt-id .kb-adv-form-field .kb-adv-form-label{color:var(--global-palette9, #ffffff);}@media all and (max-width: 1024px){.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=text],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=tel],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=number],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=date],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=time],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=email],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=file],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form select,.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form textarea{border-top:0px solid transparent;border-right:0px solid transparent;border-bottom:1px solid var(--global-palette7, #EDF2F7);border-left:0px solid transparent;}}@media all and (max-width: 767px){.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=text],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=tel],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=number],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=date],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=time],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=email],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form input[type=file],.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form select,.wp-block-kadence-advanced-form2773-cpt-id .kb-advanced-form textarea{border-top:0px solid transparent;border-right:0px solid transparent;border-bottom:1px solid var(--global-palette7, #EDF2F7);border-left:0px solid transparent;}}<\/style><div class=\"wp-block-kadence-advanced-form wp-block-kadence-advanced-form2773-cpt-id kb-adv-form-label-style-normal kb-adv-form-input-size-standard kb-form-basic-style kb-form-is-dark wp-block-kadence-advanced-form\"><form id=\"kb-adv-form-2773-cpt-id\" class=\"kb-advanced-form\" method=\"post\">\n<div class=\"kb-adv-form-field kb-adv-form-text-type-input kb-adv-form-infield-type-input kb-field277311263e-00 wp-block-kadence-advanced-form-email\"><label class=\"kb-adv-form-label\" for=\"field277311263e-00\">Email<span class=\"kb-adv-form-required\">*<\/span><\/label><input name=\"field11263e-00\" id=\"field277311263e-00\" data-label=\"Email\" type=\"email\" placeholder=\"\" value=\"\" data-type=\"email\" class=\"kb-field kb-email-field\" data-required=\"yes\" required aria-required=\"true\"\/><\/div>\n\n<div class=\"kb-adv-form-field kb-adv-form-text-type-input kb-adv-form-infield-type-input kb-field2773c1fe16-c8 wp-block-kadence-advanced-form-textarea\"><label class=\"kb-adv-form-label\" for=\"field2773c1fe16-c8\">Message<\/label><textarea name=\"fieldc1fe16-c8\" id=\"field2773c1fe16-c8\" rows=\"3\"  data-label=\"Message\" placeholder=\"\" data-type=\"textarea\" class=\"kb-field kb-textarea-field\" data-required=\"no\" ><\/textarea><\/div>\n\n<input type=\"hidden\" name=\"recaptcha_response\" class=\"kb_recaptcha_response kb_recaptcha_fc3142-3c\" \/>\n\n<style>ul.menu .kb-submit-field .kb-btnc6c4f4-8a.kb-button{width:initial;}.kb-submit-field.kb-fieldc6c4f4-8a{justify-content:flex-start;}<\/style><div class=\"kb-adv-form-field kb-submit-field kb-fieldc6c4f4-8a wp-block-kadence-advanced-form-submit\"><button class=\"kb-button kt-button button kb-adv-form-submit-button kb-btnc6c4f4-8a kt-btn-size-standard kt-btn-width-type-full kb-btn-global-fill kt-btn-has-text-true kt-btn-has-svg-false\" type=\"submit\"><span class=\"kt-btn-inner-text\">Submit<\/span><\/button><\/div>\n<input type=\"hidden\" name=\"_kb_adv_form_post_id\" value=\"2773\"><input type=\"hidden\" name=\"action\" value=\"kb_process_advanced_form_submit\"><input type=\"hidden\" name=\"_kb_adv_form_id\" value=\"2773-cpt-id\"><\/form><\/div>","protected":false},"excerpt":{"rendered":"<p>100% free demo See your wines in the market &mdash; live. Book a free, no-pressure demo. We&#8217;ll show you exactly how Ordervize structures your catalog, benchmarks your prices against the anonymized market, and opens your B2B and B2C channels &mdash; using examples close to your own range. Book a demo Explore the platform 30 minutesNo&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kad_blocks_custom_css":"","_kad_blocks_head_custom_js":"","_kad_blocks_body_custom_js":"","_kad_blocks_footer_custom_js":"","_kadence_starter_templates_imported_post":false,"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"footnotes":""},"class_list":["post-3625","page","type-page","status-publish","hentry"],"taxonomy_info":[],"featured_image_src_large":false,"author_info":{"display_name":"Marc Torres","author_link":"https:\/\/ordervize.com\/en\/author\/sommelier-torresgmail-com\/"},"comment_info":0,"_links":{"self":[{"href":"https:\/\/ordervize.com\/en\/wp-json\/wp\/v2\/pages\/3625","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ordervize.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ordervize.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ordervize.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ordervize.com\/en\/wp-json\/wp\/v2\/comments?post=3625"}],"version-history":[{"count":2,"href":"https:\/\/ordervize.com\/en\/wp-json\/wp\/v2\/pages\/3625\/revisions"}],"predecessor-version":[{"id":3646,"href":"https:\/\/ordervize.com\/en\/wp-json\/wp\/v2\/pages\/3625\/revisions\/3646"}],"wp:attachment":[{"href":"https:\/\/ordervize.com\/en\/wp-json\/wp\/v2\/media?parent=3625"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}