@font-face {font-family:Geist;src:url('/assets/Geist-Variable.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face {font-family:'Grenze Gotisch';src:url('/assets/GrenzeGotisch-Variable.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}
:root {font-family:var(--font-interface);color:var(--color-ink);background:var(--color-surface);font-synthesis:none;scroll-behavior:smooth;scroll-padding-top:32px}
* {box-sizing:border-box}
body {margin:0}
button,input {font:inherit}
a {color:inherit;text-underline-offset:4px}
button,a,input {-webkit-tap-highlight-color:transparent}
button,a {touch-action:manipulation}
button {cursor:pointer}
img {display:block;max-width:100%;height:auto}
button:focus-visible,a:focus-visible,input:focus-visible,[tabindex]:focus-visible {outline:3px solid var(--color-focus);outline-offset:5px}
.wrap {width:min(1160px,calc(100% - 80px));margin-inline:auto}
.header {min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand {display:inline-flex;align-items:center;text-decoration:none}
.brand-full {width:auto;height:36px;object-fit:contain}
.brand-icon {display:none;width:36px;height:36px;object-fit:contain}
.header nav {display:flex;align-items:center;gap:32px;font-size:.875rem}
.workflow-link {text-decoration:none}
.workflow-link:hover {text-decoration:underline}
.button {background:var(--color-action-primary);color:var(--color-on-action-primary);display:inline-flex;align-items:center;justify-content:center;gap:28px;text-decoration:none;padding:16px 23px;border:1px solid var(--color-action-primary);border-radius:var(--radius-control);line-height:1.35;font-weight:400;transition:background var(--motion-standard)}
.button:hover {background:var(--color-action-primary-hover)}
.button.small {padding:11px 17px;gap:20px}
.header .button {background:var(--color-surface);color:var(--color-ink);border-color:var(--color-ink)}
.header .button:hover {background:var(--color-canvas)}
.button .cta-icon {width:1.2em;height:1.2em;flex:none}
.button.is-pending {position:relative}
.button-spinner {position:absolute;right:16px;top:50%;width:18px;height:18px;margin-top:-9px;animation:button-spinner-rotate .8s linear infinite}
@keyframes button-spinner-rotate {to{transform:rotate(360deg)}}
.hero {position:relative;isolation:isolate;padding-top:78px;border-bottom:1px solid var(--color-line)}
.hero-copy {text-align:center}
.positioning {font-size:1rem;line-height:1.6;margin:0 0 22px;font-weight:400}
.hero h1 {font-family:var(--font-marketing-display);font-size:clamp(6.5rem,6.8vw,6.5rem);font-weight:700;letter-spacing:-.025em;line-height:1.08;margin:0}
.headline-lead {display:block;text-wrap:balance}
.audience-words {display:grid;overflow:hidden;color:var(--primitive-color-blue-500)}
.audience-word {grid-area:1/1;opacity:0;overflow-wrap:anywhere}
.audience-word.is-current {opacity:1}
.hero-description strong {color:var(--color-ink);font-weight:500}
.motion-toggle {display:block;margin:16px auto 0;border:0;background:transparent;color:var(--color-muted);font-size:.75rem;min-height:28px;padding:4px 8px;text-decoration:underline;text-underline-offset:3px}
.hero-description {font-size:1.125rem;line-height:1.65;color:var(--color-muted);max-width:590px;margin:27px auto 25px}
.hero-cta {font-size:1rem}
.micro {font-size:.8125rem;color:var(--color-muted);line-height:1.6;margin:18px 0 0}
.product-stage {margin-top:65px;padding-bottom:30px}
.sample-meta {font-size:.75rem}
.product-window {border:1px solid var(--color-line-strong);border-radius:var(--radius-sm);overflow:hidden;box-shadow:0 16px 48px -24px #12121230;background:var(--color-bg)}
.product-window img {width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.demo-caption {text-align:center;font-size:.75rem;line-height:1.6;color:var(--color-muted);margin:20px 0 0}
.workflow {padding-block:106px 98px}
.section-heading {display:grid;grid-template-columns:1fr 1fr;align-items:end;column-gap:70px}
h2 {font-family:var(--font-interface);font-size:clamp(3.2rem,3.5vw,2.75rem);line-height:1.2;font-weight:500;letter-spacing:-1.5px;margin:0}
.section-heading>p {font-size:1rem;line-height:1.75;color:var(--color-muted);margin:0 0 2px;max-width:440px}
.workflow-demo {display:grid;grid-template-columns:.85fr 1.15fr;gap:75px;align-items:center;margin-top:50px}
.steps {border-top:1px solid var(--color-line)}
.steps button {width:100%;border:0;border-bottom:1px solid var(--color-line);background:transparent;display:flex;text-align:left;align-items:flex-start;padding:30px 14px;gap:24px;transition:background var(--motion-standard);color:var(--color-ink)}
.steps button[aria-selected=true] {background:var(--color-canvas)}
.step-number {color:var(--color-muted);font-size:.75rem;padding-top:5px;font-variant-numeric:tabular-nums}
.steps strong {font-size:1.125rem;font-weight:500;display:block;margin-bottom:9px}
.steps button>span:nth-child(2)>span {font-size:.875rem;line-height:1.65;color:var(--color-muted);display:block}
#workflow-panel {min-width:0}
.workflow-image-frame {background:var(--color-canvas);border-radius:var(--radius-md);overflow:hidden;aspect-ratio:1.25;display:flex;align-items:center;justify-content:center}
.workflow-image-frame img {width:100%;height:100%;object-fit:contain}
#workflow-caption {font-size:.8125rem;color:var(--color-muted);line-height:1.7;margin:14px 2px 0;min-height:44px}
.workflow-footnote {font-size:1.125rem;color:var(--color-muted);line-height:1.7;max-width:790px;margin:36px 0 0}
.closing {background:var(--color-bg);border-top:1px solid var(--color-line);padding:90px 0}
.closing-inner {display:grid;grid-template-columns:1fr 1fr;gap:95px;align-items:center}
.closing h2 {font-family:var(--font-marketing-display);font-size:3rem;font-weight:700;line-height:1.15;letter-spacing:0}
.closing-copy>p {font-size:1rem;line-height:1.75;color:var(--color-muted);margin:28px 0 0}
.waitlist-form {background:var(--color-surface);border:1px solid var(--color-focus);border-radius:var(--radius-md);padding:34px}
.waitlist-form h3 {font-size:1.5rem;letter-spacing:-.6px;font-weight:500;margin:0 0 10px;line-height:1.3}
.form-intro {font-size:.875rem;color:var(--color-muted);line-height:1.6;margin:0 0 28px}
.waitlist-form>label:not(.consent) {display:block;font-size:.875rem;margin:22px 0 9px;font-weight:400}
.waitlist-form label span {color:var(--color-muted);font-weight:400}
.waitlist-form input:not([type=checkbox]) {width:100%;min-height:49px;padding:12px;border:1px solid #737373;border-radius:var(--radius-control);background:var(--color-surface);font-size:1rem;color:var(--color-ink)}
.waitlist-form input::placeholder {color:var(--color-muted);font-size:.875rem}
.consent {display:flex;align-items:flex-start;gap:10px;margin:22px 0;font-size:.8125rem;line-height:1.65;cursor:pointer}
.consent input {margin:3px 0 0;width:18px;height:18px;flex-shrink:0;accent-color:var(--color-focus)}
.submit {width:100%;justify-content:space-between;margin-top:2px}
.button:disabled {cursor:wait;opacity:.65}
.privacy-note {font-size:.75rem;line-height:1.7;color:var(--color-muted);margin:18px 0 0}
.privacy-note a {white-space:nowrap}
.field-error {font-size:.8125rem;color:var(--color-ink);margin:8px 0;line-height:1.6}
input[aria-invalid=true] {border-color:var(--color-focus)!important}
#form-status:empty {display:none}
#form-status {font-size:.875rem;line-height:1.65;padding:14px;background:var(--color-canvas);border-radius:var(--radius-control);margin:18px 0 0}
#form-status[data-state=error] {color:var(--color-ink);background:var(--color-info-surface)}
#form-status[data-state=success] {color:var(--color-success);background:var(--color-success-surface);border:1px solid var(--color-success-border)}
.waitlist-form[data-complete=true]>:not(h3):not(#form-status):not(.privacy-note) {display:none}
.honeypot {position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.footer {min-height:105px;display:flex;align-items:center;gap:28px}
.footer .brand-full {height:28px}
.footer>a:not(.brand) {font-size:.8125rem}
.footer p {font-size:.8125rem;color:var(--color-muted)}
.footer>a:last-child {margin-left:auto}
.skip-link {position:absolute;top:10px;left:10px;padding:14px;background:var(--color-surface);z-index:10;transform:translateY(-180%)}
.skip-link:focus {transform:translateY(0)}
.preview-notice {background:var(--color-canvas);color:var(--color-muted);text-align:center;padding:8px 20px;font-size:.75rem;line-height:1.5;border-bottom:1px solid var(--color-line)}
.legal-page {padding:0}
.legal-content {width:min(820px,calc(100% - 80px));margin-inline:auto;padding:65px 0 90px}
.legal-content .eyebrow {font-size:.8125rem;font-weight:400}
.legal-content h1 {font-family:var(--font-marketing-display);font-size:3.5rem;line-height:1.1;letter-spacing:0;font-weight:700}
.legal-content h2 {font-size:1.5rem;letter-spacing:-.5px;margin-top:35px}
.legal-content h3 {font-size:1.0625rem;letter-spacing:-.2px;margin:24px 0 4px}
.legal-content p,.legal-content li {color:var(--color-muted);line-height:1.8;font-size:1rem}
.legal-content .notice {padding:20px;background:var(--color-canvas);border-radius:var(--radius-control)}
.legal-content ul {padding-left:24px}
.legal-page .policy-meta {margin-top:-8px}
.legal-page a {overflow-wrap:anywhere}
.legal-page li+li {margin-top:8px}
[hidden] {display:none!important}
@media(max-width:900px) {
 .wrap {width:calc(100% - 48px)}
 .hero {padding-top:42px}
 .hero h1 {font-size:clamp(3rem,8vw,5rem)}
 .workflow-demo {gap:32px}
 .closing-inner {gap:36px}
 .closing h2 {font-size:2.25rem}
 .waitlist-form {padding:25px}
 .section-heading {gap:35px}
 .product-stage {margin-top:55px}
 .sample-meta {display:none}
}
@media(max-width:650px) {
 .wrap {width:calc(100% - 36px)}
 .header .brand,.footer .brand {min-width:44px;min-height:44px;justify-content:center;flex-shrink:0}
 .header .brand-full,.footer .brand-full {display:none}
 .header .brand-icon,.footer .brand-icon {display:block}
 .header {min-height:78px;gap:12px}
 .header .brand-icon {width:30px;height:30px}
 .header nav {gap:0}
 .workflow-link {display:none}
 .button.small {padding:11px 13px;gap:12px;font-size:.8125rem}
 .hero {padding-top:36px}
 .positioning {font-size:.875rem;margin-bottom:22px}
 .hero h1 {font-size:clamp(2.625rem,12.5vw,4.6rem);letter-spacing:-.01em;line-height:1.04}
 .hero-description {font-size:1rem;line-height:1.7;margin-top:25px;max-width:350px}
 .hero-cta {padding:15px 22px;font-size:.9375rem}
 .micro {font-size:.75rem;max-width:280px;margin:16px auto 0}
 .product-stage {margin-top:40px;padding-bottom:23px}
 .product-window {border-width:1px;border-radius:var(--radius-sm)}
 .product-window img {aspect-ratio:16/9;object-fit:contain}
 .demo-caption {font-size:.6875rem;line-height:1.7;margin-top:14px}
 .workflow {padding-block:65px}
 .section-heading {display:block}
 h2 {font-size:2rem;letter-spacing:-1px}
 .section-heading>p {font-size:.9375rem;margin-top:22px}
 .workflow-demo {display:flex;flex-direction:column;gap:25px;margin-top:30px;align-items:stretch}
 .steps button {padding:23px 12px;gap:20px}
 .steps strong {font-size:1rem;margin-bottom:6px}
 .steps button>span:nth-child(2)>span {font-size:.8125rem}
 .workflow-image-frame {aspect-ratio:1.1}
 .workflow-footnote {font-size:.75rem;margin-top:20px}
 .closing {padding:60px 0}
 .closing-inner {grid-template-columns:1fr;gap:35px}
 .closing h2 {font-size:2.25rem}
 .closing-copy>p {font-size:1rem;margin-top:23px}
 .waitlist-form {padding:25px 22px}
 .footer {gap:15px;flex-wrap:wrap;padding-block:23px;min-height:90px}
 .footer p {font-size:.6875rem;max-width:120px;line-height:1.6}
 .footer>a:not(.brand) {font-size:.75rem}
 .legal-content {width:calc(100% - 36px);padding:48px 0 64px}
 .legal-content h1 {font-size:3.3rem}
}
@media(prefers-reduced-motion:reduce) {
 :root {scroll-behavior:auto}
 *,*:before,*:after {transition:none!important;animation:none!important}
}

/* Marketing framing: restrained neutral surfaces and precise shared-token rules. */
main {max-width:1240px;margin-inline:auto;border-inline:1px solid var(--color-line)}
@media(min-width:651px) {
 main.wrap:not(.not-found) {width:100%;max-width:1240px}
}
.header {border-bottom:none}
:root[data-appearance='dark'] .brand img {filter:invert(1)}
.hero-copy {position:relative}
.product-stage {margin-top:64px;padding-bottom:32px}
.waitlist-form {background:var(--color-bg);border-radius:var(--radius-sm)}
.steps button {position:relative}
.steps button[aria-selected=true]:before {content:'';position:absolute;left:0;top:24px;bottom:24px;width:2px;background:var(--primitive-color-blue-500)}
.workflow-image-frame {border:1px solid var(--color-line);border-radius:var(--radius-sm)}
.closing {background:var(--color-bg)}
.preview-notice {background:var(--color-bg)}
@media(max-width:650px) {
 main {border-inline:0}
 .hero {padding-top:48px}
 .product-stage {margin-top:38px}
 .closing h2 {font-size:1.875rem}
}

/* Center the visible sentence; reserve wrapped labels on narrow screens. */
.hero-audience {font-family:var(--font-interface);position:relative;display:flex;align-items:center;justify-content:center;gap:.25em;width:fit-content;max-width:calc(100% - 72px);margin:18px auto 0;font-size:clamp(1.25rem,2.5vw,2rem);font-weight:200;line-height:1.5}
.audience-prefix {white-space:nowrap}
.hero-audience .audience-words {position:relative;display:block;flex:none;width:var(--audience-width,auto);height:1.5em;transition:width 420ms cubic-bezier(.22,1,.36,1);text-align:left}
.audience-word {position:absolute;left:0;top:0;width:max-content;white-space:nowrap}
.audience-word.is-current {position:relative}
.audience-person {color:var(--primitive-color-blue-500);font-weight:600}
.hero-audience + .hero-description {margin-top:16px;max-width:620px}
.motion-toggle {display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;min-height:32px;margin:0;padding:0;font-size:1rem;text-decoration:none;border-radius:var(--radius-control)}
.hero-audience>.motion-toggle {position:absolute;left:calc(100% + 8px);top:50%;transform:translateY(-50%)}
.motion-toggle:hover {background:var(--color-line)}
.sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:950px) {
 .hero-audience {display:grid;grid-template-columns:minmax(0,1fr) 32px;gap:0 4px;width:100%;max-width:100%;padding-left:36px;font-size:clamp(1.25rem,5.65vw,1.5rem)}
 .audience-prefix {grid-column:1 / -1;margin-left:-36px;white-space:normal;text-wrap:balance}
 .hero-audience .audience-words {display:grid;width:100%;height:auto;min-height:1.5em;text-align:center;transition:none}
 .hero-audience .audience-word {position:relative;grid-area:1/1;width:auto;min-width:0;white-space:normal;overflow-wrap:anywhere}
 .hero-audience>.motion-toggle {position:static;transform:none;align-self:center}
}
@media(max-width:380px) {
 .header .brand-icon {width:26px;height:26px}
 .header .button.small {font-size:.75rem;padding:10px;gap:8px}
}

@media(min-width:951px) {
 .hero-audience + .hero-description {max-width:none}
}

.section-heading h2 {font-family:var(--font-marketing-display);font-weight:700;letter-spacing:-.025em}
@media(max-width:1000px) {
 .section-heading {display:block}
 .section-heading>p {max-width:620px;margin-top:22px}
}

/* Large, user-controlled horizontal product deck. */
.workflow-demo {display:flex;flex-direction:column;align-items:stretch;gap:36px}
.steps {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:0;gap:20px}
.steps button {padding:20px 14px;gap:14px;border-bottom:2px solid var(--color-line);height:100%}
.steps button[aria-selected=true] {border-color:var(--primitive-color-blue-500)}
.steps button[aria-selected=true]:before {display:none}
.workflow-deck {--slide-ratio:1.611336;position:relative;aspect-ratio:calc(var(--slide-ratio) / .8);overflow:hidden;isolation:isolate}
.workflow-card {position:absolute;inset:0 10%;background:var(--color-canvas);border:1px solid var(--color-line);border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-float);transition:transform 650ms cubic-bezier(.22,1,.36,1),opacity 650ms ease,filter 650ms ease;pointer-events:none}
.workflow-card img {display:block;width:100%;height:100%;object-fit:contain}
.workflow-card[data-position=active] {transform:translateX(0) scale(1);opacity:1;filter:blur(0);z-index:3}
.workflow-card[data-position=next] {transform:translateX(85%) scale(.86);opacity:.25;filter:blur(3px);z-index:1}
.workflow-card[data-position=previous] {transform:translateX(-85%) scale(.86);opacity:.25;filter:blur(3px);z-index:1}
#workflow-caption {text-align:center;margin:16px auto 0;max-width:680px;padding-inline:16px}
@media(max-width:650px) {
 .steps {gap:6px}
 .steps button {padding:14px 8px;flex-direction:column;gap:8px}
 .steps strong {font-size:.875rem;margin:0}
 .steps button>span:nth-child(2)>span {display:none}
 .workflow-demo {gap:20px}
 .workflow-deck {aspect-ratio:calc(var(--slide-ratio) / .88)}
 .workflow-card {inset:0 6%}
}
@media(prefers-reduced-motion:reduce) {.workflow-card {transition:none}}

/* Mobile markup illustrations reuse the source render, not an invented app UI. */
.markup-closeup,.mobile-demo {display:none}
@media(max-width:650px) {
 .desktop-demo {display:none}
 .mobile-demo {display:inline}
 .markup-closeup {display:flex;flex-direction:column;aspect-ratio:1;overflow:hidden;background:var(--color-surface);border:1px solid var(--color-line);border-radius:var(--radius-sm)}
 .markup-closeup svg {display:block;width:100%;flex:1;min-height:0;color:var(--primitive-color-blue-500)}
 .markup-closeup ellipse {fill:none;stroke:currentColor;stroke-width:5}
 .markup-closeup circle {fill:currentColor;stroke:var(--color-surface);stroke-width:3}
 .markup-closeup text {fill:var(--color-surface);font-family:var(--font-interface);font-size:25px;font-weight:600}
 .markup-note {display:flex;align-items:flex-start;gap:12px;padding:18px 16px;border-top:1px solid var(--color-line)}
 .markup-number {font-size:.75rem;font-weight:600;line-height:1.7;color:var(--primitive-color-blue-500)}
 .markup-note strong {display:block;font-size:1rem;font-weight:600;line-height:1.4}
 .markup-note p {margin:6px 0 0;font-size:.875rem;line-height:1.55;color:var(--color-muted)}
 .workflow-card--markup>img {display:none}
 .workflow-card .markup-closeup {height:100%;aspect-ratio:auto;border:0;border-radius:0}
}

/* Static visual examples: editable marks over illustrative source images. */
.use-cases {padding-block:80px 88px;border-top:1px solid var(--color-line)}
.use-cases-heading {max-width:800px;margin:0 auto 44px;text-align:center}
.use-cases-heading h2 {font-family:var(--font-marketing-display);font-size:clamp(2.25rem,4.3vw,3.5rem);font-weight:700;letter-spacing:-.025em;line-height:1.12;text-wrap:balance}
.use-cases-heading p {max-width:660px;margin:22px auto 0;font-size:1rem;line-height:1.75;color:var(--color-muted)}
.use-case-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.use-case {margin:0;min-width:0}
.use-case h3 {font-size:1.25rem;font-weight:500;letter-spacing:-.025em;margin:0 0 16px}
.use-case-image {position:relative;aspect-ratio:1;overflow:hidden;background:var(--color-canvas);border-radius:var(--radius-sm)}
.use-case-image img {width:100%;height:100%;object-fit:cover}
.use-case-image svg {position:absolute;inset:0;width:100%;height:100%;overflow:visible;color:var(--primitive-color-blue-500)}
.use-case-image ellipse {fill:none;stroke:currentColor;stroke-width:.65}
.use-case-image circle {fill:currentColor;stroke:var(--color-surface);stroke-width:.4}
.use-case-image text {fill:var(--color-surface);font-family:var(--font-interface);font-size:4px;font-weight:600;text-anchor:middle}
.use-case figcaption {display:flex;align-items:center;gap:10px;font-size:.9375rem;line-height:1.5;margin-top:16px}
.use-case-number {display:inline-flex;align-items:center;justify-content:center;width:23px;height:23px;flex:none;border-radius:50%;background:var(--primitive-color-blue-500);color:var(--color-surface);font-size:.75rem;font-weight:600}
@media(max-width:650px) {
 .use-cases {padding-block:56px}
 .use-cases-heading {text-align:left;margin-bottom:32px}
 .use-case-grid {grid-template-columns:1fr;gap:32px}
 .use-case h3 {margin-bottom:12px}
 .use-cases-heading h2 {font-size:2.25rem}
}

.not-found {padding-block:80px;text-align:center;min-height:65vh}
.not-found h1 {font-family:var(--font-marketing-display);font-size:clamp(3.5rem,8vw,6rem);line-height:1.1;margin:20px 0;font-weight:700}
.not-found p {color:var(--color-muted);line-height:1.6}
.not-found .button {margin-top:24px}

.footer .footer-copyright {flex-basis:100%;max-width:none;font-size:.75rem;color:var(--color-muted);margin:0 0 20px}
.footer:has(.footer-copyright) {flex-wrap:wrap;padding-top:24px;row-gap:12px}
.legal-identity {font-size:.875rem;line-height:1.7}