.sc-placeholder { background: color-mix(in srgb, currentcolor 8%, transparent 92%); border: 1px solid color-mix(in srgb, currentcolor, transparent); border-radius: 2px; box-sizing: border-box; overflow: hidden; } @keyframes sc-shine { 0% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } html.sc-dc-streaming .sc-placeholder, html.sc-dc-streaming .sc-interp.sc-missing { position: relative; background: color-mix(in srgb, currentcolor 5%, transparent 95%); border-color: transparent; } html.sc-dc-streaming .sc-placeholder::before, html.sc-dc-streaming .sc-interp.sc-missing::before { content: ""; position: absolute; inset: 0px; pointer-events: none; background: linear-gradient(90deg, rgba(217, 119, 87, 0) 25%, rgba(247, 225, 211, 0.95) 37%, rgba(217, 119, 87, 0) 63%) 0% 0% / 400% 100%; animation: 1.4s ease 0s infinite normal none running sc-shine; } html.sc-dc-streaming .sc-placeholder:nth-child(n+9 of .sc-placeholder)::before, html.sc-dc-streaming .sc-interp.sc-missing:nth-child(n+9 of .sc-interp.sc-missing)::before { animation: auto ease 0s 1 normal none running none; background: color-mix(in srgb, currentcolor 8%, transparent 92%); } .sc-placeholder-error { padding: 4px 8px; font: 11px / 1.4 ui-monospace, monospace; color: color-mix(in srgb, currentcolor 70%, transparent 30%); word-break: break-word; } .sc-interp.sc-missing { display: inline-block; width: 2em; height: 1em; overflow: hidden; vertical-align: text-bottom; background: rgba(255, 255, 255, 0.3); border: 1px solid rgba(0, 0, 0, 0.5); border-radius: 2px; box-sizing: border-box; color: transparent; user-select: none; } .sc-interp.sc-unresolved { font-family: ui-monospace, monospace; font-size: 0.85em; color: color-mix(in srgb, currentcolor, transparent); background: color-mix(in srgb, currentcolor 10%, transparent 90%); border-radius: 3px; padding: 0px 3px; } .sc-host.sc-has-error { position: relative; } .sc-logic-error { position: absolute; top: 8px; left: 8px; z-index: 2147483647; max-width: 60ch; padding: 6px 10px; background: rgb(176, 0, 32); color: rgb(255, 255, 255); font: 12px / 1.4 ui-monospace, monospace; border-radius: 4px; white-space: pre-wrap; pointer-events: none; } @media print { @page { margin: 0.5cm; } figure, table { break-inside: avoid; } #dc-root, #dc-root > .sc-host { height: auto; } *, ::before, ::after { print-color-adjust: exact; backdrop-filter: none !important; animation-delay: -99s !important; animation-duration: 0.001s !important; animation-iteration-count: 1 !important; animation-fill-mode: both !important; animation-play-state: running !important; transition-duration: 0s !important; } } x-dc { display: none !important; } html, body { height: 100%; margin: 0px; } #dc-root, #dc-root > .sc-host { height: 100%; } @font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 200 800; font-display: swap; src: url("/fonts/plus-jakarta-sans-normal-200-800.cb39517ad3.woff2") format("woff2"); } @font-face { font-family: "Plus Jakarta Sans"; font-style: italic; font-weight: 200 800; font-display: swap; src: url("/fonts/plus-jakarta-sans-italic-200-800.d163b8c2cf.woff2") format("woff2"); } @font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/jetbrains-mono-normal-400.27e9b32d1c.woff2") format("woff2"); } @font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/jetbrains-mono-normal-500.2186e58652.woff2") format("woff2"); } @font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/jetbrains-mono-normal-600.b4d8aa380f.woff2") format("woff2"); } @font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/jetbrains-mono-normal-700.d35e4b0cf6.woff2") format("woff2"); } @font-face { font-family: "JetBrains Mono"; font-style: italic; font-weight: 400; font-display: swap; src: url("/fonts/jetbrains-mono-italic-400.3457333e78.woff2") format("woff2"); } :root { --blue: #0274B0; --blue-deep: #0369A1; --blue-bright: #0EA5E9; --blue-soft: #38BDF8; --blue-mid: #BAE6FD; --blue-light: #E0F2FE; --blue-glow: rgba(2,132,199,0.15); --ink: #020812; --ink-2: #061428; --ink-3: #0A1E38; --border-dark: #1E3358; --white: #FFFFFF; --bg: #FAFBFC; --bg-alt: #F1F5F9; --slate: #334155; --muted: #556680; --muted-2: #5E6E85; --border: #E2E8F0; --border-2: #CBD5E1; --green: #10B981; --green-light: #D1FAE5; --green-glow: rgba(16,185,129,0.30); --amber: #F59E0B; --amber-light: #FEF3C7; --red: #EF4444; --red-light: #FEE2E2; --grad-headline: linear-gradient(135deg,var(--blue) 0%,var(--blue-bright) 50%,var(--blue-soft) 100%); --surface-page: var(--white); --surface-page-alt: var(--bg); --surface-section-alt: var(--bg-alt); --surface-card: var(--white); --text-primary: var(--ink-2); --text-secondary: var(--slate); --text-tertiary: var(--muted); --text-faint: var(--muted-2); --text-inverse: var(--white); --border-hairline: var(--border); --border-strong: var(--border-2); --action-primary: var(--blue); --action-primary-hover: var(--blue-deep); --action-focus-ring: var(--blue-glow); --emphasis: var(--blue); --link: var(--blue); --link-hover: var(--blue-deep); --status-live: var(--green); --status-warn: var(--amber); --status-error: var(--red); --dark-surface-page: var(--ink); --dark-surface-card: var(--ink-2); --dark-surface-raised: var(--ink-3); --dark-border: var(--border-dark); --dark-text-primary: var(--white); --dark-text-secondary: rgba(255,255,255,0.62); --dark-text-faint: rgba(255,255,255,0.45); --dark-emphasis: var(--blue-mid); --dark-link: var(--blue-mid); --dark-tag-blue-bg: rgba(2,132,199,0.22); --dark-tag-blue-fg: #7DD3FC; --dark-tag-green-bg: rgba(16,185,129,0.18); --dark-tag-green-fg: #6EE7B7; } :root { --font: 'Plus Jakarta Sans',system-ui,-apple-system,sans-serif; --mono: 'JetBrains Mono',ui-monospace,SFMono-Regular,'SF Mono',Menlo,Consolas,monospace; --font-sans: var(--font); --font-mono: var(--mono); --fw-light: 300; --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700; --fw-extrabold: 800; --fs-display: clamp(44px,6vw,76px); --fw-display: 800; --ls-display: -2.5px; --lh-display: 1.0; --fs-h1: 40px; --fw-h1: 800; --ls-h1: -1.2px; --lh-h1: 1.05; --fs-h2: 28px; --fw-h2: 700; --ls-h2: -0.5px; --lh-h2: 1.2; --fs-h3: 20px; --fw-h3: 700; --ls-h3: -0.3px; --lh-h3: 1.3; --fs-body-l: 18px; --lh-body-l: 1.7; --fs-body: 16px; --lh-body: 1.6; --fs-small: 14px; --fs-small-2: 13px; --fw-small: 500; --lh-small: 1.5; --fs-eyebrow: 11px; --fw-eyebrow: 600; --ls-eyebrow: 0.16em; --fs-readout: 12px; --fs-readout-sm: 11px; --fs-readout-tag: 10px; --wordmark-weight: 800; --wordmark-tracking: -0.04em; } :root { --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-7: 28px; --sp-8: 32px; --sp-10: 40px; --sp-12: 48px; --sp-14: 56px; --sp-16: 64px; --sp-20: 80px; --sp-24: 96px; --container: 1080px; --container-wide: 1200px; --gutter: 28px; --section-y: 52px; --section-y-lg: 96px; --btn-pad: 13px 26px; --btn-pad-sm: 9px 16px; --badge-pad: 6px 15px; --readout-pad: 11px 14px; --card-pad: 22px; --input-pad: 11px 14px; } :root { --r: 8px; --r-lg: 12px; --r-xl: 16px; --r-2xl: 24px; --r-pill: 40px; --r-round: 50%; --radius-button: var(--r-lg); --radius-input: var(--r); --radius-chip: var(--r); --radius-card: var(--r-xl); --radius-panel: var(--r-xl); --radius-frame: var(--r-2xl); --radius-pill: var(--r-pill); --sh-sm: 0 1px 3px rgba(0,0,0,0.06),0 1px 2px rgba(0,0,0,0.04); --sh-md: 0 4px 16px rgba(0,0,0,0.08); --sh-lg: 0 12px 40px rgba(0,0,0,0.10); --sh-xl: 0 24px 64px rgba(0,0,0,0.12); --sh-featured: 0 12px 40px rgba(2,132,199,0.14); --sh-button-hover: 0 6px 20px var(--blue-glow); --glow-green: 0 0 12px var(--green-glow); --glow-blue: 0 0 40px rgba(2,132,199,0.35); --ambient-dark: radial-gradient(ellipse 60% 50% at 70% 0%,rgba(2,132,199,0.18) 0%,transparent 70%),radial-gradient(ellipse 40% 40% at 10% 100%,rgba(16,185,129,0.10) 0%,transparent 70%); --ambient-light: radial-gradient(ellipse 70% 70% at 78% -20%,rgba(2,132,199,0.08) 0%,transparent 70%); --ease: cubic-bezier(0.2,0.6,0.2,1); --dur: 0.18s; --dur-slow: 0.3s; } :root { --t-micro: 120ms; --t-state: 200ms; --t-rewrite: 450ms; --t-enter: 600ms; --ease-standard: cubic-bezier(.2,0,0,1); --ease-exit: cubic-bezier(.4,0,1,1); --stagger: 80ms; --rise: 8px; --lift: 3px; } @media (prefers-reduced-motion: reduce) { :root { --t-state: 0ms; --t-rewrite: 0ms; --t-enter: 0ms; --stagger: 0ms; } } @keyframes hw-fade-in { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes hw-rise { 0% { opacity: 0; transform: translateY(var(--rise)); } 100% { opacity: 1; transform: none; } } body { font-family: var(--font); -webkit-font-smoothing: antialiased; line-height: 1.5; margin: 0px; } .theme-light { background: var(--white); color: var(--ink-2); } .theme-dark { background: var(--ink); color: var(--white); } em { color: var(--blue-mid); font-style: italic; font-weight: inherit; } .theme-light em { color: var(--blue); } a { color: var(--blue); text-decoration: none; } a:hover { color: var(--blue-deep); } .theme-dark a { color: var(--blue-mid); } .theme-dark a:hover { color: var(--white); } .gradient-text { background-image: ; background-position-x: ; background-position-y: ; background-size: ; background-repeat: ; background-attachment: ; background-origin: ; background-color: ; background-clip: text; -webkit-text-fill-color: transparent; } .eyebrow { font-family: var(--mono); font-size: 11px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted-2); } @keyframes hw-pulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.5; transform: scale(0.85); } } .pulse-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px var(--green-glow); animation: 1.6s ease-in-out 0s infinite normal none running hw-pulse; flex-shrink: 0; display: inline-block; } @media (prefers-reduced-motion: reduce) { .pulse-dot { animation: auto ease 0s 1 normal none running none; } } @font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 200 800; font-display: swap; src: url("/fonts/plus-jakarta-sans-normal-200-800.cb39517ad3.woff2") format("woff2"); } @font-face { font-family: "Plus Jakarta Sans"; font-style: italic; font-weight: 200 800; font-display: swap; src: url("/fonts/plus-jakarta-sans-italic-200-800.d163b8c2cf.woff2") format("woff2"); } @font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/jetbrains-mono-normal-400.27e9b32d1c.woff2") format("woff2"); } @font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/jetbrains-mono-normal-500.2186e58652.woff2") format("woff2"); } @font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/jetbrains-mono-normal-600.b4d8aa380f.woff2") format("woff2"); } @font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/jetbrains-mono-normal-700.d35e4b0cf6.woff2") format("woff2"); } @font-face { font-family: "JetBrains Mono"; font-style: italic; font-weight: 400; font-display: swap; src: url("/fonts/jetbrains-mono-italic-400.3457333e78.woff2") format("woff2"); } :root { --blue: #0274B0; --blue-deep: #0369A1; --blue-bright: #0EA5E9; --blue-soft: #38BDF8; --blue-mid: #BAE6FD; --blue-light: #E0F2FE; --blue-glow: rgba(2,132,199,0.15); --ink: #020812; --ink-2: #061428; --ink-3: #0A1E38; --border-dark: #1E3358; --white: #FFFFFF; --bg: #FAFBFC; --bg-alt: #F1F5F9; --slate: #334155; --muted: #556680; --muted-2: #5E6E85; --border: #E2E8F0; --border-2: #CBD5E1; --green: #10B981; --green-light: #D1FAE5; --green-glow: rgba(16,185,129,0.30); --amber: #F59E0B; --amber-light: #FEF3C7; --red: #EF4444; --red-light: #FEE2E2; --grad-headline: linear-gradient(135deg,var(--blue) 0%,var(--blue-bright) 50%,var(--blue-soft) 100%); --surface-page: var(--white); --surface-page-alt: var(--bg); --surface-section-alt: var(--bg-alt); --surface-card: var(--white); --text-primary: var(--ink-2); --text-secondary: var(--slate); --text-tertiary: var(--muted); --text-faint: var(--muted-2); --text-inverse: var(--white); --border-hairline: var(--border); --border-strong: var(--border-2); --action-primary: var(--blue); --action-primary-hover: var(--blue-deep); --action-focus-ring: var(--blue-glow); --emphasis: var(--blue); --link: var(--blue); --link-hover: var(--blue-deep); --status-live: var(--green); --status-warn: var(--amber); --status-error: var(--red); --dark-surface-page: var(--ink); --dark-surface-card: var(--ink-2); --dark-surface-raised: var(--ink-3); --dark-border: var(--border-dark); --dark-text-primary: var(--white); --dark-text-secondary: rgba(255,255,255,0.62); --dark-text-faint: rgba(255,255,255,0.45); --dark-emphasis: var(--blue-mid); --dark-link: var(--blue-mid); --dark-tag-blue-bg: rgba(2,132,199,0.22); --dark-tag-blue-fg: #7DD3FC; --dark-tag-green-bg: rgba(16,185,129,0.18); --dark-tag-green-fg: #6EE7B7; } :root { --font: 'Plus Jakarta Sans',system-ui,-apple-system,sans-serif; --mono: 'JetBrains Mono',ui-monospace,SFMono-Regular,'SF Mono',Menlo,Consolas,monospace; --font-sans: var(--font); --font-mono: var(--mono); --fw-light: 300; --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700; --fw-extrabold: 800; --fs-display: clamp(44px,6vw,76px); --fw-display: 800; --ls-display: -2.5px; --lh-display: 1.0; --fs-h1: 40px; --fw-h1: 800; --ls-h1: -1.2px; --lh-h1: 1.05; --fs-h2: 28px; --fw-h2: 700; --ls-h2: -0.5px; --lh-h2: 1.2; --fs-h3: 20px; --fw-h3: 700; --ls-h3: -0.3px; --lh-h3: 1.3; --fs-body-l: 18px; --lh-body-l: 1.7; --fs-body: 16px; --lh-body: 1.6; --fs-small: 14px; --fs-small-2: 13px; --fw-small: 500; --lh-small: 1.5; --fs-eyebrow: 11px; --fw-eyebrow: 600; --ls-eyebrow: 0.16em; --fs-readout: 12px; --fs-readout-sm: 11px; --fs-readout-tag: 10px; --wordmark-weight: 800; --wordmark-tracking: -0.04em; } :root { --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-7: 28px; --sp-8: 32px; --sp-10: 40px; --sp-12: 48px; --sp-14: 56px; --sp-16: 64px; --sp-20: 80px; --sp-24: 96px; --container: 1080px; --container-wide: 1200px; --gutter: 28px; --section-y: 52px; --section-y-lg: 96px; --btn-pad: 13px 26px; --btn-pad-sm: 9px 16px; --badge-pad: 6px 15px; --readout-pad: 11px 14px; --card-pad: 22px; --input-pad: 11px 14px; } :root { --r: 8px; --r-lg: 12px; --r-xl: 16px; --r-2xl: 24px; --r-pill: 40px; --r-round: 50%; --radius-button: var(--r-lg); --radius-input: var(--r); --radius-chip: var(--r); --radius-card: var(--r-xl); --radius-panel: var(--r-xl); --radius-frame: var(--r-2xl); --radius-pill: var(--r-pill); --sh-sm: 0 1px 3px rgba(0,0,0,0.06),0 1px 2px rgba(0,0,0,0.04); --sh-md: 0 4px 16px rgba(0,0,0,0.08); --sh-lg: 0 12px 40px rgba(0,0,0,0.10); --sh-xl: 0 24px 64px rgba(0,0,0,0.12); --sh-featured: 0 12px 40px rgba(2,132,199,0.14); --sh-button-hover: 0 6px 20px var(--blue-glow); --glow-green: 0 0 12px var(--green-glow); --glow-blue: 0 0 40px rgba(2,132,199,0.35); --ambient-dark: radial-gradient(ellipse 60% 50% at 70% 0%,rgba(2,132,199,0.18) 0%,transparent 70%),radial-gradient(ellipse 40% 40% at 10% 100%,rgba(16,185,129,0.10) 0%,transparent 70%); --ambient-light: radial-gradient(ellipse 70% 70% at 78% -20%,rgba(2,132,199,0.08) 0%,transparent 70%); --ease: cubic-bezier(0.2,0.6,0.2,1); --dur: 0.18s; --dur-slow: 0.3s; } :root { --t-micro: 120ms; --t-state: 200ms; --t-rewrite: 450ms; --t-enter: 600ms; --ease-standard: cubic-bezier(.2,0,0,1); --ease-exit: cubic-bezier(.4,0,1,1); --stagger: 80ms; --rise: 8px; --lift: 3px; } @media (prefers-reduced-motion: reduce) { :root { --t-state: 0ms; --t-rewrite: 0ms; --t-enter: 0ms; --stagger: 0ms; } } @keyframes hw-fade-in { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes hw-rise { 0% { opacity: 0; transform: translateY(var(--rise)); } 100% { opacity: 1; transform: none; } } body { font-family: var(--font); -webkit-font-smoothing: antialiased; line-height: 1.5; margin: 0px; } .theme-light { background: var(--white); color: var(--ink-2); } .theme-dark { background: var(--ink); color: var(--white); } em { color: var(--blue-mid); font-style: italic; font-weight: inherit; } .theme-light em { color: var(--blue); } a { color: var(--blue); text-decoration: none; } a:hover { color: var(--blue-deep); } .theme-dark a { color: var(--blue-mid); } .theme-dark a:hover { color: var(--white); } .gradient-text { background-image: ; background-position-x: ; background-position-y: ; background-size: ; background-repeat: ; background-attachment: ; background-origin: ; background-color: ; background-clip: text; -webkit-text-fill-color: transparent; } .eyebrow { font-family: var(--mono); font-size: 11px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted-2); } @keyframes hw-pulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.5; transform: scale(0.85); } } .pulse-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px var(--green-glow); animation: 1.6s ease-in-out 0s infinite normal none running hw-pulse; flex-shrink: 0; display: inline-block; } @media (prefers-reduced-motion: reduce) { .pulse-dot { animation: auto ease 0s 1 normal none running none; } } :root { --t-micro: 120ms; --t-state: 200ms; --t-rewrite: 450ms; --t-enter: 600ms; --ease-standard: cubic-bezier(.2,0,0,1); --ease-exit: cubic-bezier(.4,0,1,1); --stagger: 80ms; --rise: 8px; --lift: 3px; } @media (prefers-reduced-motion: reduce) { :root { --t-state: 0ms; --t-rewrite: 0ms; --t-enter: 0ms; --stagger: 0ms; } } @keyframes hw-fade-in { 0% { opacity: 0; } 100% { opacity: 1; } } * { box-sizing: border-box; } html, body { margin: 0px; overflow-x: clip; } html body #dc-root, html body #dc-root > .sc-host { height: auto; min-height: 100%; } body { font-family: var(--font); color: var(--ink-2); background: var(--white); -webkit-font-smoothing: antialiased; } a { color: var(--blue); text-decoration: none; transition: color var(--t-micro) var(--ease-standard); } a:hover { color: var(--blue-deep); } :focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; transition: none; } img { max-width: 100%; display: block; } .mono { font-family: ui-monospace, "JetBrains Mono", Menlo, monospace; } .wrap { max-width: 1200px; margin: 0px auto; padding: 0px 32px; } .sec { padding: 96px 0px; background: rgb(255, 255, 255); } .sec.alt { background: rgb(241, 245, 249); } h1, h2, h3, p { margin: 0px; text-wrap: pretty; } h2 { font-size: 28px; font-weight: 700; letter-spacing: -0.5px; line-height: 1.2; color: var(--ink); } h3 { font-size: 20px; font-weight: 700; letter-spacing: -0.3px; line-height: 1.3; color: var(--ink); } h2 em, h3 em { color: var(--blue); } .lead { font-size: 18px; line-height: 1.7; color: var(--slate); } .body { font-size: 16px; line-height: 1.6; color: var(--slate); } .small { font-size: 14px; font-weight: 500; color: var(--muted); } .readline { font-size: 12px; color: var(--muted); letter-spacing: 0.02em; } .head { display: grid; gap: 14px; max-width: 680px; margin-bottom: 44px; } .xf { display: grid; min-width: 0px; } .xf-l { grid-area: 1 / 1; min-width: 0px; opacity: 0; visibility: hidden; transition: opacity var(--t-rewrite) var(--ease-exit),visibility 0s linear var(--t-rewrite); } .xf-l.on { opacity: 1; visibility: visible; transition: opacity var(--t-rewrite) var(--ease-standard),visibility 0s; } .xf.st > .xf-l { transition: opacity var(--t-state) var(--ease-exit),visibility 0s linear var(--t-state); } .xf.st > .xf-l.on { transition: opacity var(--t-state) var(--ease-standard),visibility 0s; } .top { position: sticky; top: 0px; z-index: 40; } .hdr { background: rgba(255, 255, 255, 0.94); backdrop-filter: blur(8px); border-bottom: 1px solid var(--border); } .hdr-in { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 64px; } .hdr-nav { display: flex; gap: 28px; } .hdr-nav a { font-size: 13.5px; font-weight: 600; color: var(--slate); } .hdr-nav a:hover { color: var(--ink); } .hdr-nav a.on { color: var(--blue); } .hdr-r { display: flex; align-items: center; gap: 18px; } .lang { display: flex; gap: 6px; font-size: 11px; color: var(--muted-2); } .lang a { color: var(--muted-2); } .lang .on { color: var(--ink); font-weight: 600; } .login { font-size: 13.5px; font-weight: 600; color: var(--slate); } .menu-btn { display: none; background: none; border: 1px solid var(--border); border-radius: 8px; width: 44px; height: 44px; cursor: pointer; align-items: center; justify-content: center; flex-direction: column; gap: 4px; padding: 0px; } .menu-btn span { width: 16px; height: 1.5px; background: var(--ink-2); display: block; } .mnav { display: none; border-top: 1px solid var(--border); padding: 12px 32px 20px; background: var(--white); } .mnav a { display: block; padding: 12px 0px; font-size: 16px; font-weight: 600; color: var(--slate); border-bottom: 1px solid var(--border); } .mnav .mrow { display: flex; justify-content: space-between; align-items: center; padding-top: 14px; } .istrip { position: relative; height: 32px; background: rgb(241, 245, 249); border-bottom: 1px solid rgb(226, 232, 240); } .istrip-in { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 100%; } .is-read { position: relative; display: flex; align-items: center; gap: 10px; min-width: 0px; flex: 1 1 0%; height: 32px; background: none; border: 0px; padding: 0px; cursor: pointer; font-family: ui-monospace, "JetBrains Mono", Menlo, monospace; font-size: 11px; color: var(--slate); text-align: left; } .is-read::after { content: ""; position: absolute; inset: -6px; } .is-read .xf { flex: 1 1 0%; } .is-read .xf-l { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .is-read b { font-weight: 600; color: var(--ink); } .is-right { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; } .is-count { font-size: 11px; color: var(--muted); white-space: nowrap; animation: hwfade var(--t-state) var(--ease-standard); } @keyframes hwfade { 0% { opacity: 0; } 100% { opacity: 1; } } .is-menu { position: absolute; top: 34px; left: 24px; z-index: 45; background: var(--white); border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--sh-md); padding: 6px; display: grid; min-width: 220px; } .is-menu p { font-size: 11px; color: var(--muted); padding: 8px 12px 4px; } .is-menu button { min-height: 44px; text-align: left; background: none; border: 0px; border-radius: 8px; padding: 0px 12px; font: 600 14px var(--font); color: var(--ink-2); cursor: pointer; transition: background var(--t-micro) var(--ease-standard); } .is-menu button:hover { background: var(--bg-alt); } .mbar { display: none; } .hero { position: relative; background: var(--white); padding: 88px 0px 96px; overflow: hidden; border-bottom: 1px solid var(--border); } .hero::before { content: ""; position: absolute; inset: 0px; background: var(--ambient-light); pointer-events: none; } .display { font-size: clamp(44px, 5vw, 76px); font-weight: 800; letter-spacing: -2.5px; line-height: 1; color: var(--ink); } .hl-em { background-image: ; background-position-x: ; background-position-y: ; background-size: ; background-repeat: ; background-attachment: ; background-origin: ; background-color: ; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; } .btns { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; } .g2 { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 48px; } .g3 { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 24px; } .ftr { background: var(--ink); color: rgba(255, 255, 255, 0.62); padding: 64px 0px 32px; } .ftr-grid { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 32px; } .ftr h2 { margin: 0px 0px 14px; font-family: ui-monospace, "JetBrains Mono", Menlo, monospace; font-size: 11px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted-2); } .ftr ul { list-style: none; margin: 0px; padding: 0px; display: grid; gap: 10px; } .ftr a { color: rgba(255, 255, 255, 0.72); font-size: 14px; } .ftr a:hover { color: var(--white); } .ftr-brand { justify-self: end; } .ftr-bot { margin-top: 48px; padding-top: 22px; border-top: 1px solid var(--border-dark); display: flex; flex-wrap: wrap; gap: 12px; justify-content: space-between; align-items: center; font-size: 12px; } .ftr .lang a { color: rgba(255, 255, 255, 0.5); font-size: 11px; } .ftr .lang .on { color: var(--white); } .js-rise .rise { transition: opacity var(--t-enter) var(--ease-standard),transform var(--t-enter) var(--ease-standard); } .js-rise .rise:not(.in) { opacity: 0; transform: translateY(var(--rise)); } .js-rise .rise.noanim { transition: none; } @media (prefers-reduced-motion: reduce) { .js-rise .rise, .js-rise .rise:not(.in) { opacity: 1; transform: none; transition: none; } .pulse-dot { animation: auto ease 0s 1 normal none running none !important; } .is-count { animation: auto ease 0s 1 normal none running none; } } @media (max-width: 1100px) { .ftr-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); } .ftr-brand { justify-self: start; } } @media (max-width: 900px) { .sec { padding: 56px 0px; } .hero { padding: 48px 0px 56px; } .hdr-nav, .login, .hdr-r .lang { display: none; } .menu-btn { display: inline-flex; } .mnav.open { display: block; } .is-count { display: none; } .g2, .g3 { grid-template-columns: minmax(0px, 1fr); gap: 32px; } .mbar { display: block; position: fixed; left: 0px; right: 0px; bottom: 0px; z-index: 39; background: var(--white); border-top: 1px solid var(--border); padding: 10px 20px; transform: translateY(100%); transition: transform var(--t-rewrite) var(--ease-standard); } .mbar.show { transform: none; } .ftr { padding-bottom: 88px; } } @media (max-width: 720px) { .ftr-grid { grid-template-columns: minmax(0px, 1fr); } .wrap { padding: 0px 20px; } .mnav { padding: 12px 20px 20px; } .is-menu { left: 12px; } } .js-rise .rise.stg > * { transition: opacity var(--t-enter) var(--ease-standard),transform var(--t-enter) var(--ease-standard); } .js-rise .rise.stg:not(.in) > * { opacity: 0; transform: translateY(var(--rise)); } .js-rise .rise.stg:not(.in) { opacity: 1; transform: none; } .js-rise .rise.stg > :nth-child(2) { transition-delay: var(--stagger); } .js-rise .rise.stg > :nth-child(3) { transition-delay: calc(var(--stagger)*2); } .js-rise .rise.stg > :nth-child(4) { transition-delay: calc(var(--stagger)*3); } .js-rise .rise.stg > :nth-child(5) { transition-delay: calc(var(--stagger)*4); } .js-rise .rise.stg > :nth-child(n+6) { transition-delay: calc(var(--stagger)*5); } @media (prefers-reduced-motion: reduce) { .js-rise .rise.stg > *, .js-rise .rise.stg:not(.in) > * { opacity: 1; transform: none; transition: none; } } .facts { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; } .facts a { display: inline-flex; border-radius: 40px; } .facts-m { display: none; justify-content: flex-start; } .anchor { scroll-margin-top: 112px; } .chips { display: flex; flex-wrap: wrap; gap: 8px; } .doclist { list-style: none; margin: 0px; padding: 0px; } .doclist li { border-top: 1px solid var(--border); } .doclist li:first-child { border-top: 0px; } .doclist a { display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 56px; padding: 12px 0px; font-size: 16px; font-weight: 600; color: var(--ink); } .doclist a:hover { color: var(--blue); } .il { list-style: none; margin: 0px; padding: 0px; display: grid; gap: 10px; } .il li { font-size: 15px; line-height: 1.6; color: var(--slate); } .il b { font-weight: 600; color: var(--ink); } @media (max-width: 720px) { .facts-d { display: none; } .facts-m { display: flex; } }

ENNL

Product Kanalen Prijzen Partners Vertrouwen Over ons

Inloggen

ENNL

01 / 05 · hero

over ons

Dertig seconden. Dat is de opdracht.

Ik ben Dennis Schouten, oprichter van HyperW. Twintig jaar informatiebeveiliging; HyperW is wat ik daarna heb gebouwd.

Plan 30 minuten →

Zie het zich aanpassen

De meeste B2B-websites zijn statisch. Elke bezoeker landt op dezelfde pagina en geeft die zo'n dertig seconden. HyperW begon bij dat getal: één pagina per bezoeker, geschreven voor zijn branche en zijn vraag, vooraf gebouwd, en opnieuw geschreven wanneer hij terugkomt.

De tools die dit deden, waren gebouwd voor enterprisebudgetten. Ik heb het gebouwd voor bedrijven die geen enterpriseteam hebben om het te draaien: binnen enkele dagen live, zonder integratie, uw eigen content, een prijs die past.

Twintig jaar informatiebeveiliging bepaalde hoe het is gebouwd: hosting in de EU, toestemming vóór alles op persoonsniveau, niets dat namens u wordt verstuurd. De AI schrijft het concept; uw mensen beslissen. AI hoort de mensen die het werk doen te ondersteunen, niet te vervangen.

20+ jaar · informatiebeveiliging en cybersecurity-architectuur

Post-quantumcryptografie · architectuur en advies

Gastdocent · hbo

Melya Holding B.V. · Papendrecht · KvK 51872587

Door de oprichter geleid, klanten bij naam, schriftelijke afspraken.

Door de oprichter geleid, met partners eromheen

Ik bouw het product en beantwoord de mail, en ik ben niet de enige ingang. Sales en partnerships hebben een eigen trekker. Codifire levert en ondersteunt HyperW voor zijn eigen klanten; de juridische kant is een externe jurist; het platform draait op beheerde EU-infrastructuur, niet op één laptop. Uw kennisbank en uw gegevens zijn van u en exporteert u wanneer u wilt.

Klanten die het mij als eerste vertellen

Beterbeschermd, FleGo, UpUco, MindYourPass en Hammer Distribution draaien HyperW op hun eigen campagnes en hebben het product mede gevormd.

Partners en juridisch

Codifire is de eerste distributiepartner; de juridische documenten komen van een externe jurist en staan onder /legal.

Praat met degene die het heeft gebouwd.

Plan 30 minuten →

dennis@hyperw.net LinkedIn

Plan 30 minuten →