@font-face {
  font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url('../fonts/InterTight-var.woff2') format('woff2-variations');
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 84px; }

html.sanft { scroll-behavior: auto; }
body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd, ul, ol { margin: 0; }
ul[class], ol[class] { list-style: none; padding: 0; }
img, svg, video { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
button { background: none; border: 0; cursor: pointer; }
a { color: inherit; text-decoration: none; }
:where(summary) { cursor: pointer; }
summary::-webkit-details-marker { display: none; }

:root {
  
  --accent: #4054F8;   

  --signal:    #0D0D0D;
  --on-signal: #FFFFFF;

  --accent-ink:  #403FBA;   
  --accent-lift: #9FAFFF;   
  --on-accent:   #FFFFFF;   

  --accent-soft: color-mix(in srgb, var(--signal) 6%, transparent);
  --accent-line: color-mix(in srgb, var(--signal) 16%, transparent);
  --accent-glow: color-mix(in srgb, var(--signal) 8%, transparent);

  --accent-text: var(--ink);

  --bg:          #FFFFFF;
  --bg-alt:      #F3F3F3;
  --surface:     #F3F3F3;   
  --surface-2:   #FFFFFF;
  --field:       #EDEDED;

  --block-bg:     #303030;
  --block-ink:    #FFFFFF;
  --block-muted:  rgba(255,255,255,.78);
  --block-line:   rgba(255,255,255,.18);
  --block-accent: var(--accent-lift);

  --ink:         #0D0D0D;   
  --ink-muted:   #4D4D4D;   
  --ink-faint:   #626262;   
  --ink-invert:  #FFFFFF;

  --line:        rgba(12,12,12,.13);
  --line-strong: rgba(12,12,12,.26);
  --line-soft:   rgba(12,12,12,.07);

  --btn-2-bg:         #E4E4E4;   
  --btn-2-border:     rgba(12,12,12,.16);
  --btn-ghost-bg:     rgba(12,12,12,.04);
  --btn-ghost-border: rgba(12,12,12,.18);

  --shadow-btn:  0 1px 1px rgba(0,0,0,.10), 0 2px 4px rgba(0,0,0,.08), 0 8px 24px rgba(0,0,0,.10);
  --shadow-card: 0 1px 2px rgba(12,12,12,.04), 0 10px 24px rgba(12,12,12,.05), 0 48px 80px rgba(12,12,12,.06);

  --font: 'Inter Tight', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --fs-h1:   clamp(2.25rem, 1.15rem + 4.9vw, 4.5rem);
  --fs-h2:   clamp(1.875rem, 1.20rem + 3.1vw, 3.25rem);
  --fs-h3:   clamp(1.5rem,  1.12rem + 1.9vw, 2.5rem);
  --fs-h4:   clamp(1.375rem, 1.12rem + 1.0vw, 1.875rem);
  --fs-h5:   clamp(1.05rem, 1.00rem + 0.3vw, 1.25rem);
  --fs-h6:   1.25rem;
  --fs-lg:   clamp(1.0625rem, 1.00rem + .35vw, 1.1875rem);
  --fs-base: 1rem;
  --fs-sm:   .875rem;
  --fs-xs:   .75rem;
  --fs-mono: .8125rem;

  --lh-tight: 1.06;
  --lh-snug:  1.14;
  --lh-body:  1.6;

  --fw-display: 600;
  --fw-title:   400;
  --fw-ui:      500;

  --tracking-tight: -.03em;
  --tracking-wide:  .14em;

  --r-xs:   4px;   
  --r-sm:   9px;   
  --r-md:  11px;   
  --r-lg:  14px;   
  --r-xl:  16px;   
  --r-pill: 999px; 

  --container: 1360px;   
  --gutter:    clamp(16px, 4vw, 32px);
  --section-y: clamp(60px, 7vw, 116px);
  --stack:     clamp(40px, 5vw, 68px);

  --motif-scrim:     rgba(255,255,255,.70);   
  --motif-scrim-inv: rgba(0,0,0,.74);         

  --motif-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23g)' opacity='.38'/%3E%3C/svg%3E");

  --ease:  cubic-bezier(.2,.7,.25,1);
  --quart: cubic-bezier(.165,.84,.44,1);
  --dur:   .55s;

  color-scheme: light;
}

@supports (color: oklch(from red l c h)) {
  :root {
    --accent-ink:  oklch(from var(--accent) .45 c h);
    --accent-lift: oklch(from var(--accent) .80 c h);
    --on-accent:   oklch(from var(--accent) clamp(0, (.58 - l) * 1000, 1) 0 h);
  }
}

@supports (interpolate-size: allow-keywords) { :root { interpolate-size: allow-keywords; } }

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  font-size: var(--fs-base);
  line-height: var(--lh-body);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 { font-weight: var(--fw-title); line-height: var(--lh-snug); letter-spacing: var(--tracking-tight); color: var(--ink); text-wrap: balance; overflow-wrap: break-word; }

h1, h2, .hero__title { hyphens: manual; }

p, li, dd { hyphens: manual; }
h1 { font-size: var(--fs-h1); line-height: var(--lh-tight); font-weight: var(--fw-display); }
h2 { font-size: var(--fs-h2); font-weight: var(--fw-display); }
h3 { font-size: var(--fs-h3); }
h4 { font-size: var(--fs-h4); font-weight: var(--fw-ui); letter-spacing: -.018em; }
h5 { font-size: var(--fs-h5); font-weight: var(--fw-ui); letter-spacing: -.012em; }
h6 { font-size: var(--fs-h6); font-weight: var(--fw-ui); letter-spacing: -.01em; }
p  { color: var(--ink-muted); text-wrap: pretty; }

a:not([class]) { color: var(--accent-text); text-decoration: underline; text-underline-offset: .18em; }
a:not([class]):hover { text-decoration-thickness: 2px; }

::selection { background: var(--signal); color: var(--on-signal); }

:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; border-radius: 2px; }

.u-visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}

.skip-link {
  position: absolute; left: 12px; top: -100px; z-index: 200;
  background: var(--signal); color: var(--on-signal);
  padding: 10px 18px; border-radius: var(--r-sm); font-weight: 600;
}
.skip-link:focus { top: 12px; }

.section { padding: var(--section-y) var(--gutter); position: relative; }
.container { width: 100%; max-width: var(--container); margin-inline: auto; }
.content { display: flex; flex-direction: column; align-items: center; gap: var(--stack); }

.section-head {
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  text-align: center; max-width: var(--head-w, 720px); margin-inline: auto;
}
.section-head p { font-size: var(--fs-lg); }
.section-head--start { align-items: flex-start; text-align: left; margin-inline: 0; }
.section-body { width: 100%; }

.eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 20px;
  border: 1px solid var(--accent-line);
  background: var(--accent-soft);
  color: var(--accent-text);
  border-radius: var(--r-xs);
  font-size: var(--fs-sm); font-weight: var(--fw-ui);
  letter-spacing: .01em;
  line-height: 1.4;
}
.eyebrow::before {
  content: ""; width: 7px; height: 7px; border-radius: 50%;
  background: var(--signal); flex: none;
}

.mono {
  font-family: var(--font-mono); font-size: var(--fs-mono);
  letter-spacing: .04em; color: var(--ink-faint);
}

.brand { display: inline-flex; align-items: center; gap: 12px; flex: none; }
.brand__mark { width: 30px; height: auto; }
.brand__word { width: 92px; height: auto; }

.brand__sub {
  font-size: .625rem; font-weight: var(--fw-ui); letter-spacing: .18em;
  text-transform: uppercase; color: var(--ink-faint); padding-left: 10px;
  border-left: 1px solid var(--line); line-height: 1.2;
}

.trenner {
  background: #FBFBFC;
  display: flex; justify-content: center;
  padding-block: clamp(30px, 3.6vw, 56px);
}
.trenner svg { display: block; width: 68px; height: 22px; }
.trenner path {
  fill: none; stroke: var(--accent); stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round;
}
@media (max-width: 767px) { .trenner { padding-block: 26px; } }

.deco-grid { position: relative; isolation: isolate; overflow: clip; --dot: 1.5px; --dot-gap: 32px; }
.deco-grid::before {
  content: ""; position: absolute; inset: 0; z-index: -2; pointer-events: none;
  background-image: radial-gradient(var(--line-strong) var(--dot), transparent var(--dot));
  background-size: var(--dot-gap) var(--dot-gap);
  background-position: center;
  opacity: .5;
  mask-image: radial-gradient(120% 90% at 50% 0%, #000 20%, transparent 78%);
}
.deco-glow::after {
  content: ""; position: absolute; z-index: -1; pointer-events: none;
  inset: auto 0 -55% 0; height: 70%;
  background: radial-gradient(60% 100% at 50% 100%, var(--accent-glow), transparent 70%);
}

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 13px 26px; border-radius: var(--r-sm);
  font-size: var(--fs-base); font-weight: var(--fw-ui); letter-spacing: -.005em;
  border: 1px solid transparent;
  transition: box-shadow .3s var(--ease), background-color .2s var(--ease),
              border-color .2s var(--ease), color .2s var(--ease), transform .2s var(--ease);
  text-align: center;
}
.btn:hover { box-shadow: var(--shadow-btn); }
.btn:active { transform: translateY(1px); }

.btn--primary { background: var(--signal); color: var(--on-signal); }
.btn--primary:hover { background: color-mix(in srgb, var(--signal) 86%, var(--ink-invert)); }

.btn--ghost {
  background: transparent; color: var(--ink);
  border-color: var(--line-strong);
}
.btn--ghost:hover { border-color: var(--signal); background: var(--btn-ghost-bg); }

.btn--outline {
  background: transparent; color: var(--ink);
  border-color: var(--line-strong);
}
.btn--outline:hover { border-color: var(--signal); background: var(--btn-ghost-bg); }

.btn--arrow { gap: 12px; }
.btn--arrow > svg { flex: none; transition: transform .25s var(--ease); }
.btn--arrow:hover > svg { transform: translateX(3px); }

.btn--wide { width: 100%; }
.btn--sm { padding: 9px 16px; font-size: var(--fs-sm); }
.btn--lg { padding: 19px clamp(28px, 4vw, 48px); font-size: var(--fs-lg); }

.btn__roll { display: block; overflow: hidden; height: 1.35em; }
.btn__roll > span {
  display: block; height: 1.35em; line-height: 1.35em;
  transition: transform .32s var(--ease);
}
.btn:hover .btn__roll > span,
.btn:focus-visible .btn__roll > span { transform: translateY(-100%); }

.nav {
  position: sticky; top: 0; z-index: 50;
  background: transparent; border-bottom: 1px solid transparent;
  transition: background-color .25s var(--ease), border-color .25s var(--ease),
              backdrop-filter .25s var(--ease);
}
body.is-scrolled .nav {
  background: color-mix(in srgb, var(--bg) 82%, transparent);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom-color: var(--line-soft);
}
html:not(.js) .nav {
  background: color-mix(in srgb, var(--bg) 82%, transparent);
  border-bottom-color: var(--line-soft);
}
.nav__bar {
  
  max-width: calc(var(--container) + var(--gutter) * 2);
  margin-inline: auto;
  padding: 12px var(--gutter);
  display: flex; align-items: center; gap: 24px;
}
.nav .brand__word { width: 80px; }
.nav .brand__mark { width: 30px; }
.footer .brand__word { width: 104px; }
.footer .brand__mark { width: 38px; }

.nav__panel { display: contents; }
.nav__links { display: flex; align-items: center; gap: 4px; margin-inline: auto; }
.nav__link {
  padding: 8px 16px; border-radius: var(--r-xs);
  font-size: var(--fs-base); font-weight: 500; color: var(--ink-muted);
  transition: color .2s var(--ease), background-color .2s var(--ease);
}
.nav__link:hover { color: var(--accent-text); background: var(--btn-ghost-bg); }
.nav__link[aria-current="page"] { color: var(--accent-text); }

.nav__actions { display: flex; align-items: center; gap: 10px; flex: none; }

.nav__burger {
  display: none; width: 42px; height: 42px; flex: none;
  border: 1px solid var(--line); border-radius: var(--r-sm);
  align-items: center; justify-content: center;
}
.nav__burger span {
  display: block; position: relative; width: 18px; height: 2px;
  background: var(--ink); border-radius: 1px;
  transition: transform .25s var(--ease), opacity .2s var(--ease);
}
.nav__burger span::before, .nav__burger span::after {
  content: ""; position: absolute; left: 0; width: 18px; height: 2px;
  background: var(--ink); border-radius: 1px;
  transition: transform .25s var(--ease);
}
.nav__burger span::before { top: -6px; }
.nav__burger span::after  { top: 6px; }
.nav__burger[aria-expanded="true"] span { background: transparent; }
.nav__burger[aria-expanded="true"] span::before { transform: translateY(6px) rotate(45deg); }
.nav__burger[aria-expanded="true"] span::after  { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 900px) {
  html.js .nav__burger { display: inline-flex; }
  
  html.js .nav__panel {
    display: none;
    position: absolute; inset: 100% 0 auto 0;
    min-height: 80vh;
    background: var(--bg); border-bottom: 1px solid var(--line);
    padding: 16px var(--gutter) 24px;
    flex-direction: column; align-items: stretch; gap: 8px;
    box-shadow: var(--shadow-card);
  }
  html.js .nav__panel[data-open="true"] { display: flex; }
  .nav__links { flex-direction: column; align-items: stretch; gap: 2px; margin: 0; }
  .nav__link { padding: 14px 14px; font-size: var(--fs-h6); }
  .nav__actions { flex-direction: column; align-items: stretch; gap: 8px; margin-top: 8px; }
  .nav__actions .btn { width: 100%; }
  
  html:not(.js) .nav { position: static; }
  html:not(.js) .nav__bar { flex-wrap: wrap; row-gap: 12px; }
  html:not(.js) .nav__panel {
    display: flex; width: 100%; flex-direction: column; align-items: stretch; gap: 10px;
  }
  html:not(.js) .nav__links {
    margin: 0; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; gap: 2px;
  }
  html:not(.js) .nav__link { padding: 8px 12px; font-size: var(--fs-sm); }
  html:not(.js) .nav__actions { flex-direction: row; margin: 0; }
  html:not(.js) .nav__actions .btn { width: auto; }
}

.hero {
  padding-top: clamp(88px, 10vw, 136px);
  padding-bottom: clamp(48px, 5vw, 72px);
  background-image: url('../images/lab/bg-hero.webp');
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
}
.hero__container { max-width: var(--container); }

.hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 39fr) minmax(0, 61fr);
  gap: clamp(24px, 3vw, 48px);
  align-items: center;
}

.hero__col { display: flex; flex-direction: column; align-items: flex-start; }

.eyebrow--bar {
  display: block; border: 0; background: none; padding: 0 0 0 14px;
  border-left: 3px solid var(--accent);   
  border-radius: 0;
  font-size: var(--fs-xs); font-weight: var(--fw-ui);
  letter-spacing: var(--tracking-wide); text-transform: uppercase;
  color: var(--ink-muted);
  line-height: 1.35;
}
.eyebrow--bar::before { content: none; }

.hero__title {
  margin-top: clamp(20px, 2.4vw, 34px);
  font-size: clamp(2.5rem, 1.0rem + 5.6vw, 5.5rem);
  line-height: 1.0;
  font-weight: 600;                 
  letter-spacing: -.038em;
  text-wrap: balance;
}

.hero__title-accent {
  
  color: var(--accent);
  background: none;
  -webkit-text-fill-color: var(--accent);
}
@supports not (background-clip: text) {
  .hero__title-accent { -webkit-text-fill-color: currentColor; background: none; }
}

.hero__lead {
  margin-top: clamp(18px, 2vw, 26px);
  font-size: var(--fs-lg); line-height: 1.55;
  max-width: 30rem;
}

.hero__actions {
  display: flex; flex-wrap: wrap; gap: 14px;
  margin-top: clamp(24px, 3vw, 38px);
}

.hero__actions .btn { padding: 13px 22px; font-size: var(--fs-base); }

.hero__stage {
  position: relative;
  width: 100%;
  aspect-ratio: 920 / 650;
  min-height: 420px;
  color: var(--ink);
}

.hero__wires {
  position: absolute; inset: 0; width: 100%; height: 100%;
  color: var(--line-strong); opacity: .55; pointer-events: none;
}

.hero__object {
  position: absolute;
  
  left: -34%; bottom: -12%; width: 100%; height: 134%;
  object-fit: contain;
  object-position: bottom center;
  pointer-events: none;
  z-index: 0;
}

.gcard {
  position: absolute;
  background: color-mix(in srgb, var(--surface-2) 72%, transparent);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  padding: 14px 16px;
  display: flex; flex-direction: column; gap: 7px;
}
.gcard__head { display: flex; align-items: center; gap: 8px; }
.gcard__icon {
  flex: none; width: 24px; height: 24px; display: grid; place-items: center;
  border-radius: var(--r-xs); background: var(--field); color: var(--ink-muted);
}
.gcard__title { font-size: var(--fs-sm); font-weight: var(--fw-ui); color: var(--ink); }
.gcard__tag {
  margin-left: auto; flex: none;
  font-size: .625rem; font-weight: var(--fw-ui); letter-spacing: .06em;
  text-transform: uppercase; color: var(--ink-faint);
  border: 1px solid var(--line); border-radius: var(--r-xs); padding: 3px 8px;
}
.gcard__k    { font-size: var(--fs-xs); color: var(--ink-faint); }
.gcard__v    { font-size: var(--fs-base); font-weight: var(--fw-ui); color: var(--ink); }
.gcard__v--accent { color: var(--accent-ink); }   
.gcard__note { font-size: var(--fs-xs); color: var(--ink-faint); }
.gcard__bar  { height: 4px; border-radius: 999px; background: var(--line); overflow: hidden; }
.gcard__bar > span { display: block; width: 72%; height: 100%; background: var(--accent); }  
.gcard__check {
  display: flex; align-items: center; gap: 7px;
  font-size: var(--fs-xs); color: var(--ink-muted);
  background: var(--field); border-radius: var(--r-xs); padding: 7px 10px;
}
.gcard__btn {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin-top: 2px; padding: 9px 12px;
  border: 1px solid var(--line); border-radius: var(--r-sm);
  background: var(--surface-2);
  font-size: var(--fs-xs); font-weight: var(--fw-ui); color: var(--ink);
}
.gcard__metrics {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px;
  margin-top: 2px;
}
.gcard__metrics > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.gcard__metrics b {
  font-size: clamp(1.125rem, .6rem + 1.1vw, 1.625rem);
  font-weight: var(--fw-title); line-height: 1.05; letter-spacing: -.03em;
  font-variant-numeric: tabular-nums;
}
.gcard__metrics span { font-size: var(--fs-xs); color: var(--ink-faint); line-height: 1.25; }
.gcard__spark { width: 100%; height: 34px; color: var(--accent); margin-top: 2px; }

.gcard--overview { left: 49%;   top:  1%;  width: 51%; }
.gcard--intake   { left: 34.2%; top: 27%;  width: 25%; }
.gcard--slot     { left: 62.5%; top: 37%;  width: 25%; }
.gcard--note     { left: 35.3%; top: 58%;  width: 26%; }
.gcard--workflow { left: 64.5%; top: 74%;  width: 31%; }

.gbadge {
  position: absolute; left: 0; top: 82%; width: 27%;
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px 10px 10px;
  background: color-mix(in srgb, var(--surface-2) 72%, transparent);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border: 1px solid var(--line); border-radius: 999px;
  box-shadow: var(--shadow-card);
}
.gbadge__tile {
  flex: none; width: 34px; height: 34px; display: grid; place-items: center;
  border-radius: 50%; background: var(--signal); color: var(--on-signal);
}
.gbadge__text { display: flex; flex-direction: column; min-width: 0; font-size: var(--fs-xs); color: var(--ink-faint); line-height: 1.3; }
.gbadge__text b { font-size: var(--fs-sm); font-weight: var(--fw-ui); color: var(--ink); }

.hero__bar {
  margin-top: clamp(32px, 4vw, 56px);
  background: var(--signal); color: var(--on-signal);
  border-radius: var(--r-xl);
  padding: 20px clamp(20px, 2.2vw, 30px);
  display: flex; align-items: center; gap: clamp(18px, 2vw, 32px);
  flex-wrap: wrap;
}
.hero__bar-list {
  list-style: none; margin: 0; padding: 0;
  flex: 1 1 0; min-width: 0;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(12px, 1.4vw, 20px);
}
.hero__bar-list > li {
  display: flex; align-items: center; gap: 12px; min-width: 0;
  padding-left: clamp(12px, 1.4vw, 20px);
  border-left: 1px solid rgba(255,255,255,.16);
}
.hero__bar-list > li:first-child { padding-left: 0; border-left: 0; }
.hero__bar-tile {
  flex: none; width: 34px; height: 34px; display: grid; place-items: center;
  border-radius: 50%; background: rgba(255,255,255,.09); color: #FFFFFF;
}
.hero__bar-text { display: flex; flex-direction: column; min-width: 0; font-size: var(--fs-xs); color: rgba(255,255,255,.72); line-height: 1.35; }
.hero__bar-text b { font-size: var(--fs-sm); font-weight: var(--fw-ui); color: #FFFFFF; }

.hero__bar-cta {
  flex: none; display: flex; align-items: center; gap: 14px;
  max-width: 190px;
  font-size: var(--fs-xs); line-height: 1.35; color: rgba(255,255,255,.86);
}

.hero__bar-go {
  flex: none; width: 40px; height: 40px; display: grid; place-items: center;
  border-radius: 50%; background: var(--accent); color: var(--on-accent);
  transition: transform .2s var(--ease);
}

.hero__bar-cta:hover .hero__bar-go { transform: rotate(-45deg); }

@media (max-width: 1100px) {
  .hero__bar { gap: 20px; }
  .hero__bar-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero__bar-list > li:nth-child(odd) { padding-left: 0; border-left: 0; }
  .hero__bar-cta { max-width: 200px; }
}
@media (max-width: 860px) {
  .hero__bar { flex-direction: column; align-items: stretch; gap: 18px; }
  .hero__bar-list { flex: 1 1 auto; width: 100%; }
  .hero__bar-cta {
    max-width: none; justify-content: space-between;
    padding-top: 16px; border-top: 1px solid rgba(255,255,255,.16);
    font-size: var(--fs-sm);
  }
}

@media (max-width: 991px) {
  .hero__grid { grid-template-columns: 1fr; gap: clamp(32px, 6vw, 56px); }
  .hero__stage {
    aspect-ratio: auto; min-height: 0;
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px;
  }
  .hero__wires, .hero__object { display: none; }
  .gcard, .gbadge { position: static; width: auto; }
  .gcard--overview { grid-column: 1 / -1; }
  .gbadge { grid-column: 1 / -1; border-radius: var(--r-lg); }
}

@media (max-width: 620px) {
  .hero { padding-top: clamp(56px, 14vw, 88px); }
  .hero__stage { grid-template-columns: 1fr; }
  .hero__bar { padding: 18px 16px; border-radius: var(--r-lg); }
  .hero__bar-list { grid-template-columns: 1fr; gap: 16px; }
  .hero__bar-list > li { padding-left: 0; border-left: 0; }
  .gcard__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero__actions .btn { width: 100%; }
  
  .hero__col, .hero__title, .hero__lead, .hero__actions { min-width: 0; }
  .hero__title { text-wrap: pretty; }
  .split-word { white-space: normal; }
}

.bento { display: grid; gap: 16px; grid-template-columns: 1fr .82fr; }
.bento__row { display: contents; }
.card {
  position: relative; overflow: hidden;
  border: 1px solid var(--line); border-radius: var(--r-lg);
  background: var(--surface);
  padding: clamp(22px, 2.4vw, 32px);
  display: flex; flex-direction: column; gap: 16px;
  box-shadow: var(--shadow-card);
  transition: border-color .25s var(--ease);
}
.card:hover { border-color: var(--line-strong); }

.card::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(90% 60% at var(--gx, 12%) 0%, var(--accent-glow), transparent 62%),
    radial-gradient(var(--line-strong) 1.4px, transparent 1.4px) 0 0 / var(--gs, 28px) var(--gs, 28px);
  opacity: .55;
}
.card > * { position: relative; }

.bento--top    { grid-template-columns: 1fr .82fr; }
.bento--bottom { grid-template-columns: .58fr 1fr; }

.card--a { min-height: 570px; --gx: 12%; --gs: 28px; }
.card--b { min-height: 570px; --gx: 88%; --gs: 22px; }
.card--c { min-height: 500px; --gx: 20%; --gs: 34px; }
.card--d { min-height: 500px; --gx: 76%; --gs: 26px; }

.card__icon {
  width: 64px; height: 64px; flex: none;
  display: grid; place-items: center;
  border: 1px solid var(--accent-line); border-radius: var(--r-sm);
  background: var(--accent-soft); color: var(--accent-text);
}
.card__icon svg { width: 30px; height: 30px; }
.card__title { font-size: var(--fs-h4); }
.card__text { font-size: var(--fs-base); }
.card__body { display: flex; flex-direction: column; gap: 12px; }
.card__figure { margin-top: auto; padding-top: 16px; }
.card__figure > .fig { width: 100%; height: auto; }
.card--b .card__figure > .fig, .card--c .card__figure > .fig { max-width: 380px; margin-inline: auto; }

.card__stage { position: relative; margin-top: auto; min-height: 300px; --bleed: 62px; }
.card__stage-core {
  position: absolute; inset: 50% auto auto 50%; transform: translate(-50%, -50%);
  width: 190px; height: 190px; display: grid; place-items: center;
}
.bubble {
  position: absolute; width: var(--bubble-w, 250px); z-index: 2;
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--surface-2); box-shadow: var(--shadow-card);
  padding: 10px 12px;
  display: flex; flex-direction: column; gap: 4px;
}
.bubble .mono { font-size: .625rem; letter-spacing: .06em; }
.bubble b { font-size: var(--fs-sm); font-weight: var(--fw-ui); color: var(--ink); }

.bubble--up-1   { top: 20px; }
.bubble--up-2   { top: 37px; }
.bubble--down-1 { bottom: 21px; }
.bubble--down-2 { bottom: 30px; }
.bubble--up-1, .bubble--down-1 { left:  calc(-1 * var(--bleed)); padding-left:  calc(var(--bleed) + 14px); }
.bubble--up-2, .bubble--down-2 { right: calc(-1 * var(--bleed)); padding-right: calc(var(--bleed) + 14px); }

.card__orbit {
  position: absolute; inset: auto 0 -50% 0; z-index: 0;
  width: min(515px, 100%); margin-inline: auto; pointer-events: none;
}
.card--d .card__body, .card--d .card__icon { z-index: 1; }

@media (max-width: 991px) {
  .card__stage { --bubble-w: 186px; --bleed: 38px; }
  .card__orbit { inset: auto 0 -39% 0; }
}
@media (max-width: 900px) {
  .bento--top, .bento--bottom { grid-template-columns: 1fr 1fr; }
  .card--a, .card--b { min-height: 480px; }
  .card--c, .card--d { min-height: 440px; }
  .card__icon { width: 52px; height: 52px; }
  .card__icon svg { width: 24px; height: 24px; }
}
@media (max-width: 620px) {
  .bento--top, .bento--bottom { grid-template-columns: 1fr; }
  .card--a, .card--b, .card--c, .card--d { min-height: 0; }
  
  .card__stage { min-height: 310px; --bubble-w: 152px; --bleed: 14px; }
  .bubble { padding: 8px 10px; }
  .bubble--up-1, .bubble--down-1 { padding-left:  calc(var(--bleed) + 10px); }
  .bubble--up-2, .bubble--down-2 { padding-right: calc(var(--bleed) + 10px); }
  .bubble--up-2   { top: 20px; }
  .bubble--down-1 { bottom: 40px; }
  .bubble--down-2 { bottom: 41px; }
  .card__orbit { inset: auto 0 -44% 0; }
}

.process__steps { display: flex; flex-direction: column; gap: 40px; max-width: 1272px; margin-inline: auto; }
.step {
  position: sticky; top: 84px;
  display: grid; grid-template-columns: 72px minmax(0, 430px) minmax(0, 443px);
  justify-content: space-between; gap: clamp(24px, 3vw, 48px); align-items: center;
  border: 1px solid var(--line); border-radius: var(--r-lg);
  background: var(--bg-alt);
  padding: clamp(24px, 4vw, 56px);
  box-shadow: var(--shadow-card);
  overflow: hidden;
}
.step__num {
  font-family: var(--font-mono); font-size: var(--fs-h3); font-weight: 300;
  color: var(--ink-faint); letter-spacing: -.02em; line-height: 1;
  text-align: center; align-self: center;
}
.step__copy { display: flex; flex-direction: column; gap: 14px; }
.step__list { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.step__list li { display: flex; gap: 10px; font-size: var(--fs-sm); color: var(--ink-muted); }
.step__list li::before { content: ""; flex: none; width: 6px; height: 6px; margin-top: .55em; border-radius: 1px; background: var(--signal); }
.step__figure {
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--field); padding: 22px 18px; overflow: hidden;
  min-height: 290px;
  display: grid; align-items: center; justify-items: stretch;
}
.step__figure > * { min-width: 0; }
.step__figure > .fig { width: 100%; height: auto; }

.flowcol { display: flex; gap: 18px; justify-content: space-between; }
.flowcol > div { display: flex; flex-direction: column; align-items: center; gap: 8px; flex: 1 1 0; min-width: 0; }
.flowbox {
  width: 100%; border: 1px solid var(--line); border-radius: var(--r-xs);
  background: var(--surface); padding: 8px 10px;
  display: flex; flex-direction: column; gap: 3px; text-align: center;
}
.flowbox .mono { font-size: .625rem; }
.flowbox b { font-size: var(--fs-xs); font-weight: var(--fw-ui); color: var(--ink); }
.flowarrow { color: var(--line-strong); }
.flowbadge {
  border: 1px solid var(--accent-line); background: var(--accent-soft);
  color: var(--accent-text); border-radius: var(--r-xs);
  padding: 5px 10px; font-size: var(--fs-xs); font-weight: var(--fw-ui);
  white-space: nowrap;
}
.searchbadge {
  align-self: center; display: inline-flex; align-items: center; gap: 8px;
  border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-xs);
  padding: 8px 14px; font-size: var(--fs-xs); color: var(--ink-muted);
  margin-bottom: 14px;
}
.searchbadge svg { color: var(--ink-faint); }

@media (max-width: 991px) {
  .step { grid-template-columns: 56px 1fr 1fr; padding: clamp(20px, 3vw, 32px); }
}
@media (max-width: 860px) {
  .step { grid-template-columns: 1fr; top: 76px; }
  .step__num { text-align: left; }
  .step__figure { order: -1; min-height: 0; }
  .step__figure .fig--square { max-width: 260px; margin-inline: auto; }
}

.step { transition: transform .5s var(--ease), opacity .5s var(--ease); }
.step.is-stacked { transform: scale(.88); opacity: .14; }

.spin { animation: spin 44s linear infinite; transform-origin: center; }
@keyframes spin { to { transform: rotate(360deg); } }

.datacard {
  flex: none; width: 176px; max-height: 74px;
  border: 1px solid var(--line); border-radius: var(--r-xs);
  background: var(--surface); padding: 9px 11px;
  display: flex; flex-direction: column; gap: 3px;
}
.datacard__k { font-family: var(--font-mono); font-size: .625rem; color: var(--ink-faint); letter-spacing: .06em; text-transform: uppercase; }
.datacard__v { font-size: var(--fs-xs); font-weight: var(--fw-ui); color: var(--ink); line-height: 1.3; }

.products { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; align-items: stretch; }
.product {
  position: relative; overflow: hidden;
  display: flex; flex-direction: column; gap: 32px;
  border: 1px solid var(--line); border-radius: var(--r-lg);
  background: var(--surface); padding: clamp(22px, 2.6vw, 32px);
  box-shadow: var(--shadow-card);
  transition: border-color .25s var(--ease);
}
.product:hover { border-color: var(--line-strong); }
.product > * { position: relative; }

.product--featured {
  background: var(--block-bg); border-color: transparent;
  --accent-text: var(--block-accent);
}
.product--featured .product__name,
.product--featured .product__anchor,
.product--featured .status { color: var(--block-ink); }
.product--featured .product__desc,
.product--featured .product__list li,
.product--featured .product__meta { color: var(--block-muted); }
.product--featured .product__rule { background: var(--block-line); }
.product--featured .status { border-color: var(--block-line); }
.product--featured .product__list li { font-size: var(--fs-base); }
.product--featured .btn--ghost { background: var(--block-ink); color: var(--block-bg); border-color: transparent; }

.product__head { display: flex; flex-direction: column-reverse; align-items: flex-start; gap: 14px; }
.product__name { font-size: var(--fs-h4); }

.product__anchor {
  font-family: var(--font-mono); font-size: clamp(1.75rem, 1.2rem + 1.6vw, 2.5rem);
  font-weight: 300; line-height: 1; letter-spacing: -.03em; color: var(--ink);
}
.product__anchor small { display: block; font-size: var(--fs-xs); letter-spacing: .08em; color: var(--ink-faint); margin-top: 8px; text-transform: uppercase; }
.product--featured .product__anchor small { color: var(--block-muted); }

.status {
  display: inline-flex; align-items: center; gap: 6px; flex: none;
  padding: 5px 10px; border-radius: var(--r-xs);
  border: 1px solid var(--line-strong);
  font-size: .6875rem; font-weight: var(--fw-ui); letter-spacing: .08em; text-transform: uppercase;
  color: var(--ink-muted); white-space: nowrap;
}
.status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }

.status--live { color: var(--accent-text); border-color: var(--accent-line); background: var(--accent-soft); }
.product--featured .status--live { color: var(--block-accent); border-color: var(--block-line); background: transparent; }

.product__desc { font-size: var(--fs-base); }
.product__rule { height: 1px; background: var(--line); border: 0; margin: 0; }
.product__list { display: flex; flex-direction: column; gap: 12px; }
.product__list li { display: flex; gap: 12px; font-size: var(--fs-sm); color: var(--ink-muted); align-items: flex-start; }
.product__list svg { flex: none; margin-top: .22em; color: var(--accent-text); }
.product__top { display: flex; flex-direction: column; gap: 20px; }
.product__foot { margin-top: auto; display: flex; flex-direction: column; gap: 12px; }
.product__meta { font-size: var(--fs-sm); color: var(--ink-faint); text-align: center; }

@media (max-width: 940px) { .products { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; } }

.faq__layout { display: grid; grid-template-columns: minmax(260px, 440px) 1fr; gap: clamp(32px, 5vw, 72px); align-items: start; }
.accordion { display: flex; flex-direction: column; gap: 16px; max-width: 760px; }
.acc {
  border: 1px solid var(--line-soft); border-radius: var(--r-md);
  background: transparent; overflow: hidden;
  transition: border-color .3s var(--ease), background-color .3s var(--ease);
}
.acc[open] { border-color: var(--line-strong); background: var(--surface); }
.acc__q {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 16px;
  padding: 24px clamp(18px, 2vw, 32px);
  font-size: var(--fs-h6); font-weight: var(--fw-ui); color: var(--ink);
  list-style: none;
}
.acc__q:hover { color: var(--accent-text); }
.acc__icon {
  flex: none; width: 24px; height: 24px; position: relative; margin-top: 2px;
  border: 1px solid var(--line-strong); border-radius: var(--r-xs);
  transition: transform .3s var(--ease), border-color .3s var(--ease), color .3s var(--ease);
}
.acc__icon::before, .acc__icon::after {
  content: ""; position: absolute; left: 50%; top: 50%; background: currentColor;
  transform: translate(-50%, -50%);
}
.acc__icon::before { width: 11px; height: 1.5px; }
.acc__icon::after  { width: 1.5px; height: 11px; }
.acc[open] .acc__icon { transform: rotate(45deg); border-color: var(--accent-line); color: var(--accent-text); }
.acc__a { padding: 0 clamp(18px, 2vw, 32px) 24px; }
.acc__a p { font-size: var(--fs-base); max-width: 68ch; padding-right: 32px; }

@supports selector(::details-content) {
  .acc::details-content {
    block-size: 0; overflow: hidden;
    transition: block-size .34s var(--ease), content-visibility .34s allow-discrete;
  }
  .acc[open]::details-content { block-size: auto; }
}

@media (max-width: 860px) { .faq__layout { grid-template-columns: 1fr; } }

.cta__banner {
  position: relative; overflow: hidden;
  width: 100%;
  border: 1px solid var(--line); border-radius: var(--r-xl);
  background: var(--bg-alt);
  display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 40px); align-items: stretch;
  padding: 4px 4px 4px clamp(24px, 4vw, 60px);
}

.cta__banner > * { position: relative; }
.cta__copy {
  display: flex; flex-direction: column; align-items: flex-start; gap: 20px;
  padding: clamp(32px, 4vw, 56px) 0;
}
.cta__copy h2 { line-height: 1.04; }
.cta__copy p { line-height: 1.4; }
.cta__actions { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 12px; }
.cta__note { font-size: var(--fs-sm); color: var(--ink-faint); }
.cta__figure {
  align-self: stretch; overflow: hidden;
  border-radius: var(--r-lg); background: var(--surface);
  display: grid; place-items: stretch; padding: 0;
}
.cta__figure > .fig { width: 100%; height: 100%; }

@media (max-width: 860px) {
  .cta__banner { grid-template-columns: 1fr; padding: 4px; }
  .cta__copy { order: 2; padding: clamp(24px, 5vw, 40px) clamp(16px, 4vw, 32px) clamp(28px, 5vw, 40px); }
  .cta__figure { order: 1; }
}

.footer { border-top: 1px solid var(--line); padding: clamp(48px, 6vw, 72px) var(--gutter) 32px; background: var(--bg-alt); }
.footer__inner { max-width: var(--container); margin-inline: auto; display: flex; flex-direction: column; gap: 32px; }
.footer__top { display: grid; grid-template-columns: minmax(240px, 370px) minmax(0, 585px); justify-content: space-between; gap: clamp(32px, 5vw, 64px); }
.footer__brand { display: flex; flex-direction: column; justify-content: space-between; gap: 24px; align-items: flex-start; }
.footer__claim { font-size: var(--fs-base); max-width: 42ch; }
.footer__social { display: flex; gap: 8px; }
.footer__social a {
  width: 34px; height: 34px; display: grid; place-items: center;
  border: 1px solid transparent; border-radius: var(--r-xs);
  background: var(--btn-ghost-bg);
  color: var(--ink-muted);
  transition: color .2s var(--ease), background-color .2s var(--ease);
}
.footer__social a:hover { color: var(--ink); background: var(--surface-2); }
.footer__cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.footer__col h2 { font-size: var(--fs-h6); font-weight: var(--fw-ui); letter-spacing: -.01em; color: var(--ink-faint); margin-bottom: 28px; }
.footer__col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 20px; }
.footer__col a { font-size: var(--fs-base); color: var(--ink-muted); text-decoration: none; transition: color .2s var(--ease); }
.footer__col a:hover { color: var(--ink); }
.footer__rule { height: 1px; background: var(--line); border: 0; margin: 0; }
.footer__legal { display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: space-between; font-size: var(--fs-sm); color: var(--ink-faint); }

.footer__legal-brand { display: inline-flex; align-items: baseline; flex-wrap: wrap; gap: 8px; color: var(--ink-muted); }
.footer__legal-brand b { font-weight: var(--fw-ui); color: var(--ink); letter-spacing: -.01em; }
.footer__legal-brand span {
  padding: 2px 8px; border-radius: var(--r-xs);
  border: 1px solid var(--accent-line); background: var(--accent-soft);
  color: var(--accent-text); font-size: var(--fs-xs); font-weight: var(--fw-ui);
  letter-spacing: .06em; text-transform: uppercase;
}

@media (max-width: 860px) { .footer__top { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .footer__cols { grid-template-columns: 1fr; gap: 28px; } }

.fig { color: var(--ink); }
.fig .fig-line   { stroke: var(--line-strong); fill: none; }
.fig .fig-grid   { stroke: var(--line); fill: none; }
.fig .fig-fill   { fill: var(--surface-2); }
.fig .fig-node   { fill: var(--ink-faint); }
.fig .fig-accent { stroke: var(--signal); fill: none; }
.fig .fig-accent-fill { fill: var(--signal); }
.fig .fig-soft   { fill: var(--accent-soft); }
.fig .fig-label  { fill: var(--ink-faint); font-family: var(--font-mono); font-size: 10px; letter-spacing: .04em; }
@media (max-width: 900px) { .fig--wide .fig-label { display: none; } }
.fig .fig-label--ink { fill: var(--ink-muted); }
.cta__figure .fig .fig-grid { stroke: var(--line); }

html.js [data-reveal] {
  opacity: 0;
  transform: translateY(56px);
  transition: opacity .9s var(--quart), transform .9s var(--quart);
  transition-delay: calc(var(--d, 0) * 180ms);
}
html.js [data-reveal].is-visible { opacity: 1; transform: none; }
html.js [data-reveal="pop"]   { transform: scale(.2); transform-origin: 50% 50%; }
html.js [data-reveal="left"]  { transform: translateX(-56px); }
html.js [data-reveal="right"] { transform: translateX(56px); }

@media (max-width: 479px) {
  .section-head--start { align-items: center; text-align: center; margin-inline: auto; }
  .cta__copy { align-items: center; text-align: center; }
  .cta__actions { justify-content: center; }
  .cta__actions .btn, .hero__actions .btn { width: 100%; }
  .footer__brand, .footer__legal { align-items: center; text-align: center; }
  .footer__brand { justify-content: flex-start; }
  .footer__legal { justify-content: center; }
  .footer__col { text-align: center; }
  .footer__col h2 { margin-bottom: 16px; }
  .footer__col ul { gap: 14px; }
  .eyebrow { font-size: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  html.js [data-reveal] { opacity: 1; transform: none; }
  html.js .hero__title .split-char { opacity: 1; transform: none; animation: none; }
  .spin { animation: none !important; }
  .step { position: static; }
  .step.is-stacked { transform: none; opacity: 1; }
}

@media print {
  .nav, .hero__floats,
  .cta__banner::before, .cta__banner::after,
  .hero::before, .hero::after,
  .product--featured::before, .product--featured::after { display: none; }
  body { background: #fff; color: #000; }
  .step { position: static; box-shadow: none; }
}

.section, .footer { scroll-margin-top: 84px; }
@media (max-width: 900px) { html { scroll-padding-top: 72px; } .section, .footer { scroll-margin-top: 72px; } }

.hero,
.wc,
.cta__banner,
.product--featured {
  position: relative;
  isolation: isolate;      
  overflow: hidden;
}

.hero::before,
.wc::before,
.cta__banner::before,
.product--featured::before {
  content: ""; position: absolute; inset: -6%; z-index: -2; pointer-events: none;
  background: var(--motif) center / cover no-repeat;
}

.hero::after,
.wc::after,
.cta__banner::after,
.product--featured::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  
  background:
    linear-gradient(var(--motif-scrim-used), var(--motif-scrim-used)),
    var(--motif-grain) 0 0 / 160px 160px repeat;
}

.hero,
.cta__banner {
  --motif-scrim-used: var(--motif-scrim);
  
  --ink-muted: #3A3A3A;
  --ink-faint: #444444;
}

.product--featured { --motif-scrim-used: var(--motif-scrim-inv); }

.hero              { --motif: url("../images/lab/bg-hero.webp"); }

.hero              { --motif-scrim-used: rgba(255,255,255,.10); }

.product--featured { --motif: url("../images/lab/bg2.jpg"); }

.cta__banner       { --motif: url("../images/lab/bg1.jpg"); }

.hero__stage .gcard__icon {
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  border-color: color-mix(in srgb, var(--accent) 22%, transparent);
}
.hero__stage .gcard__v--accent { color: var(--accent-ink); }
.hero__stage .gcard__bar { background: color-mix(in srgb, var(--accent) 16%, transparent); }
.hero__stage .gcard__bar > span { background: var(--accent); }

.hero__stage .gcard__btn svg { color: var(--accent); }
.hero__stage .gcard__link { color: var(--accent-ink); }

.hero__wires { color: color-mix(in srgb, var(--accent) 38%, transparent); }

.gbadge {
  background: color-mix(in srgb, #FFFFFF 55%, transparent);
  -webkit-backdrop-filter: blur(22px) saturate(140%);
  backdrop-filter: blur(22px) saturate(140%);
  border-color: rgba(255,255,255,.75);
  box-shadow: 0 2px 6px rgba(12,12,12,.05), 0 18px 40px rgba(12,12,12,.10);
}
.gbadge__icon, .gbadge > span:first-child {
  background: var(--accent);
  color: #FFFFFF;
}

.hero__stage .gcard {
  background: color-mix(in srgb, #FFFFFF 72%, transparent);
  -webkit-backdrop-filter: blur(18px) saturate(130%);
  backdrop-filter: blur(18px) saturate(130%);
  border-color: rgba(255,255,255,.7);
}

.hero { padding-bottom: clamp(24px, 2.4vw, 36px); }
.hero__bar { margin-top: clamp(18px, 2vw, 30px); }

.hero__stage { overflow: visible; }

.hero__bar { position: relative; z-index: 3; }
.hero__grid { position: relative; z-index: 1; }

.hero { padding-top: clamp(36px, 3.6vw, 62px); }

.hero__object { animation: objektEin 1.6s cubic-bezier(.22,.61,.36,1) .1s both; }
@keyframes objektEin { from { opacity: 0; } to { opacity: 1; } }

html.js .hero__stage[data-reveal] { opacity: 1; transform: none; }

.hero__stage .gcard,
.hero__stage .gbadge { animation: kartePopp .62s cubic-bezier(.22,1.02,.36,1) both; }
.hero__stage .gcard--overview { animation-delay: .45s; }
.hero__stage .gcard--intake   { animation-delay: .62s; }
.hero__stage .gcard--slot     { animation-delay: .79s; }
.hero__stage .gcard--note     { animation-delay: .96s; }
.hero__stage .gcard--workflow { animation-delay: 1.13s; }
.hero__stage .gbadge          { animation-delay: 1.30s; }
@keyframes kartePopp {
  from { opacity: 0; transform: translateY(16px) scale(.965); }
  to   { opacity: 1; transform: none; }
}

.hero__wires { animation: objektEin 1.1s ease 1.45s both; }

.gbadge {
  width: 40%;
  min-width: 300px;
  padding: 11px 22px 11px 11px;
  gap: 13px;
}
.gbadge__text { line-height: 1.35; }
.gbadge__text b { white-space: nowrap; }

@media (prefers-reduced-motion: reduce) {
  .hero__object, .hero__wires,
  .hero__stage .gcard, .hero__stage .gbadge { animation: none; }
}

html.js .hero__bar[data-reveal] { opacity: 1; transform: none; animation: none; }

.split-word { display: inline-block; white-space: nowrap; }
.split-char { display: inline-block; }
.split-char.is-hidden { opacity: 0; }

.is-typing .split-char.is-cursor { position: relative; }
.is-typing .split-char.is-cursor::after {
  content: ""; position: absolute;
  right: -.10em; top: .10em; bottom: .08em; width: .055em;
  background: var(--ink);
  animation: schreibmarke .75s steps(1, end) infinite;
}

.hero__title-accent .split-char.is-cursor::after { background: var(--accent); }
@keyframes schreibmarke { 50% { opacity: 0; } }

html.js .hero__title[data-reveal],
html.js .hero__lead[data-reveal] { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .split-char.is-hidden { opacity: 1; }
  .is-typing .split-char.is-cursor::after { display: none; }
}

.hero__title.is-typing .hero__title-accent {
  background: none;
  -webkit-text-fill-color: var(--accent);
  color: var(--accent);
}

.hero__object {
  left: 48%; bottom: 5%; width: 38%; height: 88%;
  opacity: .9;
  z-index: 0;
}
.hero__stage { position: relative; z-index: 2; }

.hero__stage {
  position: relative;
  aspect-ratio: 920 / 650;
  min-height: 430px;
  background: none; border: 0; box-shadow: none;
  -webkit-backdrop-filter: none; backdrop-filter: none;
  padding: 0; display: block;
  z-index: 2;
}

.hero__object {

  left: 36%; width: 54%; height: 114%;
  
  top: auto; bottom: -10%;
  transform: none;
  object-fit: contain;
  object-position: bottom center;
  opacity: 1;
  z-index: 0;
}

.flow__links { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; overflow: visible; }
.flow__link-base { color: color-mix(in srgb, var(--ink) 22%, transparent); }

html.js .flow__link-fill { stroke-dasharray: 200; stroke-dashoffset: 200; }
html.js .flow__link-fill.is-on { transition: stroke-dashoffset .55s ease-in-out; stroke-dashoffset: 0; }

.fcard {
  position: absolute; z-index: 2;
  display: flex; flex-direction: column; gap: 8px;
  padding: 12px 14px;
  border-radius: var(--r-md);
  background: color-mix(in srgb, #FFFFFF 82%, transparent);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
  backdrop-filter: blur(18px) saturate(135%);
  border: 1px solid rgba(255,255,255,.8);
  box-shadow: 0 1px 3px rgba(12,12,12,.05), 0 16px 40px rgba(12,12,12,.11);
}
.fcard--call   { left: 44%; top:  1%; width: 56%; }
.fcard--script { left: 28%; top: 27%; width: 55%; }
.fcard--sunda  { left: 45%; top: 52%; width: 55%; }
.fcard--reply  { left: 27%; top: 75%; width: 58%; }
.fcard--sunda {
  border-color: color-mix(in srgb, var(--accent) 38%, transparent);
  background: color-mix(in srgb, var(--accent) 8%, #FFFFFF 82%);
}

.fcard__head { display: flex; align-items: center; gap: 9px; }
.fcard__icon {
  display: grid; place-items: center; width: 26px; height: 26px; flex: none;
  border-radius: var(--r-xs);
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 11%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 22%, transparent);
}
.fcard__title { font-size: var(--fs-sm); font-weight: var(--fw-ui); color: var(--ink); }
.fcard__time  { margin-left: auto; font-family: var(--font-mono); font-size: .6875rem; color: var(--ink-faint); }
.fcard__sub   { font-size: var(--fs-xs); color: var(--ink-faint); }
.fcard__text  { font-size: var(--fs-sm); line-height: 1.45; color: var(--ink); min-height: 2.9em; }
.fcard__text--out { color: var(--ink-muted); }
.fcard__tags  { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.fcard__tags > li {
  font-size: var(--fs-xs); color: var(--accent-ink);
  border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  border-radius: var(--r-xs); padding: 4px 8px;
}

.fwave { display: flex; align-items: center; gap: 3px; height: 30px; }
.fwave > i { flex: 1; min-width: 2px; border-radius: 2px; background: var(--ink-faint); opacity: .3; height: 24%; }
.fwave > i:nth-child(3n)   { height: 58%; }
.fwave > i:nth-child(4n+1) { height: 84%; }
.fwave > i:nth-child(5n)   { height: 40%; }
html.js .fwave.is-live > i { background: var(--accent); opacity: 1; animation: fwave .85s ease-in-out infinite alternate; }
html.js .fwave--out.is-live > i { background: var(--ink); }
@keyframes fwave { from { transform: scaleY(.32); } to { transform: scaleY(1); } }

.flow__start {
  position: absolute; z-index: 3;
  left: 72%; top: 54%; transform: translate(-50%, -50%);
  white-space: nowrap;   
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 24px 14px 20px;
  border-radius: var(--r-sm);
  background: var(--accent); color: var(--on-accent);
  font-size: var(--fs-base); font-weight: var(--fw-ui);
  box-shadow: 0 2px 8px rgba(12,12,12,.12), 0 14px 34px color-mix(in srgb, var(--accent) 32%, transparent);
  transition: all .5s var(--quart);
}
.flow__start:hover { background: var(--accent-ink); }
.flow__start:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.flow__start-ring {
  position: absolute; inset: -5px; border-radius: inherit;
  border: 1px solid color-mix(in srgb, var(--accent) 55%, transparent);
  animation: flowRing 2.3s ease-out infinite;
}
@keyframes flowRing {
  0% { opacity: .9; transform: scale(1); }
  70%,100% { opacity: 0; transform: scale(1.10); }
}

html.js [data-flow].is-running .flow__start,
html.js [data-flow].is-done .flow__start {
  left: 0; top: auto; bottom: -2%; transform: none;
  padding: 8px 14px 8px 11px; font-size: var(--fs-xs);
  background: color-mix(in srgb, #FFFFFF 80%, transparent);
  color: var(--ink-muted); border: 1px solid var(--line);
  box-shadow: 0 8px 20px rgba(12,12,12,.08);
}
html.js [data-flow].is-running .flow__start-ring,
html.js [data-flow].is-done .flow__start-ring { display: none; }
html.js [data-flow].is-running .flow__start { opacity: .75; }

.flow__note {
  position: absolute; right: 0; bottom: -4%;
  font-size: var(--fs-xs); color: var(--ink-faint);
}

html.js [data-flow] .fcard { opacity: 0; transform: translateY(18px) scale(.97); pointer-events: none; }
html.js [data-flow] .fcard.is-in {
  opacity: 1; transform: none; pointer-events: auto;
  transition: opacity .5s var(--quart), transform .5s var(--quart);
}

html.js [data-flow] .fcard--call { transform: translateY(20px) scale(.965); }
html.js [data-flow] .fcard--call.is-in { transition: opacity .5s var(--quart), transform .5s var(--quart); }
html.js [data-flow] .fcard.is-active {
  border-color: color-mix(in srgb, var(--accent) 48%, transparent);
  box-shadow: 0 1px 3px rgba(12,12,12,.05), 0 16px 40px rgba(12,12,12,.11),
              0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent);
}
html.js [data-flow] .fcard__tags > li { opacity: 0; transform: translateY(4px); }
html.js [data-flow] .fcard__tags > li.is-in { opacity: 1; transform: none; transition: opacity .3s ease, transform .3s ease; }

@media (prefers-reduced-motion: reduce) {
  .flow__start-ring, html.js .fwave.is-live > i { animation: none; }
  html.js [data-flow] .fcard { opacity: 1; transform: none; pointer-events: auto; }
  html.js [data-flow] .fcard__tags > li { opacity: 1; transform: none; }
  html.js .flow__link-fill { stroke-dashoffset: 0; }
}

.hero__col { position: relative; z-index: 2; }

html.js [data-flow] .flow__links { opacity: 0; transition: opacity .4s ease; }
html.js [data-flow].is-running .flow__links,
html.js [data-flow].is-done .flow__links { opacity: 1; }

html.js [data-flow].is-running .flow__start,
html.js [data-flow].is-done .flow__start {
  
  left: auto; right: 0; top: -6%; bottom: auto;
}

.flow__note { right: auto; left: 0; bottom: auto; top: -5%; }

.flow__note { display: inline-flex; align-items: center; gap: 12px; }
.flow__mute {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: var(--fs-xs); color: var(--ink-muted);
  border: 1px solid var(--line); border-radius: var(--r-xs);
  padding: 3px 8px; background: color-mix(in srgb, #FFFFFF 70%, transparent);
}
.flow__mute:hover { color: var(--ink); border-color: var(--line-strong); }
.flow__mute:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.flow__mute[aria-pressed="true"] { color: var(--ink-faint); }

.flow__start {
  position: absolute;
  border-radius: 999px;
  padding: 17px 34px 17px 30px;
  color: #FFFFFF;
  font-size: 1.0625rem;
  font-weight: var(--fw-ui);
  letter-spacing: -.01em;
  background: transparent;
  isolation: isolate;
  overflow: hidden;
  border: 5px solid #FFFFFF;               
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--accent) 22%, transparent),
    0 6px 18px color-mix(in srgb, var(--accent) 26%, transparent),
    0 22px 55px color-mix(in srgb, var(--accent) 30%, transparent),
    0 2px 6px rgba(12,12,12,.08);
  transition: transform .35s var(--quart), box-shadow .35s var(--quart);
}

.flow__start::before {
  content: ""; position: absolute; inset: -2px; z-index: -2;
  border-radius: inherit;
  background:
    radial-gradient(62% 90% at 22% 28%, #7C82FF 0%, transparent 62%),
    radial-gradient(52% 82% at 82% 18%, #2E33B4 0%, transparent 58%),
    radial-gradient(74% 104% at 62% 92%, #AEB4FF 0%, transparent 58%),
    linear-gradient(104deg, #4A50D2 0%, #5F55E4 38%, #7F85F2 66%, #4A50D2 100%);
  background-size: 200% 200%, 230% 230%, 250% 250%, 320% 100%;
  animation: knopfFluss 11s ease-in-out infinite alternate;
}
@keyframes knopfFluss {
  0%   { background-position:   0% 50%, 100%  0%,  50% 100%,   0% 50%; }
  50%  { background-position:  64% 18%,  28% 62%,  18%  38%, 100% 50%; }
  100% { background-position: 100% 82%,   0% 98%,  84%   4%,   0% 50%; }
}

.flow__start::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  border-radius: inherit;
  background: radial-gradient(120% 54% at 50% 124%, rgba(255,255,255,.92) 0%, rgba(255,255,255,0) 55%);
  opacity: .55;
}

.flow__start-ring {
  position: absolute; inset: -14px; border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent);
  animation: knopfAtem 3s cubic-bezier(.4,0,.2,1) infinite;
  pointer-events: none;
}
@keyframes knopfAtem {
  0%   { opacity: .8; transform: scale(.96); }
  70%  { opacity: 0;  transform: scale(1.10); }
  100% { opacity: 0;  transform: scale(1.10); }
}

.flow__start:hover {
  transform: translate(-50%, -50%) scale(1.035);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent),
    0 8px 22px color-mix(in srgb, var(--accent) 34%, transparent),
    0 30px 70px color-mix(in srgb, var(--accent) 38%, transparent),
    0 2px 6px rgba(12,12,12,.10);
}

.flow__start:active { transform: translate(-50%, -50%) scale(.99); }
.flow__start:focus-visible { outline: 2px solid var(--ink); outline-offset: 6px; }
.flow__start svg { position: relative; z-index: 1; }
.flow__start > span:not(.flow__start-ring) { position: relative; z-index: 1; }

html.js [data-flow].is-running .flow__start,
html.js [data-flow].is-done .flow__start {
  border-width: 1px; border-color: var(--line);
  padding: 8px 14px 8px 11px; font-size: var(--fs-xs);
  color: var(--ink-muted);
  box-shadow: 0 8px 20px rgba(12,12,12,.08);
  transform: none;
}
html.js [data-flow].is-running .flow__start::before,
html.js [data-flow].is-done .flow__start::before { animation: none; opacity: 0; }
html.js [data-flow].is-running .flow__start::after,
html.js [data-flow].is-done .flow__start::after { opacity: 0; }
html.js [data-flow].is-running .flow__start { background: color-mix(in srgb, #FFFFFF 80%, transparent); }
html.js [data-flow].is-done .flow__start    { background: color-mix(in srgb, #FFFFFF 80%, transparent); }
html.js [data-flow].is-done .flow__start:hover { transform: none; color: var(--ink); }

@media (prefers-reduced-motion: reduce) {
  .flow__start::before, .flow__start-ring { animation: none; }
  .flow__start:hover { transform: translate(-50%, -50%); }
}

html.js .fwave.is-analyzed > i {
  animation: none;
  transform-origin: center;
  transition: transform .07s linear;
}

.fwave {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1.5px; height: 34px; width: 100%;
}
.fwave > i {
  flex: 1 1 0; min-width: 0; width: auto;
  height: 100%;
  border-radius: 1px;
  background: color-mix(in srgb, var(--ink) 26%, transparent);
  opacity: 1;
  transform: scaleY(.16);
  transform-origin: center;      
}

.fwave > i:nth-child(2n)   { transform: scaleY(.26); }
.fwave > i:nth-child(3n)   { transform: scaleY(.40); }
.fwave > i:nth-child(5n)   { transform: scaleY(.20); }
.fwave > i:nth-child(7n)   { transform: scaleY(.52); }
.fwave > i:nth-child(11n)  { transform: scaleY(.33); }
.fwave > i:nth-child(13n)  { transform: scaleY(.62); }

html.js .fwave.is-live > i        { background: color-mix(in srgb, var(--ink) 42%, transparent); }
html.js .fwave--out.is-live > i   { background: color-mix(in srgb, var(--accent) 52%, transparent); }
html.js .fwave.is-analyzed > i    { animation: none; transition: transform .06s linear; }

html.js .fwave.is-live:not(.is-analyzed) > i {
  animation: fwave 1.1s ease-in-out infinite alternate;
}
@keyframes fwave { from { transform: scaleY(.18); } to { transform: scaleY(.92); } }

html.js [data-flow] .flow__link-dots { opacity: 0; transition: opacity .5s ease .3s; }
html.js [data-flow].is-running .flow__link-dots,
html.js [data-flow].is-done .flow__link-dots { opacity: .85; }
.flow__link-base { color: color-mix(in srgb, var(--ink) 16%, transparent); }

.fwave { display: flex; align-items: center; justify-content: space-between; gap: 0; height: 32px; }
.fwave > i {
  flex: 0 0 1.5px; width: 1.5px; min-width: 0;
  height: 100%;
  border-radius: .75px;
  background: color-mix(in srgb, var(--ink) 30%, transparent);
  transform: scaleY(.10);
  transform-origin: center;
}

.fwave > i:nth-child(2n){transform:scaleY(.16)} .fwave > i:nth-child(3n){transform:scaleY(.28)}
.fwave > i:nth-child(5n){transform:scaleY(.12)} .fwave > i:nth-child(7n){transform:scaleY(.38)}
.fwave > i:nth-child(11n){transform:scaleY(.22)} .fwave > i:nth-child(13n){transform:scaleY(.46)}
.fwave > i:nth-child(17n){transform:scaleY(.34)} .fwave > i:nth-child(19n){transform:scaleY(.55)}

html.js .fwave.is-live > i      { background: color-mix(in srgb, var(--ink) 46%, transparent); }
html.js .fwave--out.is-live > i { background: color-mix(in srgb, var(--accent) 58%, transparent); }

html.js .fwave.is-analyzed > i  { animation: none; transition: none; }

.hero__lead { hyphens: manual; }

.fwave > i {
  transform: scaleY(calc(.08 + var(--p, .2) * .92));
  background: color-mix(in srgb, var(--ink) 18%, transparent);
  transition: background-color .12s linear;
}

html.js .fwave.is-live > i { background: color-mix(in srgb, var(--ink) 18%, transparent); }

html.js .fwave > i.is-played { background: var(--accent); }

html.js .fwave > i.is-head {
  transform: scaleY(calc(.20 + var(--p, .2) * 1.0));
  background: var(--accent);
}

html.js .fwave.is-live > i,
html.js .fwave.is-analyzed > i { animation: none !important; }

html.js [data-flow] .flow__links { opacity: 1; }
html.js [data-flow] .flow__conn  { opacity: 0; transition: opacity .35s ease; }
html.js [data-flow] .flow__conn.is-in { opacity: 1; }

.flow__puls {
  position: absolute; left: 72%; top: 54%;
  width: 190px; height: 62px; transform: translate(-50%, -50%);
  border-radius: 999px; border: 1.5px solid var(--accent);
  opacity: 0; pointer-events: none; z-index: 3;
}
html.js [data-flow].is-connecting .flow__puls {
  animation: verbindePuls .6s cubic-bezier(.2,.7,.3,1) 1;
}
@keyframes verbindePuls {
  0%   { opacity: .85; transform: translate(-50%,-50%) scale(1); }
  100% { opacity: 0;   transform: translate(-50%,-50%) scale(1.9); }
}

.flow__ctrl {
  position: absolute; right: 0; top: -6%; z-index: 4;
  display: flex; gap: 6px;
  opacity: 0; pointer-events: none;
  transition: opacity .3s ease;
}
html.js [data-flow].is-running .flow__ctrl,
html.js [data-flow].is-paused  .flow__ctrl { opacity: 1; pointer-events: auto; }
.flow__ctrl-btn {
  display: grid; place-items: center; width: 30px; height: 30px;
  border-radius: var(--r-sm);
  color: var(--ink-muted);
  background: color-mix(in srgb, #FFFFFF 82%, transparent);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border: 1px solid var(--line);
  box-shadow: 0 6px 16px rgba(12,12,12,.07);
}
.flow__ctrl-btn:hover { color: var(--ink); border-color: var(--line-strong); }
.flow__ctrl-btn:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }

.flow__ctrl-btn .ic-play { display: none; }
html.js [data-flow].is-paused .flow__ctrl-btn .ic-play  { display: block; }
html.js [data-flow].is-paused .flow__ctrl-btn .ic-pause { display: none; }

html.js [data-flow].is-paused .fwave > i.is-head { opacity: .5; }

.flow__start {
  width: 132px; height: 132px;
  padding: 0;
  border: 6px solid #FFFFFF;
  border-radius: 50%;
  overflow: visible;
  display: grid; place-items: center; gap: 0;
  font-size: 0;                      
}

.flow__start::before {
  border-radius: 46% 54% 52% 48% / 48% 46% 54% 52%;
  animation: knopfFluss 11s ease-in-out infinite alternate,
             knopfBlob 9s ease-in-out infinite;
}
@keyframes knopfBlob {
  0%   { border-radius: 46% 54% 52% 48% / 48% 46% 54% 52%; transform: rotate(0deg)   scale(1); }
  25%  { border-radius: 58% 42% 44% 56% / 56% 58% 42% 44%; transform: rotate(3deg)   scale(1.04); }
  50%  { border-radius: 42% 58% 60% 40% / 44% 52% 48% 56%; transform: rotate(-2deg)  scale(1.02); }
  75%  { border-radius: 55% 45% 40% 60% / 52% 44% 56% 48%; transform: rotate(2deg)   scale(1.05); }
  100% { border-radius: 46% 54% 52% 48% / 48% 46% 54% 52%; transform: rotate(0deg)   scale(1); }
}
.flow__start::after { border-radius: 50%; }
.flow__start svg { width: 26px; height: 26px; }

.flow__start > span[data-start-text] {
  position: absolute; left: 50%; top: calc(100% + 14px);
  transform: translateX(-50%);
  font-size: var(--fs-sm); font-weight: var(--fw-ui);
  color: var(--ink); white-space: nowrap;
}
.flow__start-ring { inset: -16px; border-radius: 50%; }

html.js [data-flow].is-running .flow__start,
html.js [data-flow].is-paused  .flow__start {
  opacity: 0; pointer-events: none;
}
html.js [data-flow].is-done .flow__ctrl { opacity: 0; pointer-events: none; }

html.js [data-flow].is-done .flow__start {
  width: auto; height: auto; border-radius: var(--r-sm);
  font-size: var(--fs-xs); border-width: 1px;
  padding: 8px 14px 8px 11px;
  display: inline-flex; align-items: center; gap: 8px;
  opacity: 1; pointer-events: auto;
}
html.js [data-flow].is-done .flow__start > span[data-start-text] {
  position: static; transform: none; font-size: var(--fs-xs); color: inherit;
}
html.js [data-flow].is-done .flow__start svg { width: 14px; height: 14px; }

.flow__start {
  animation: knopfForm 9s ease-in-out infinite;
}
.flow__start::before { inset: -8px; }
@keyframes knopfForm {
  0%   { border-radius: 50% 50% 50% 50% / 50% 50% 50% 50%; }
  25%  { border-radius: 57% 43% 46% 54% / 54% 57% 43% 46%; }
  50%  { border-radius: 44% 56% 58% 42% / 46% 51% 49% 54%; }
  75%  { border-radius: 54% 46% 42% 58% / 52% 45% 55% 48%; }
  100% { border-radius: 50% 50% 50% 50% / 50% 50% 50% 50%; }
}

html.js [data-flow].is-done .flow__start,
html.js [data-flow].is-running .flow__start { animation: none; }

.flow__start {
  --zx: 0px; --zy: 0px; --zs: 1;
  --ox: 50%; --oy: 50%;
  transform-origin: var(--ox) var(--oy);
  transform: translate(-50%, -50%) translate(var(--zx), var(--zy)) scale(var(--zs));
  
  transition: box-shadow .35s var(--quart);
}

.flow__start::before {
  transform: translate(calc(var(--zx) * .55), calc(var(--zy) * .55));
  transition: transform .75s cubic-bezier(.18,.9,.24,1);
}

.hero__stage {
  position: relative;
  aspect-ratio: 920 / 700;
  min-height: 460px;
  background: none; border: 0; box-shadow: none;
  -webkit-backdrop-filter: none; backdrop-filter: none;
  padding: 0; display: block; overflow: visible;
  z-index: 2;
}
.hero__col { position: relative; z-index: 3; }

.hero__object {
  position: absolute;
  left: 26%; width: 56%; height: 116%;
  top: auto; bottom: -8%;
  object-fit: contain; object-position: bottom center;
  opacity: 1; z-index: 0;
  transition: transform .55s cubic-bezier(.22,.72,.24,1);
}

html.js .hero__grid.is-demo .hero__object { transform: translate(-7%, 4%) scale(.88); }

.orbit {
  position: absolute; left: 50%; top: 50%;
  width: 86%; aspect-ratio: 1; transform: translate(-50%,-50%) rotate(-14deg);
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--accent) 16%, transparent);
  pointer-events: none; z-index: 0;
  transition: opacity .5s ease;
}
html.js [data-flow].is-running .orbit,
html.js [data-flow].is-done .orbit,
html.js [data-flow].is-paused .orbit { opacity: 0; }

.trigger {
  position: absolute; left: 63%; top: 56%;
  transform: translate(-50%, -50%);
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  z-index: 3;
  transition: opacity .34s ease, transform .44s cubic-bezier(.22,.72,.24,1);
}
.trigger__btn {
  --zx: 0px; --zy: 0px; --zs: 1; --ox: 50%; --oy: 50%;
  position: relative;
  width: 80px; height: 80px; padding: 0;
  display: grid; place-items: center;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.8);
  background: color-mix(in srgb, #FFFFFF 42%, transparent);
  -webkit-backdrop-filter: blur(10px) saturate(130%);
  backdrop-filter: blur(10px) saturate(130%);
  box-shadow:
    0 1px 2px rgba(12,12,12,.05),
    0 12px 30px rgba(12,12,12,.09),
    0 0 0 6px color-mix(in srgb, var(--accent) 6%, transparent);
  transform-origin: var(--ox) var(--oy);
  transform: translate(var(--zx), var(--zy)) scale(var(--zs));
}
.trigger__core {
  display: grid; place-items: center;
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--accent); color: #FFFFFF;
  box-shadow: 0 4px 12px color-mix(in srgb, var(--accent) 34%, transparent);
  transition: transform .3s var(--quart);
}
.trigger__btn:hover .trigger__core { transform: scale(1.06); }
.trigger__btn:focus-visible { outline: 2px solid var(--ink); outline-offset: 5px; }
.trigger__label {
  font-size: var(--fs-sm); font-weight: var(--fw-ui);
  color: var(--ink-muted); white-space: nowrap;
}

.hero__siegel {
  position: absolute; z-index: 3;
  right: 0; top: 50%; transform: translateY(-50%);
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; align-items: flex-end; gap: 10px;
  transition: opacity .34s ease, transform .44s cubic-bezier(.22,.72,.24,1);
}
.hero__siegel li {
  display: grid; grid-template-columns: 46px minmax(0, 1fr);
  align-items: stretch;
  width: 218px; min-height: 46px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.8);
  background: color-mix(in srgb, #FFFFFF 42%, transparent);
  -webkit-backdrop-filter: blur(10px) saturate(130%);
  backdrop-filter: blur(10px) saturate(130%);
  box-shadow:
    0 1px 2px rgba(12,12,12,.05),
    0 10px 26px rgba(12,12,12,.08);
  
  overflow: hidden;
}
.hero__siegel-fahne {
  position: relative; display: block;
  box-shadow: 1px 0 0 rgba(12,12,12,.10);
}
.hero__siegel-fahne svg {
  position: absolute; inset: 0;
  width: 100%; height: 100%; display: block;
}
.hero__siegel-text {
  display: flex; align-items: center;
  padding-inline: 14px;
  font-size: 13px; font-weight: var(--fw-ui); color: var(--ink);
  white-space: nowrap;
}

html.js [data-flow].is-connecting .trigger { opacity: 0; transform: translate(-50%,-56%) scale(.94); }
html.js [data-flow].is-connecting .hero__siegel { opacity: 0; transform: translateY(-50%) translateX(8px); }
html.js [data-flow].is-running .trigger,
html.js [data-flow].is-paused  .trigger,
html.js [data-flow].is-done    .trigger,
html.js [data-flow].is-running .hero__siegel,
html.js [data-flow].is-paused  .hero__siegel,
html.js [data-flow].is-done    .hero__siegel { opacity: 0; pointer-events: none; }

@media (max-width: 1179px) { .hero__siegel { display: none; } }

.demo {
  position: absolute; right: 0; top: 0;
  width: min(430px, 82%);
  display: flex; flex-direction: column; gap: 14px;
  z-index: 2;
}
html.js .demo { opacity: 0; pointer-events: none; }
html.js [data-flow].is-running .demo,
html.js [data-flow].is-paused  .demo,
html.js [data-flow].is-done    .demo { opacity: 1; pointer-events: auto; }

.demo__status {
  display: flex; align-items: center; gap: 9px;
  font-size: var(--fs-xs); color: var(--ink-muted);
  padding: 0 2px 2px;
}
.demo__dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent);
}
.demo__time { margin-left: auto; font-family: var(--font-mono); font-size: .6875rem; color: var(--ink-faint); }
.demo__ctrl { display: flex; gap: 4px; }
.demo__btn {
  display: grid; place-items: center; width: 22px; height: 22px;
  border-radius: 4px; color: var(--ink-faint);
  border: 1px solid var(--line);
  background: color-mix(in srgb, #FFFFFF 70%, transparent);
}
.demo__btn:hover { color: var(--ink); }
.demo__btn:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.demo__btn .ic-play { display: none; }
html.js [data-flow].is-paused .demo__btn .ic-play  { display: block; }
html.js [data-flow].is-paused .demo__btn .ic-pause { display: none; }

.demo__list { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; list-style: none; }
.dcard {
  position: relative;
  display: flex; flex-direction: column; gap: 9px;
  padding: 15px 17px;
  border-radius: var(--r-md);
  background: color-mix(in srgb, #FFFFFF 88%, transparent);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border: 1px solid var(--line);
  box-shadow: 0 1px 2px rgba(12,12,12,.04), 0 8px 22px rgba(12,12,12,.05);
}

.dcard + .dcard::before {
  content: ""; position: absolute; left: 26px; top: -14px; height: 14px;
  border-left: 1px solid var(--line-strong);
}
html.js .dcard.is-in + .dcard.is-in::before { border-color: color-mix(in srgb, var(--accent) 55%, transparent); }

.dcard--key {
  background: color-mix(in srgb, var(--accent) 5%, #FFFFFF 90%);
  border-color: color-mix(in srgb, var(--accent) 26%, transparent);
}
.dcard__head { display: flex; align-items: center; gap: 9px; }
.dcard__icon {
  display: grid; place-items: center; width: 24px; height: 24px; flex: none;
  border-radius: 5px; color: var(--ink-muted);
  background: color-mix(in srgb, var(--ink) 5%, transparent);
  border: 1px solid var(--line);
}
.dcard--key .dcard__icon { color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); border-color: color-mix(in srgb, var(--accent) 22%, transparent); }
.dcard__title { font-size: var(--fs-sm); font-weight: var(--fw-ui); color: var(--ink); }
.dcard__sub   { font-size: var(--fs-xs); color: var(--ink-faint); }
.dcard__text  { font-size: var(--fs-sm); line-height: 1.45; color: var(--ink); min-height: 2.9em; }
.dcard__text--out { color: var(--ink-muted); }
.dcard__tags  { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.dcard__tags > li {
  font-size: var(--fs-xs); color: var(--accent-ink);
  border: 1px solid color-mix(in srgb, var(--accent) 24%, transparent);
  background: color-mix(in srgb, var(--accent) 8%, transparent);
  border-radius: var(--r-xs); padding: 4px 9px;
}

html.js [data-flow] .dcard { opacity: 0; transform: translateY(10px); }
html.js [data-flow] .dcard.is-in {
  opacity: 1; transform: none;
  transition: opacity .42s cubic-bezier(.22,.72,.24,1), transform .42s cubic-bezier(.22,.72,.24,1);
}
html.js [data-flow] .demo__status { opacity: 0; transform: translateY(6px); transition: opacity .4s ease, transform .4s ease; }
html.js [data-flow].is-running .demo__status,
html.js [data-flow].is-paused  .demo__status,
html.js [data-flow].is-done    .demo__status { opacity: 1; transform: none; }
html.js [data-flow] .dcard__tags > li { opacity: 0; transform: translateY(3px); }
html.js [data-flow] .dcard__tags > li.is-in { opacity: 1; transform: none; transition: opacity .28s ease, transform .28s ease; }

@media (prefers-reduced-motion: reduce) {
  .hero__object, .trigger, .dcard, .demo__status { transition: none; }
  html.js [data-flow] .dcard { opacity: 1; transform: none; }
  html.js [data-flow] .dcard__tags > li { opacity: 1; transform: none; }
}

.rs {
  --rs-blue:      var(--accent);
  --rs-blue-dark: #17259F;
  --rs-blue-soft: #A6AEFF;
  --rs-border:    rgba(20, 30, 60, .10);
  --rs-border-2:  rgba(20, 30, 60, .08);
  --rs-muted:     #6D7280;
  --rs-muted-2:   #757A86;

  background:
    radial-gradient(circle at 60% 45%, rgba(84,100,255,.045), transparent 36%),
    #FBFBFC;
  color: #08090B;
  padding-block: 80px;
}
.rs__container { max-width: 1540px; margin-inline: auto; padding-inline: 48px; }

.rs__top {
  display: grid;
  grid-template-columns: 430px minmax(0, 1fr);
  gap: 48px;
  align-items: start;
}
@media (min-width: 1600px) { .rs__top { gap: 72px; } }

.rs__eyebrow {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 52px;
  font-size: 14px; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase;
  color: var(--rs-muted);
}
.rs__eyebrow-line { width: 2px; height: 18px; background: var(--rs-blue); border-radius: 1px; }
.rs__num { color: var(--rs-blue); }

.rs__title {
  font-size: clamp(64px, 5vw, 84px);
  line-height: .98;
  letter-spacing: -.055em;
  font-weight: 500;
  color: #08090B;
  margin: 0;
}
.rs__title-accent {
  background: linear-gradient(90deg, #A4ADFF 0%, #5366FF 48%, #17259F 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
@supports not (background-clip: text) {
  .rs__title-accent { -webkit-text-fill-color: currentColor; background: none; color: var(--rs-blue); }
}

.rs__lead { margin-top: 32px; max-width: 390px; display: flex; flex-direction: column; gap: 12px; }
.rs__lead p { font-size: 18px; line-height: 1.65; color: var(--rs-muted); }

.rs__evidence {
  margin-top: 30px;
  width: 100%; max-width: 375px; min-height: 116px;
  border: 1px solid var(--rs-border); border-radius: 18px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 12px 35px rgba(40,55,120,.035);
  padding: 22px 24px;
  display: flex; align-items: center; gap: 18px;
}
.rs__evidence-icon {
  flex: none; width: 58px; height: 58px; border-radius: 50%;
  background: rgba(82,99,255,.08); color: var(--rs-blue);
  display: grid; place-items: center;
}
.rs__evidence-title { font-size: 16px; font-weight: 600; margin: 0 0 4px; letter-spacing: -.01em; }
.rs__evidence-text  { font-size: 14px; line-height: 1.5; color: var(--rs-muted-2); }

.rs__panel {
  position: relative; overflow: hidden;
  border: 1px solid var(--rs-border); border-radius: 24px;
  background: rgba(255,255,255,.45);
  padding: 30px 32px 32px;
  min-height: 585px;
}
.rs__panel-title { font-size: 19px; font-weight: 500; letter-spacing: -.02em; margin-bottom: 28px; }
.rs__wires { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }

.rs__cards {
  position: relative; display: grid; grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 16px; align-items: stretch;
}

.rs-card {
  position: relative; overflow: hidden;
  min-height: 468px;
  border: 1px solid rgba(20,30,60,.09); border-radius: 20px;
  background: rgba(255,255,255,.62);
  display: flex; flex-direction: column;
  transition: transform 250ms ease, border-color 250ms ease;
}
.rs-card:hover { transform: translateY(-2px); border-color: rgba(82,99,255,.16); }
.rs-card__body { padding: 28px 24px; position: relative; z-index: 2; }
.rs-card__badge {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 6px 11px; border-radius: 999px;
  background: rgba(82,99,255,.07); color: var(--rs-blue);
  font-size: 12px; font-weight: 500;
  margin-bottom: 18px;
}
.rs-card__dot { width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.rs-card__title {
  font-size: 27px; line-height: 1.08; letter-spacing: -.035em; font-weight: 500;
  margin: 0 0 12px; color: #08090B;
}
.rs-card__text { font-size: 15px; line-height: 1.55; color: #6B707C; }

.rs-card__vis { position: absolute; inset: auto 0 0 0; height: 58%; z-index: 1; pointer-events: none; }
.rs-vis-wave svg { width: 100%; height: 100%; display: block; }

.rs-vis-sheets { display: block; }
.rs-vis-sheets > span {
  position: absolute; right: calc(-6px + var(--i) * 13px); bottom: calc(-10px + var(--i) * 15px);
  width: 78%; height: 62%;
  border-radius: 16px;
  border: 1px solid rgba(20,30,60,.07);
  background: rgba(255,255,255,calc(.92 - var(--i) * .13));
  transform: rotate(calc(var(--i) * -1.6deg));
  box-shadow: 0 8px 26px rgba(82,99,255,.05);
}
.rs-vis-sheets > span:first-child { box-shadow: none; }

.rs-vis-bild { height: 62%; overflow: hidden; }
.rs-vis-bild img {
  position: absolute; left: 50%; bottom: -6%;
  width: 136%; max-width: none; height: auto;
  transform: translateX(-50%);
}

.rs-vis-object { height: 62%; }
.rs-vis-object img {
  position: absolute; right: -12%; bottom: -14%;
  width: 108%; height: auto; opacity: .92;
}
.rs-vis-object__wires { position: absolute; inset: 0; width: 100%; height: 100%; }

ul.rs__principles {
  margin-top: 40px; list-style: none; padding: 34px 40px; margin-inline: 0;
  border: 1px solid var(--rs-border); border-radius: 20px;
  background: rgba(255,255,255,.52);
  min-height: 162px;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
}
.rs-prin {
  display: grid; grid-template-columns: 62px minmax(0, 1fr); gap: 18px; align-items: center;
  
  min-width: 0; padding-inline: 30px;
  border-left: 1px solid var(--rs-border-2);
}

.rs-prin:first-child { border-left: 0; }
.rs-prin__icon {
  width: 56px; height: 56px; border: 1px solid var(--rs-border-2); border-radius: 50%;
  display: grid; place-items: center; color: var(--rs-blue);
}
.rs-prin__title { font-size: 16px; font-weight: 500; color: #111216; margin: 0 0 7px; letter-spacing: -.01em; }
.rs-prin__text  { font-size: 14px; line-height: 1.5; color: var(--rs-muted-2); }

@media (max-width: 1100px) {
  .rs__top { grid-template-columns: 1fr; gap: 40px; }
  .rs__intro { max-width: 700px; }
  .rs__lead, .rs__evidence { max-width: 640px; }
  .rs__eyebrow { margin-bottom: 36px; }
}
@media (max-width: 1100px) {
  
  ul.rs__principles { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 26px; }
  .rs-prin:nth-child(odd) { border-left: 0; }
}
@media (max-width: 900px) {
  .rs__cards { grid-template-columns: 1fr; }
  .rs-card { min-height: 430px; }
  .rs__panel { min-height: 0; }
  
  ul.rs__principles { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 26px; }
  .rs-prin:nth-child(odd) { border-left: 0; }
}

@media (max-width: 640px) {
  .rs { padding-block: 64px; }
  .rs__container { padding-inline: 20px; }
  .rs__title { font-size: clamp(48px, 14vw, 62px); line-height: .98; }
  .rs__lead p { font-size: 17px; }
  .rs__panel { padding: 20px 14px; border-radius: 20px; }
  .rs-card { min-height: 420px; }
  ul.rs__principles { grid-template-columns: 1fr; padding: 10px 22px; }
  .rs-prin {
    border-left: 0; padding-left: 0; padding-block: 22px;
    border-top: 1px solid rgba(20,30,60,.08);
    min-height: 44px;
  }
  .rs-prin:first-child { border-top: 0; }
}

html.js .rs [data-reveal] { will-change: opacity, transform; }
@media (prefers-reduced-motion: reduce) { .rs-card { transition: none; } }

.wm {
  --wm-blue:     var(--accent);
  --wm-border:   rgba(19, 28, 48, .10);
  --wm-border-2: rgba(20, 30, 60, .09);
  --wm-muted:    #676D7A;
  --wm-muted-2:  #747A87;

  position: relative;
  
  overflow: clip;
  background: #FBFBFC; color: #0A0B0E;
  padding-top: 110px; padding-bottom: 80px;
}
.wm__anchor { position: absolute; top: -90px; }
.wm__container { max-width: 1540px; margin-inline: auto; padding-inline: 48px; }

.wm-story { position: relative; }
.wm__head {
  margin-bottom: clamp(70px, 8vw, 120px);
  position: sticky; top: 26vh; z-index: 0;
}
.wm__head-row {
  display: grid; grid-template-columns: minmax(0, 560px) minmax(0, 360px);
  gap: clamp(40px, 4.6vw, 84px); align-items: end;
  margin-top: 28px; max-width: 1010px;
}

.wm__head-bild {

  position: absolute; right: 0; top: -28px; transform: none;
  width: 46%; max-width: none; height: calc(100% + 56px);
  z-index: 0; pointer-events: none;
  object-fit: cover; object-position: center right;
  border-radius: 28px;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 34%);
  mask-image: linear-gradient(to right, transparent 0, #000 34%);
}
.wm__eyebrow, .wm__title, .wm__head-row { position: relative; z-index: 1; }

.wm__eyebrow {
  display: flex; align-items: center; gap: 12px; margin-bottom: 44px;
  font-size: 14px; font-weight: 500; letter-spacing: .15em; text-transform: uppercase;
  color: #697080;
}
.wm__eyebrow-line { width: 2px; height: 18px; border-radius: 999px; background: var(--wm-blue); }
.wm__num { color: var(--wm-blue); }

.wm__title {
  font-size: clamp(72px, 6.2vw, 104px);
  line-height: .95; letter-spacing: -.055em; font-weight: 500;
  color: #08090B; margin: 0; max-width: 850px;
}
.wm__title-accent {
  background: linear-gradient(90deg, #AEB6FF 0%, #6575FF 34%, #4358F5 66%, #19289F 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
@supports not (background-clip: text) {
  .wm__title-accent { -webkit-text-fill-color: currentColor; background: none; color: var(--wm-blue); }
}

.wm__lead {
  margin-top: 0; max-width: 570px;
  font-size: 18px; line-height: 1.65; letter-spacing: -.01em; color: var(--wm-muted);
}

.wm__principle {
  margin-top: 0; max-width: 400px; min-height: 108px;
  display: flex; align-items: center; gap: 18px;
  padding: 18px 22px;
  border: 1px solid var(--wm-border); border-radius: 18px;
  background: rgba(255,255,255,.54);
  box-shadow: 0 14px 45px rgba(29,40,100,.025);
}
.wm__principle-icon {
  flex: 0 0 60px; width: 60px; height: 60px;
  display: grid; place-items: center; border-radius: 18px;
  background: rgba(82,99,255,.065); border: 1px solid rgba(82,99,255,.06);
  color: var(--wm-blue);
}
.wm__principle-title { font-size: 16.5px; font-weight: 500; letter-spacing: -.02em; color: #111216; margin: 0; }
.wm__principle-text  { margin-top: 5px; font-size: 15px; line-height: 1.45; color: var(--wm-muted-2); }

.wm-stack {
  --stack-top: clamp(88px, 10vh, 118px);
  --stack-step: 18px;                 
  list-style: none; margin: 0; padding: 0;
  position: relative;
}
.wm-slot {
  position: sticky;
  top: calc(var(--stack-top) + var(--i) * var(--stack-step));
  z-index: calc(var(--i) + 1);
}
.wm-slot + .wm-slot { margin-top: 96px; }

.wc {
  position: relative; overflow: hidden;
  width: 100%; min-height: min(72vh, 720px);
  padding: clamp(38px, 3.6vw, 60px);
  border: 1px solid rgba(20,30,60,.09); border-radius: 28px;
  
  --motif: url("../images/lab/bg-hero.webp");
  --motif-scrim-used: rgba(255,255,255,.10);
  background: #FDFDFE;
  box-shadow: 0 28px 80px rgba(26,38,86,.045);
  display: grid;
  grid-template-columns: minmax(280px, .78fr) minmax(0, 1.22fr);
  gap: clamp(40px, 4.4vw, 70px);
  align-items: center;
  transform-origin: 50% 0;
  transition: transform 420ms var(--quart), opacity 420ms var(--quart), filter 420ms var(--quart);
}

.wc[data-depth="1"] { transform: scale(.975); opacity: .72; filter: saturate(.72); }
.wc[data-depth="2"] { transform: scale(.95);  opacity: .42; filter: saturate(.55); }

.wc__text, .wc__vis, .wc__foot { position: relative; z-index: 1; }

.wc__title {
  margin: 0; font-size: clamp(48px, 4.5vw, 72px);
  line-height: .98; letter-spacing: -.05em; font-weight: 500; color: #08090B;
}

.wc__lead { margin: 24px 0 0; max-width: 430px; font-size: 17px; line-height: 1.6; color: #565C6A; }
.wc__note { margin: 16px 0 0; max-width: 400px; font-size: 15px; line-height: 1.6; color: #646A78; }

.wc__foot {
  position: absolute; left: clamp(38px, 3.6vw, 60px); bottom: clamp(26px, 2.4vw, 36px);
  margin: 0; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: #A6ABB5;
  display: flex; align-items: center; gap: 9px;
}
.wc__foot .is-hier { color: #4A5060; font-weight: 500; }
.wc__foot-tr { color: #C7CBD3; }

.wc-audio {
  position: relative; margin: 0; width: 100%; max-width: 650px;
  padding: 26px 30px 28px;
  border: 1px solid rgba(20,30,60,.08); border-radius: 20px;
  
  background: rgba(255,255,255,.88);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.wc-audio__head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.wc-audio__who  { font-size: 15px; font-weight: 500; letter-spacing: -.015em; color: #14161C; }
.wc-audio__meta { font-size: 12px; color: #7A808C; }
.wc-audio__row  { display: flex; align-items: center; gap: 18px; }
.wc-audio__play {
  flex: none; width: 40px; height: 40px; border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(82,99,255,.08); color: var(--wm-blue);
}
.wc-wave { display: block; flex: 1 1 auto; min-width: 0; height: 58px; }
.wc-audio__scale { display: flex; justify-content: space-between; margin: 12px 0 0 58px; font-size: 11px; color: #9AA0AC; }
.wc-audio__quote { margin: 22px 0 0; font-size: 16px; line-height: 1.45; color: #424753; }

.wc-audio__obj { position: absolute; right: -46px; bottom: -54px; width: 150px; height: 150px; pointer-events: none; opacity: .9; }

.obj-lens__disc {
  background:
    radial-gradient(circle at 36% 30%, rgba(255,255,255,.92) 0%, rgba(134,148,253,.92) 46%, rgba(62,80,240,.96) 100%);
  box-shadow: 0 14px 28px rgba(58,74,220,.24);
  border-radius: 50%;
}
.obj-lens__ring {
  border: 1px solid rgba(82,99,255,.30); border-radius: 50%;
  background: linear-gradient(160deg, rgba(255,255,255,.38), rgba(186,196,255,.14));
}
.wc-audio__obj .obj-lens__disc { position: absolute; z-index: 2; left: 16px; bottom: 20px; width: 112px; height: 112px; transform: rotateX(62deg) rotateZ(-40deg); }
.wc-audio__obj .obj-lens__ring { position: absolute; z-index: 1; left: 2px; bottom: 32px; width: 142px; height: 142px; transform: rotateX(62deg) rotateZ(-40deg); }

.wc-map {
  position: relative; width: 100%; max-width: 640px;
  display: grid; grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center; gap: 16px;
}
.wc-map__col { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 34px; }

.wc-map__col > li { font-size: 14px; line-height: 1.3; color: #383E49; max-width: 170px;
  white-space: nowrap; hyphens: none; -webkit-hyphens: none; }
.wc-map__col--r { text-align: right; }
.wc-map__col--r > li { margin-left: auto; }

.wc-map__mid { position: relative; min-width: 0; }
.wc-map__svg { width: 100%; height: auto; display: block; }
.wc-map__core {
  position: absolute; left: 50%; top: 62%; transform: translateX(-50%);
  margin: 0; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--wm-blue);
  white-space: nowrap;
}

.wc-prod { position: relative; width: 100%; max-width: 700px; }
.wc-prod__layers > span {
  position: absolute; right: -30px; border-radius: 20px;
  border: 1px solid rgba(82,99,255,.20);
  background: linear-gradient(150deg, rgba(255,255,255,.82) 0%, rgba(184,194,255,.62) 100%);
}
.wc-prod__layers > span:nth-child(1) { top: -26px; left: 46px; height: 100%; }
.wc-prod__layers > span:nth-child(2) { top: -13px; left: 24px; height: 100%; opacity: .8; }
.wc-prod__sheet {
  position: relative;
  border: 1px solid rgba(20,30,60,.09); border-radius: 20px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 18px 46px rgba(26,38,86,.06);
  overflow: hidden;
}
.wc-prod__head {
  display: flex; align-items: center; gap: 9px; margin: 0;
  padding: 16px 22px; border-bottom: 1px solid rgba(20,30,60,.07);
  font-size: 14px; font-weight: 500; color: #14161C;
}
.wc-prod__head span { color: var(--wm-muted-2); display: inline-flex; }
.wc-prod__body { display: grid; grid-template-columns: minmax(0,1fr) minmax(180px,.72fr); }
.wc-prod__lines { padding: 24px 22px; display: flex; flex-direction: column; gap: 13px; }
.wc-prod__lines > span { height: 8px; width: var(--w); border-radius: 999px; background: rgba(20,30,60,.09); }
.wc-prod__side { padding: 22px 22px 24px; border-left: 1px solid rgba(20,30,60,.07); background: rgba(82,99,255,.028); }
.wc-prod__side-title { margin: 0 0 14px; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: #7A808C; }
.wc-prod__side-list { list-style: none; margin: 0 0 18px; padding: 0; display: flex; flex-direction: column; gap: 11px; }
.wc-prod__side-list li { display: flex; align-items: center; gap: 9px; font-size: 13px; color: #2C313B; }
.wc-prod__side-list svg { color: var(--wm-blue); flex: none; }
.wc-prod__btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 15px; border-radius: 10px;
  border: 1px solid rgba(20,30,60,.10); background: rgba(255,255,255,.8);
  font-size: 13px; color: #14161C;
}

.wm__close {
  margin-top: 110px; border-top: 1px solid var(--wm-border);
  display: flex; justify-content: space-between; align-items: flex-end; gap: 40px;
  padding-top: 26px;
}
.wm__close-text {
  font-size: 22px; line-height: 1.35; letter-spacing: -.025em; font-weight: 500;
  color: #121317; max-width: 600px;
}
.wm__close-link {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 15px; color: var(--wm-blue); white-space: nowrap;
  transition: gap 200ms ease;
}
.wm__close-link:hover { gap: 11px; }
.wm__close-link:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: 4px; border-radius: 4px; }

@media (max-width: 1199px) {
  .wm__head { margin-bottom: 52px; }
  .wm__head-row { grid-template-columns: 1fr; gap: 34px; }
  .wm__title { font-size: clamp(58px, 8vw, 84px); }
  .wm__head { top: 18vh; }
  .wm-stack { --stack-top: 84px; --stack-step: 14px; }
  .wm-slot + .wm-slot { margin-top: 72px; }
  .wc {
    grid-template-columns: 1fr; gap: 34px; align-items: start;
    min-height: 0; padding: clamp(30px, 3.4vw, 44px);
  }
  .wc__title { font-size: clamp(42px, 6vw, 58px); }
  .wc__foot { position: static; margin-top: 26px; }
  .wc-audio, .wc-map, .wc-prod { max-width: none; }
  .wc-audio__obj { display: none; }
  .wm__head-bild { position: static; width: 100%; max-width: 520px; margin-top: 28px; transform: none; }
}

@media (max-width: 767px) {
  .wm { padding-top: 76px; padding-bottom: 64px; }
  .wm__container { padding-inline: 20px; }
  .wm__title { font-size: clamp(50px, 14vw, 68px); }
  .wm__lead { font-size: 17px; }
  .wm__principle { max-width: none; }
  
  .wm__head { position: static; }
  .wm-slot { position: static; }
  .wm-slot + .wm-slot { margin-top: 20px; }
  .wm__head-bild { display: none; }
  .wc { border-radius: 22px; padding: 26px 22px 30px; transform: none !important; opacity: 1 !important; filter: none !important; }
  .wc__title { font-size: clamp(38px, 11vw, 50px); }
  .wc__lead, .wc__note { max-width: none; }
  .wc-audio { padding: 20px 18px 22px; }
  .wc-audio__head { flex-direction: column; gap: 4px; }
  .wc-audio__row { gap: 12px; }
  .wc-audio__scale { margin-left: 52px; }
  .wc-map { grid-template-columns: 1fr; gap: 12px; }
  .wc-map__col { flex-direction: row; flex-wrap: wrap; gap: 10px 18px; }
  .wc-map__col > li { max-width: none; font-size: 13px; }
  .wc-map__col--r { text-align: left; }
  .wc-map__col--r > li { margin-left: 0; }
  .wc-map__core { position: static; transform: none; margin-top: 6px; }
  .wc-prod__body { grid-template-columns: 1fr; }
  .wc-prod__side { border-left: 0; border-top: 1px solid rgba(20,30,60,.07); }
  .wc-prod__layers { display: none; }
  .wm__close { flex-direction: column; align-items: flex-start; gap: 20px; }
  .wm__close-text { font-size: 20px; }
  .wm__close-link { min-height: 44px; align-items: center; }
}

@media (prefers-reduced-motion: reduce) {
  .wm__close-link { transition: none; }
  
  .wc { transition: none; transform: none !important; opacity: 1 !important; filter: none !important; }
  .wm__head { position: static; }
  .wm-slot { position: static; }
  .wm-slot + .wm-slot { margin-top: 24px; }
}

.lg {
  --lg-blue:     var(--accent);
  --lg-border:   rgba(20, 30, 60, .09);   
  --lg-border-2: rgba(20, 30, 60, .07);
  --lg-muted:    #6B707C;
  --lg-muted-2:  #7A808C;

  position: relative; overflow: clip;
  background: #FBFBFC; color: #08090B;
  padding-top: 105px; padding-bottom: 90px;
}
.lg__container { max-width: 1540px; margin-inline: auto; padding-inline: 48px; }

.lg__head { position: relative; margin-bottom: 44px; }

.lg__eyebrow {
  display: flex; align-items: center; gap: 12px; margin-bottom: 44px;
  font-size: 14px; font-weight: 500; letter-spacing: .15em; text-transform: uppercase;
  color: #69707E;
}
.lg__eyebrow-line { width: 2px; height: 18px; border-radius: 999px; background: var(--lg-blue); }
.lg__num { color: var(--lg-blue); }

.lg__title {
  font-size: clamp(58px, 6.5vw, 108px);
  line-height: .93; letter-spacing: -.06em; font-weight: 500;
  color: #08090B; margin: 0; max-width: 1000px;
}
.lg__title-accent {
  background: linear-gradient(90deg, #AAB3FF 0%, #6273FF 32%, #465BF7 60%, #17249E 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
@supports not (background-clip: text) {
  .lg__title-accent { -webkit-text-fill-color: currentColor; background: none; color: var(--lg-blue); }
}

.lg__line { display: block; white-space: nowrap; }

.lg__lead {
  margin-top: 34px; margin-left: auto; max-width: 430px;
  font-size: 18px; line-height: 1.68; letter-spacing: -.01em; color: var(--lg-muted);
  padding-right: clamp(0px, 6vw, 120px);
}

.lg-car { position: relative; }
.lg-car__stage {
  --card-w: clamp(560px, 46vw, 760px);
  --side-scale: .64;
  --off: clamp(310px, 31vw, 520px);
  position: relative; min-height: 452px;
  display: flex; align-items: center; justify-content: center;
}
.lg-car__track { list-style: none; margin: 0; padding: 0; position: absolute; inset: 0; }

.lg-slide {
  position: absolute; left: 50%; top: 50%;
  width: var(--card-w);
  transform: translate(-50%, -50%);
  transition: transform 850ms var(--quart), opacity 850ms var(--quart), filter 850ms var(--quart);
  will-change: transform, opacity;
}
.lg-slide[data-slot="center"] { z-index: 3; opacity: 1; filter: none; transform: translate(-50%, -50%) scale(1); }
.lg-slide[data-slot="left"]   { z-index: 2; opacity: .8; filter: saturate(.72);
  transform: translate(calc(-50% - var(--off)), -50%) scale(var(--side-scale)); }
.lg-slide[data-slot="right"]  { z-index: 2; opacity: .8; filter: saturate(.72);
  transform: translate(calc(-50% + var(--off)), -50%) scale(var(--side-scale)); }

.lg-card {
  position: relative; overflow: hidden;
  min-height: 330px;
  padding: 36px 40px 34px;
  border: 1px solid var(--lg-border); border-radius: 24px;
  background:
    radial-gradient(circle at 74% 30%, rgba(82,99,255,.035), transparent 36%),
    #FDFDFE;
  box-shadow: 0 22px 70px rgba(25,35,80,.035);
  display: grid; grid-template-columns: minmax(220px, .82fr) minmax(0, 1.18fr);
  gap: 30px; align-items: center;
}
.lg-card__step { margin: 0 0 16px; font-size: 12px; letter-spacing: .16em; color: #9AA0AC; }
.lg-card__value {
  margin: 0; font-size: clamp(52px, 4.2vw, 72px);
  line-height: .95; letter-spacing: -.055em; font-weight: 450; white-space: nowrap;
  font-variant-numeric: tabular-nums;
  background: linear-gradient(96deg, #6272FF 0%, #4A5CF7 38%, #3A4BE8 72%, #1B2793 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
@supports not (background-clip: text) {
  .lg-card__value { -webkit-text-fill-color: currentColor; background: none; color: var(--lg-blue); }
}
.lg-card__title { margin: 18px 0 0; font-size: 18px; line-height: 1.32; letter-spacing: -.018em; font-weight: 500; color: #14161C; hyphens: none; }
.lg-card__desc  { margin: 10px 0 0; font-size: 14px; line-height: 1.55; color: var(--lg-muted); hyphens: none; }
.lg-card__src   { margin: 18px 0 0; padding-top: 14px; border-top: 1px solid rgba(19,28,48,.07); font-size: 12px; color: var(--lg-muted-2); }

.lg-card__vis { position: relative; align-self: stretch; min-height: 240px; }

.lg-obj {
  position: absolute; pointer-events: none;
  right: -10%; top: 50%; transform: translateY(-50%);
  width: 116%; max-width: none; height: auto;
}

@media (prefers-reduced-motion: no-preference) {
  .lg-slide[data-slot="center"] .lg-obj { animation: lgSchweben 6.5s ease-in-out infinite; }
}
@keyframes lgSchweben { 0%,100% { translate: 0 0; } 50% { translate: 0 -6px; } }

.lg-car { --lg-dauer: 5000ms; }
.lg-car__steps { display: flex; align-items: center; gap: 26px; margin-top: 34px; justify-content: center; }
.lg-step {
  display: inline-flex; align-items: center; gap: 10px;
  border: 0; background: none; padding: 8px 2px; cursor: pointer;
  font: inherit; font-size: 12px; letter-spacing: .16em; color: #9AA0AC;
  transition: color 300ms ease;
}

.lg-step__bar {
  position: relative; display: block; width: 52px; height: 2px;
  border-radius: 999px; background: rgba(19,28,48,.13); overflow: hidden;
}
.lg-step__fill {
  position: absolute; left: 0; top: 0; bottom: 0; width: 100%;
  border-radius: 999px; background: var(--lg-blue);
  transform: scaleX(0); transform-origin: left center;
}
.lg-step[aria-selected="true"] { color: var(--lg-blue); }
.lg-step[aria-selected="true"] .lg-step__fill { animation: lgLaden var(--lg-dauer) linear forwards; }

.lg-car.is-paused .lg-step__fill { animation-play-state: paused; }
@keyframes lgLaden { from { transform: scaleX(.045); } to { transform: scaleX(1); } }
.lg-step:hover { color: #4D5360; }
.lg-step:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: 3px; border-radius: 6px; }

@media (max-width: 1199px) {
  .lg { padding-top: 92px; padding-bottom: 70px; }
  .lg__container { padding-inline: 32px; }
  .lg__head { margin-bottom: 56px; }
  .lg__title { font-size: clamp(56px, 8vw, 82px); }
  
  .lg__line { white-space: normal; }
  .lg__lead { max-width: 620px; margin-left: 0; padding-right: 0; }
  
  .lg-car__stage { --card-w: min(92%, 640px); --side-scale: .58; --off: 40vw; min-height: 460px; }
  .lg-card { min-height: 300px; padding: 30px 30px 28px; grid-template-columns: minmax(200px, .9fr) minmax(0, 1.1fr); gap: 22px; }
}

@media (max-width: 767px) {
  .lg { padding-top: 76px; padding-bottom: 64px; }
  .lg__container { padding-inline: 20px; }
  .lg__eyebrow { margin-bottom: 32px; }
  .lg__title { font-size: clamp(50px, 14vw, 68px); }
  .lg__lead { font-size: 17px; }
  .lg__head { margin-bottom: 40px; }
  
  .lg-car__stage { --card-w: 100%; --side-scale: .86; --off: 96vw; min-height: 0; display: block; }
  .lg-car__track { position: relative; inset: auto; min-height: 420px; }
  .lg-slide { top: 0; transform: translate(-50%, 0); }
  .lg-slide[data-slot="center"] { transform: translate(-50%, 0) scale(1); }
  .lg-slide[data-slot="left"]  { transform: translate(calc(-50% - var(--off)), 0) scale(var(--side-scale)); }
  .lg-slide[data-slot="right"] { transform: translate(calc(-50% + var(--off)), 0) scale(var(--side-scale)); }
  .lg-card { grid-template-columns: 1fr; gap: 20px; min-height: 0; padding: 26px 22px 24px; }
  .lg-card__value { font-size: clamp(46px, 14vw, 62px); }
  
  .lg-card__vis { min-height: 200px; }
  .lg-obj { right: -6%; width: 100%; }
  .lg-car__steps { gap: 18px; margin-top: 26px; }

}

@media (prefers-reduced-motion: reduce) {
  
  .lg-slide { transition: none; }
  .lg-obj { animation: none !important; }
  
  .lg-step[aria-selected="true"] .lg-step__fill { animation: none; transform: scaleX(1); }
}

.pr {
  --pr-blue:     var(--accent);
  --pr-border:   rgba(20, 30, 60, .09);
  --pr-border-2: rgba(20, 30, 60, .07);
  --pr-muted:    #6B707C;
  --pr-muted-2:  #7A808C;

  position: relative; overflow: clip;
  background: #FBFBFC; color: #08090B;
  padding-top: 110px; padding-bottom: 84px;
}
.pr__container { max-width: 1540px; margin-inline: auto; padding-inline: 48px; }

.pr__head { margin-bottom: 48px; }
.pr__eyebrow {
  display: flex; align-items: center; gap: 12px; margin: 0 0 40px;
  font-size: 14px; font-weight: 500; letter-spacing: .15em; text-transform: uppercase;
  color: #69707E;
}
.pr__eyebrow-line { width: 2px; height: 18px; border-radius: 999px; background: var(--pr-blue); }
.pr__num { color: var(--pr-blue); }

.pr__title {
  margin: 0; max-width: 1100px;
  font-size: clamp(60px, 6.2vw, 108px);
  line-height: .94; letter-spacing: -.06em; font-weight: 500; color: #08090B;
}
.pr__title-accent {
  background: linear-gradient(90deg, #AAB3FF 0%, #6273FF 32%, #465BF7 60%, #17249E 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
@supports not (background-clip: text) {
  .pr__title-accent { -webkit-text-fill-color: currentColor; background: none; color: var(--pr-blue); }
}
.pr__lead {
  margin: 22px 0 0; max-width: 600px;
  font-size: 18px; line-height: 1.65; color: var(--pr-muted);
}

.pr__grid {
  display: grid;
  grid-template-columns: minmax(420px, .82fr) minmax(0, 1.18fr);
  gap: clamp(48px, 5vw, 82px);
  align-items: start;
  margin-top: 48px;
}

.pr__list { position: relative; padding-left: 26px; }
.pr__rail {
  position: absolute; left: 0; top: 10px; bottom: 10px; width: 1px;
  background: var(--pr-border);
}

.pr__marker {
  position: absolute; left: -1px; width: 3px; border-radius: 999px;
  background: var(--pr-blue);
  top: var(--my, 10px); height: var(--mh, 60px);
  transition: top 520ms var(--quart), height 520ms var(--quart);
}

.pr__list[data-mode="auto"] .pr__marker {
  box-shadow: 0 0 0 3px rgba(82,99,255,.10), 0 0 18px 2px rgba(82,99,255,.35);
  animation: prAtmen 3.2s ease-in-out infinite;
}
@keyframes prAtmen { 0%,100% { opacity: .85; } 50% { opacity: 1; } }

.pr-row {
  position: relative; display: grid; width: 100%;
  grid-template-columns: auto minmax(0, 1fr); gap: 22px;
  align-items: start; text-align: left;
  border: 0; background: none; font: inherit; color: inherit; cursor: pointer;
  padding: 30px 0 32px;
  transition: opacity 300ms ease;
}
.pr-row + .pr-row { border-top: 1px solid var(--pr-border-2); }
.pr-row:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: 4px; border-radius: 8px; }

.pr-row__num {
  font-size: clamp(40px, 3.6vw, 68px); line-height: 1; letter-spacing: -.05em;
  font-weight: 400; color: #B9BDC7;
  transition: color 300ms ease;
}
.pr-row[aria-selected="true"] .pr-row__num { color: var(--pr-blue); }

.pr-row__body { display: block; min-width: 0; }
.pr-row__head { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.pr-row__name {
  font-size: clamp(21px, 1.5vw, 26px); line-height: 1.15; letter-spacing: -.028em;
  font-weight: 500; color: #4A505C;
  transition: color 300ms ease;
}
.pr-row[aria-selected="true"] .pr-row__name { color: #08090B; }
.pr-row:hover .pr-row__name { color: #21262F; }
.pr-row__brand { font-size: .78em; font-weight: 450; color: var(--pr-muted-2); }
.pr-row[aria-selected="true"] .pr-row__brand { color: var(--pr-muted); }

.pr-row__cat {
  display: block; margin-top: 9px;
  font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: #9AA0AC;
}
.pr-row__text {
  display: block; margin-top: 12px; max-width: 430px;
  font-size: 15px; line-height: 1.6; color: var(--pr-muted); hyphens: none;
}

.pr-row__cta {
  display: inline-flex; align-items: center; gap: 9px;
  margin-top: 0; height: 0; overflow: hidden;
  font-size: 15px; font-weight: 500; color: var(--pr-blue);
  opacity: 0; transition: opacity 300ms ease;
}
.pr-row[aria-selected="true"] .pr-row__cta { margin-top: 18px; height: auto; opacity: 1; }
.pr-row[aria-selected="true"]:hover .pr-row__cta svg { transform: translateX(3px); }
.pr-row__cta svg { transition: transform 220ms ease; }

.pr-badge {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 4px 10px; border-radius: 999px;
  border: 1px solid var(--pr-border); background: rgba(255,255,255,.5);
  font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: #767C89;
}
.pr-badge__dot { width: 5px; height: 5px; border-radius: 50%; background: #B4B9C4; }
.pr-badge--live .pr-badge__dot { background: var(--pr-blue); }

.pr__stage {
  position: relative; min-height: 720px;
  border: 1px solid rgba(20,30,60,.08); border-radius: 34px;
  background:
    radial-gradient(circle at 70% 35%, rgba(82,99,255,.04), transparent 40%),
    rgba(255,255,255,.42);
  overflow: hidden;
}

.pr-panel {
  position: absolute; inset: 0;
  padding: clamp(30px, 3vw, 46px);
  opacity: 0; transform: translateY(14px);
  transition: opacity 520ms var(--quart), transform 520ms var(--quart);
  pointer-events: none;
}
.pr-panel.is-on { opacity: 1; transform: none; pointer-events: auto; }
.pr-panel[hidden] { display: block; }   

.pr-panel__tag {
  position: relative; z-index: 3; margin: 0; font-size: 17px; letter-spacing: -.02em; color: #21262F;
}
.pr-panel__tag-num { color: var(--pr-blue); margin-right: 8px; }

.pr-bild {
  
  position: absolute; inset: 0;
  width: 100%; height: 100%; z-index: 1; pointer-events: none;
  object-fit: cover; object-position: center;
}

.pr-bild--cover { opacity: .85; z-index: 0; }

.pr-bild--zoom { transform: scale(1.18); }

.pr-lokal {
  position: absolute; z-index: 2;
  left: clamp(20px, 2.4vw, 38px); right: clamp(20px, 2.4vw, 38px);
  
  top: clamp(84px, 10vh, 124px);
  bottom: clamp(202px, 21vh, 224px);
  height: auto;
}
.pr-lokal__grenze {
  position: absolute; inset: 0;
  border: 1px dashed rgba(82,99,255,.28); border-radius: 22px;
  background: rgba(255,255,255,.16);
}
.pr-lokal__marke {
  position: absolute; left: 20px; top: -8px;
  padding: 0 10px; background: #FCFCFD;
  font-size: 10.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--pr-blue);
}
.pr-lokal__wires { position: absolute; inset: 0; width: 100%; height: 100%; }

.pr-lokal__objekt {
  position: absolute; left: 50%; top: 48%; translate: -50% -50%;
  width: clamp(150px, 17vw, 210px); height: auto;
}
.pr-lokal__kern {
  position: absolute; left: 50%; top: 78%; translate: -50% 0;
  font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: #6C7280;
  white-space: nowrap;
}

.pr-lokal__k {
  position: absolute; display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 12px; border-radius: 999px;
  border: 1px solid rgba(20,30,60,.08); background: rgba(255,255,255,.82);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  box-shadow: 0 8px 22px rgba(30,40,90,.05);
  font-size: 12.5px; color: #2C313B; white-space: nowrap;
}
.pr-lokal__k svg { color: var(--pr-blue); flex: none; }
.pr-lokal__k--oben   { left: 50%; top: 4%;  translate: -50% -50%; }
.pr-lokal__k--pvs    { left: 3%;  top: 21%; translate: 0 -50%; }
.pr-lokal__k--platz  { left: 3%;  top: 75%; translate: 0 -50%; }
.pr-lokal__k--ablage { right: 3%; top: 21%; translate: 0 -50%; }
.pr-lokal__k--audit  { right: 3%; top: 75%; translate: 0 -50%; }

@media (max-width: 1199px) {
  .pr-lokal { bottom: clamp(170px, 20vh, 200px); }
  .pr-lokal__k { font-size: 11.5px; padding: 6px 10px; }
}
@media (max-width: 719px) {
  
  .pr-lokal { order: 2; }
}

.pr-tree {
  position: absolute; z-index: 2; right: clamp(24px, 3vw, 46px); top: 50%; transform: translateY(-54%);
  width: min(88%, 560px);
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 4px;
}
.pr-tree__root {
  padding: 18px 20px; border-radius: 16px;
  border: 1px solid rgba(82,99,255,.16);
  background: linear-gradient(150deg, rgba(255,255,255,.9), rgba(226,231,255,.6));
  box-shadow: 0 18px 44px rgba(40,54,140,.08);
}
.pr-tree__root-label {
  display: block; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--pr-blue);
}
.pr-tree__root-note { display: block; margin-top: 9px; font-size: 13px; color: #2C313B; white-space: nowrap; }

.pr-tree__wires { width: 100%; height: 220px; display: block; }

.pr-tree__out { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 26px; }
.pr-tree__out li { display: flex; align-items: flex-start; gap: 12px; }
.pr-tree__out li > span:last-child { font-size: 12.5px; line-height: 1.45; color: #5A606C; max-width: 196px; }
.pr-tree__out b { display: block; margin-bottom: 3px; font-size: 13.5px; font-weight: 500; color: #14161C; }
.pr-tree__k { flex: none; padding-top: 2px; font-size: 11px; letter-spacing: .14em; color: var(--pr-blue); }

.pr-assist {
  position: absolute; z-index: 3; left: clamp(24px, 3vw, 44px); bottom: clamp(24px, 3vw, 44px);
  margin: 0; width: min(74%, 268px);
  padding: 18px 20px 16px;
  border: 1px solid rgba(20,30,60,.08); border-radius: 16px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 16px 44px rgba(25,35,80,.07);
}
.pr-assist__head {
  display: flex; align-items: center; gap: 9px;
  font-size: 13.5px; font-weight: 500; color: #14161C;
}
.pr-assist__ico { color: var(--pr-blue); display: inline-flex; }
.pr-assist__beta {
  margin-left: auto; padding: 2px 8px; border-radius: 999px;
  background: rgba(82,99,255,.09); color: var(--pr-blue);
  font-size: 10.5px; letter-spacing: .06em;
}
.pr-assist__k { margin: 16px 0 0; font-size: 12.5px; color: var(--pr-muted-2); }
.pr-assist__v { margin: 3px 0 0; font-size: 19px; font-weight: 500; letter-spacing: -.02em; color: var(--pr-blue); }
.pr-assist__v--sm { font-size: 17px; }
.pr-assist__meter { margin: 14px 0 0; font-size: 12.5px; color: #4A505C; }
.pr-assist__meter b { font-weight: 500; color: #14161C; }
.pr-assist__bar { display: block; margin-top: 8px; height: 3px; border-radius: 999px; background: rgba(19,28,48,.10); overflow: hidden; }

.pr-assist__bar > i {
  display: block; height: 100%; width: var(--w); border-radius: 999px; background: var(--pr-blue);
  transform-origin: left center; transform: scaleX(0);
}
.pr-panel.is-on .pr-assist__bar > i { animation: prFuellen 1400ms cubic-bezier(.22,.72,.24,1) forwards; }
@keyframes prFuellen { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) {
  .pr-assist__bar > i { transform: scaleX(1); }
  .pr-panel.is-on .pr-assist__bar > i { animation: none; }
}
.pr-assist__row { display: flex; justify-content: space-between; gap: 12px; margin: 14px 0 0; font-size: 12.5px; color: var(--pr-muted-2); }
.pr-assist__row b { font-weight: 500; color: #14161C; }
.pr-assist__list { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.pr-assist__list li { display: flex; align-items: center; gap: 9px; font-size: 13px; color: #2C313B; }
.pr-assist__list svg { color: var(--pr-blue); flex: none; }

.pr-assist__note { margin: 14px 0 0; font-size: 10.5px; letter-spacing: .04em; color: #A2A8B4; }

.pr-route {
  position: absolute; z-index: 2; right: clamp(24px, 3vw, 46px); top: 50%; transform: translateY(-54%);
  width: min(88%, 560px);
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 4px;
}
.pr-route__in { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 28px; }
.pr-route__in li {
  display: flex; align-items: center; gap: 10px;
  font-size: 13.5px; color: #2C313B; white-space: nowrap;
}
.pr-route__ico {
  width: 38px; height: 38px; border-radius: 50%;
  display: grid; place-items: center;
  border: 1px solid rgba(20,30,60,.08); background: rgba(255,255,255,.8);
  color: var(--pr-blue);
}
.pr-route__wires { width: 100%; height: 220px; display: block; }

.pr-route__objekt {
  width: clamp(190px, 21vw, 260px); height: auto;
  margin-left: -18px;
  display: block;
}

.wm__close {
  margin-top: 110px; border-top: 1px solid var(--wm-border);
  display: flex; justify-content: space-between; align-items: flex-end; gap: 40px;
  padding-top: 26px;
}
.wm__close-text {
  font-size: 22px; line-height: 1.35; letter-spacing: -.025em; font-weight: 500;
  color: #121317; max-width: 600px;
}
.wm__close-link {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 15px; color: var(--wm-blue); white-space: nowrap;
  transition: gap 200ms ease;
}
.wm__close-link:hover { gap: 11px; }
.wm__close-link:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: 4px; border-radius: 4px; }

@media (max-width: 1199px) {
  .wm__head { margin-bottom: 52px; }
  .wm__head-row { grid-template-columns: 1fr; gap: 34px; }
  .wm__title { font-size: clamp(58px, 8vw, 84px); }
  .wm__head { top: 18vh; }
  .wm-stack { --stack-top: 84px; --stack-step: 14px; }
  .wm-slot + .wm-slot { margin-top: 72px; }
  .wc {
    grid-template-columns: 1fr; gap: 34px; align-items: start;
    min-height: 0; padding: clamp(30px, 3.4vw, 44px);
  }
  .wc__title { font-size: clamp(42px, 6vw, 58px); }
  .wc__foot { position: static; margin-top: 26px; }
  .wc-audio, .wc-map, .wc-prod { max-width: none; }
  .wc-audio__obj { display: none; }
  .wm__head-bild { position: static; width: 100%; max-width: 520px; margin-top: 28px; transform: none; }
}

@media (max-width: 767px) {
  .wm { padding-top: 76px; padding-bottom: 64px; }
  .wm__container { padding-inline: 20px; }
  .wm__title { font-size: clamp(50px, 14vw, 68px); }
  .wm__lead { font-size: 17px; }
  .wm__principle { max-width: none; }
  
  .wm__head { position: static; }
  .wm-slot { position: static; }
  .wm-slot + .wm-slot { margin-top: 20px; }
  .wm__head-bild { display: none; }
  .wc { border-radius: 22px; padding: 26px 22px 30px; transform: none !important; opacity: 1 !important; filter: none !important; }
  .wc__title { font-size: clamp(38px, 11vw, 50px); }
  .wc__lead, .wc__note { max-width: none; }
  .wc-audio { padding: 20px 18px 22px; }
  .wc-audio__head { flex-direction: column; gap: 4px; }
  .wc-audio__row { gap: 12px; }
  .wc-audio__scale { margin-left: 52px; }
  .wc-map { grid-template-columns: 1fr; gap: 12px; }
  .wc-map__col { flex-direction: row; flex-wrap: wrap; gap: 10px 18px; }
  .wc-map__col > li { max-width: none; font-size: 13px; }
  .wc-map__col--r { text-align: left; }
  .wc-map__col--r > li { margin-left: 0; }
  .wc-map__core { position: static; transform: none; margin-top: 6px; }
  .wc-prod__body { grid-template-columns: 1fr; }
  .wc-prod__side { border-left: 0; border-top: 1px solid rgba(20,30,60,.07); }
  .wc-prod__layers { display: none; }
  .wm__close { flex-direction: column; align-items: flex-start; gap: 20px; }
  .wm__close-text { font-size: 20px; }
  .wm__close-link { min-height: 44px; align-items: center; }
}

@media (prefers-reduced-motion: reduce) {
  .wm__close-link { transition: none; }
  
  .wc { transition: none; transform: none !important; opacity: 1 !important; filter: none !important; }
  .wm__head { position: static; }
  .wm-slot { position: static; }
  .wm-slot + .wm-slot { margin-top: 24px; }
}

.lg {
  --lg-blue:     var(--accent);
  --lg-border:   rgba(20, 30, 60, .09);   
  --lg-border-2: rgba(20, 30, 60, .07);
  --lg-muted:    #6B707C;
  --lg-muted-2:  #7A808C;

  position: relative; overflow: clip;
  background: #FBFBFC; color: #08090B;
  padding-top: 105px; padding-bottom: 90px;
}
.lg__container { max-width: 1540px; margin-inline: auto; padding-inline: 48px; }

.lg__head { position: relative; margin-bottom: 44px; }

.lg__eyebrow {
  display: flex; align-items: center; gap: 12px; margin-bottom: 44px;
  font-size: 14px; font-weight: 500; letter-spacing: .15em; text-transform: uppercase;
  color: #69707E;
}
.lg__eyebrow-line { width: 2px; height: 18px; border-radius: 999px; background: var(--lg-blue); }
.lg__num { color: var(--lg-blue); }

.lg__title {
  font-size: clamp(58px, 6.5vw, 108px);
  line-height: .93; letter-spacing: -.06em; font-weight: 500;
  color: #08090B; margin: 0; max-width: 1000px;
}
.lg__title-accent {
  background: linear-gradient(90deg, #AAB3FF 0%, #6273FF 32%, #465BF7 60%, #17249E 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
@supports not (background-clip: text) {
  .lg__title-accent { -webkit-text-fill-color: currentColor; background: none; color: var(--lg-blue); }
}

.lg__line { display: block; white-space: nowrap; }

.lg__lead {
  margin-top: 34px; margin-left: auto; max-width: 430px;
  font-size: 18px; line-height: 1.68; letter-spacing: -.01em; color: var(--lg-muted);
  padding-right: clamp(0px, 6vw, 120px);
}

.lg-car { position: relative; }
.lg-car__stage {
  --card-w: clamp(560px, 46vw, 760px);
  --side-scale: .64;
  --off: clamp(310px, 31vw, 520px);
  position: relative; min-height: 452px;
  display: flex; align-items: center; justify-content: center;
}
.lg-car__track { list-style: none; margin: 0; padding: 0; position: absolute; inset: 0; }

.lg-slide {
  position: absolute; left: 50%; top: 50%;
  width: var(--card-w);
  transform: translate(-50%, -50%);
  transition: transform 850ms var(--quart), opacity 850ms var(--quart), filter 850ms var(--quart);
  will-change: transform, opacity;
}
.lg-slide[data-slot="center"] { z-index: 3; opacity: 1; filter: none; transform: translate(-50%, -50%) scale(1); }
.lg-slide[data-slot="left"]   { z-index: 2; opacity: .8; filter: saturate(.72);
  transform: translate(calc(-50% - var(--off)), -50%) scale(var(--side-scale)); }
.lg-slide[data-slot="right"]  { z-index: 2; opacity: .8; filter: saturate(.72);
  transform: translate(calc(-50% + var(--off)), -50%) scale(var(--side-scale)); }

.lg-card {
  position: relative; overflow: hidden;
  min-height: 330px;
  padding: 36px 40px 34px;
  border: 1px solid var(--lg-border); border-radius: 24px;
  background:
    radial-gradient(circle at 74% 30%, rgba(82,99,255,.035), transparent 36%),
    #FDFDFE;
  box-shadow: 0 22px 70px rgba(25,35,80,.035);
  display: grid; grid-template-columns: minmax(220px, .82fr) minmax(0, 1.18fr);
  gap: 30px; align-items: center;
}
.lg-card__step { margin: 0 0 16px; font-size: 12px; letter-spacing: .16em; color: #9AA0AC; }
.lg-card__value {
  margin: 0; font-size: clamp(52px, 4.2vw, 72px);
  line-height: .95; letter-spacing: -.055em; font-weight: 450; white-space: nowrap;
  font-variant-numeric: tabular-nums;
  background: linear-gradient(96deg, #6272FF 0%, #4A5CF7 38%, #3A4BE8 72%, #1B2793 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
@supports not (background-clip: text) {
  .lg-card__value { -webkit-text-fill-color: currentColor; background: none; color: var(--lg-blue); }
}
.lg-card__title { margin: 18px 0 0; font-size: 18px; line-height: 1.32; letter-spacing: -.018em; font-weight: 500; color: #14161C; hyphens: none; }
.lg-card__desc  { margin: 10px 0 0; font-size: 14px; line-height: 1.55; color: var(--lg-muted); hyphens: none; }
.lg-card__src   { margin: 18px 0 0; padding-top: 14px; border-top: 1px solid rgba(19,28,48,.07); font-size: 12px; color: var(--lg-muted-2); }

.lg-card__vis { position: relative; align-self: stretch; min-height: 240px; }

.lg-obj {
  position: absolute; pointer-events: none;
  right: -10%; top: 50%; transform: translateY(-50%);
  width: 116%; max-width: none; height: auto;
}

@media (prefers-reduced-motion: no-preference) {
  .lg-slide[data-slot="center"] .lg-obj { animation: lgSchweben 6.5s ease-in-out infinite; }
}
@keyframes lgSchweben { 0%,100% { translate: 0 0; } 50% { translate: 0 -6px; } }

.lg-car { --lg-dauer: 5000ms; }
.lg-car__steps { display: flex; align-items: center; gap: 26px; margin-top: 34px; justify-content: center; }
.lg-step {
  display: inline-flex; align-items: center; gap: 10px;
  border: 0; background: none; padding: 8px 2px; cursor: pointer;
  font: inherit; font-size: 12px; letter-spacing: .16em; color: #9AA0AC;
  transition: color 300ms ease;
}

.lg-step__bar {
  position: relative; display: block; width: 52px; height: 2px;
  border-radius: 999px; background: rgba(19,28,48,.13); overflow: hidden;
}
.lg-step__fill {
  position: absolute; left: 0; top: 0; bottom: 0; width: 100%;
  border-radius: 999px; background: var(--lg-blue);
  transform: scaleX(0); transform-origin: left center;
}
.lg-step[aria-selected="true"] { color: var(--lg-blue); }
.lg-step[aria-selected="true"] .lg-step__fill { animation: lgLaden var(--lg-dauer) linear forwards; }

.lg-car.is-paused .lg-step__fill { animation-play-state: paused; }
@keyframes lgLaden { from { transform: scaleX(.045); } to { transform: scaleX(1); } }
.lg-step:hover { color: #4D5360; }
.lg-step:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: 3px; border-radius: 6px; }

@media (max-width: 1199px) {
  .lg { padding-top: 92px; padding-bottom: 70px; }
  .lg__container { padding-inline: 32px; }
  .lg__head { margin-bottom: 56px; }
  .lg__title { font-size: clamp(56px, 8vw, 82px); }
  
  .lg__line { white-space: normal; }
  .lg__lead { max-width: 620px; margin-left: 0; padding-right: 0; }
  
  .lg-car__stage { --card-w: min(92%, 640px); --side-scale: .58; --off: 40vw; min-height: 460px; }
  .lg-card { min-height: 300px; padding: 30px 30px 28px; grid-template-columns: minmax(200px, .9fr) minmax(0, 1.1fr); gap: 22px; }
}

@media (max-width: 767px) {
  .lg { padding-top: 76px; padding-bottom: 64px; }
  .lg__container { padding-inline: 20px; }
  .lg__eyebrow { margin-bottom: 32px; }
  .lg__title { font-size: clamp(50px, 14vw, 68px); }
  .lg__lead { font-size: 17px; }
  .lg__head { margin-bottom: 40px; }
  
  .lg-car__stage { --card-w: 100%; --side-scale: .86; --off: 96vw; min-height: 0; display: block; }
  .lg-car__track { position: relative; inset: auto; min-height: 420px; }
  .lg-slide { top: 0; transform: translate(-50%, 0); }
  .lg-slide[data-slot="center"] { transform: translate(-50%, 0) scale(1); }
  .lg-slide[data-slot="left"]  { transform: translate(calc(-50% - var(--off)), 0) scale(var(--side-scale)); }
  .lg-slide[data-slot="right"] { transform: translate(calc(-50% + var(--off)), 0) scale(var(--side-scale)); }
  .lg-card { grid-template-columns: 1fr; gap: 20px; min-height: 0; padding: 26px 22px 24px; }
  .lg-card__value { font-size: clamp(46px, 14vw, 62px); }
  
  .lg-card__vis { min-height: 200px; }
  .lg-obj { right: -6%; width: 100%; }
  .lg-car__steps { gap: 18px; margin-top: 26px; }

}

@media (prefers-reduced-motion: reduce) {
  
  .lg-slide { transition: none; }
  .lg-obj { animation: none !important; }
  
  .lg-step[aria-selected="true"] .lg-step__fill { animation: none; transform: scaleX(1); }
}

.pr {
  --pr-blue:     var(--accent);
  --pr-border:   rgba(20, 30, 60, .09);
  --pr-border-2: rgba(20, 30, 60, .07);
  --pr-muted:    #6B707C;
  --pr-muted-2:  #7A808C;

  position: relative; overflow: clip;
  background: #FBFBFC; color: #08090B;
  padding-top: 110px; padding-bottom: 84px;
}
.pr__container { max-width: 1540px; margin-inline: auto; padding-inline: 48px; }

.pr__head { margin-bottom: 48px; }
.pr__eyebrow {
  display: flex; align-items: center; gap: 12px; margin: 0 0 40px;
  font-size: 14px; font-weight: 500; letter-spacing: .15em; text-transform: uppercase;
  color: #69707E;
}
.pr__eyebrow-line { width: 2px; height: 18px; border-radius: 999px; background: var(--pr-blue); }
.pr__num { color: var(--pr-blue); }

.pr__title {
  margin: 0; max-width: 1100px;
  font-size: clamp(60px, 6.2vw, 108px);
  line-height: .94; letter-spacing: -.06em; font-weight: 500; color: #08090B;
}
.pr__title-accent {
  background: linear-gradient(90deg, #AAB3FF 0%, #6273FF 32%, #465BF7 60%, #17249E 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
@supports not (background-clip: text) {
  .pr__title-accent { -webkit-text-fill-color: currentColor; background: none; color: var(--pr-blue); }
}
.pr__lead {
  margin: 22px 0 0; max-width: 600px;
  font-size: 18px; line-height: 1.65; color: var(--pr-muted);
}

.pr__grid {
  display: grid;
  grid-template-columns: minmax(420px, .82fr) minmax(0, 1.18fr);
  gap: clamp(48px, 5vw, 82px);
  align-items: start;
  margin-top: 48px;
}

.pr__list { position: relative; padding-left: 26px; }
.pr__rail {
  position: absolute; left: 0; top: 10px; bottom: 10px; width: 1px;
  background: var(--pr-border);
}

.pr__marker {
  position: absolute; left: -1px; width: 3px; border-radius: 999px;
  background: var(--pr-blue);
  top: var(--my, 10px); height: var(--mh, 60px);
  transition: top 520ms var(--quart), height 520ms var(--quart);
}

.pr__list[data-mode="auto"] .pr__marker {
  box-shadow: 0 0 0 3px rgba(82,99,255,.10), 0 0 18px 2px rgba(82,99,255,.35);
  animation: prAtmen 3.2s ease-in-out infinite;
}
@keyframes prAtmen { 0%,100% { opacity: .85; } 50% { opacity: 1; } }

.pr-row {
  position: relative; display: grid; width: 100%;
  grid-template-columns: auto minmax(0, 1fr); gap: 22px;
  align-items: start; text-align: left;
  border: 0; background: none; font: inherit; color: inherit; cursor: pointer;
  padding: 30px 0 32px;
  transition: opacity 300ms ease;
}
.pr-row + .pr-row { border-top: 1px solid var(--pr-border-2); }
.pr-row:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: 4px; border-radius: 8px; }

.pr-row__num {
  font-size: clamp(40px, 3.6vw, 68px); line-height: 1; letter-spacing: -.05em;
  font-weight: 400; color: #B9BDC7;
  transition: color 300ms ease;
}
.pr-row[aria-selected="true"] .pr-row__num { color: var(--pr-blue); }

.pr-row__body { display: block; min-width: 0; }
.pr-row__head { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.pr-row__name {
  font-size: clamp(21px, 1.5vw, 26px); line-height: 1.15; letter-spacing: -.028em;
  font-weight: 500; color: #4A505C;
  transition: color 300ms ease;
}
.pr-row[aria-selected="true"] .pr-row__name { color: #08090B; }
.pr-row:hover .pr-row__name { color: #21262F; }
.pr-row__brand { font-size: .78em; font-weight: 450; color: var(--pr-muted-2); }
.pr-row[aria-selected="true"] .pr-row__brand { color: var(--pr-muted); }

.pr-row__cat {
  display: block; margin-top: 9px;
  font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: #9AA0AC;
}
.pr-row__text {
  display: block; margin-top: 12px; max-width: 430px;
  font-size: 15px; line-height: 1.6; color: var(--pr-muted); hyphens: none;
}

.pr-row__cta {
  display: inline-flex; align-items: center; gap: 9px;
  margin-top: 0; height: 0; overflow: hidden;
  font-size: 15px; font-weight: 500; color: var(--pr-blue);
  opacity: 0; transition: opacity 300ms ease;
}
.pr-row[aria-selected="true"] .pr-row__cta { margin-top: 18px; height: auto; opacity: 1; }
.pr-row[aria-selected="true"]:hover .pr-row__cta svg { transform: translateX(3px); }
.pr-row__cta svg { transition: transform 220ms ease; }

.pr-badge {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 4px 10px; border-radius: 999px;
  border: 1px solid var(--pr-border); background: rgba(255,255,255,.5);
  font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: #767C89;
}
.pr-badge__dot { width: 5px; height: 5px; border-radius: 50%; background: #B4B9C4; }
.pr-badge--live .pr-badge__dot { background: var(--pr-blue); }

.pr__stage {
  position: relative; min-height: 720px;
  border: 1px solid rgba(20,30,60,.08); border-radius: 34px;
  background:
    radial-gradient(circle at 70% 35%, rgba(82,99,255,.04), transparent 40%),
    rgba(255,255,255,.42);
  overflow: hidden;
}

.pr-panel {
  position: absolute; inset: 0;
  padding: clamp(30px, 3vw, 46px);
  opacity: 0; transform: translateY(14px);
  transition: opacity 520ms var(--quart), transform 520ms var(--quart);
  pointer-events: none;
}
.pr-panel.is-on { opacity: 1; transform: none; pointer-events: auto; }
.pr-panel[hidden] { display: block; }   

.pr-panel__tag {
  position: relative; z-index: 3; margin: 0; font-size: 17px; letter-spacing: -.02em; color: #21262F;
}
.pr-panel__tag-num { color: var(--pr-blue); margin-right: 8px; }

.pr-bild {
  
  position: absolute; inset: 0;
  width: 100%; height: 100%; z-index: 1; pointer-events: none;
  object-fit: cover; object-position: center;
}

.pr-bild--cover { opacity: .85; z-index: 0; }

.pr-bild--zoom { transform: scale(1.18); }

.pr-tree {
  position: absolute; z-index: 2; right: clamp(24px, 3vw, 46px); top: 50%; transform: translateY(-54%);
  width: min(88%, 560px);
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 4px;
}
.pr-tree__root {
  padding: 18px 20px; border-radius: 16px;
  border: 1px solid rgba(82,99,255,.16);
  background: linear-gradient(150deg, rgba(255,255,255,.9), rgba(226,231,255,.6));
  box-shadow: 0 18px 44px rgba(40,54,140,.08);
}
.pr-tree__root-label {
  display: block; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--pr-blue);
}
.pr-tree__root-note { display: block; margin-top: 9px; font-size: 13px; color: #2C313B; white-space: nowrap; }

.pr-tree__wires { width: 100%; height: 220px; display: block; }

.pr-tree__out { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 26px; }
.pr-tree__out li { display: flex; align-items: flex-start; gap: 12px; }
.pr-tree__out li > span:last-child { font-size: 12.5px; line-height: 1.45; color: #5A606C; max-width: 196px; }
.pr-tree__out b { display: block; margin-bottom: 3px; font-size: 13.5px; font-weight: 500; color: #14161C; }
.pr-tree__k { flex: none; padding-top: 2px; font-size: 11px; letter-spacing: .14em; color: var(--pr-blue); }

.pr-assist {
  position: absolute; z-index: 3; left: clamp(24px, 3vw, 44px); bottom: clamp(24px, 3vw, 44px);
  margin: 0; width: min(74%, 268px);
  padding: 18px 20px 16px;
  border: 1px solid rgba(20,30,60,.08); border-radius: 16px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 16px 44px rgba(25,35,80,.07);
}
.pr-assist__head {
  display: flex; align-items: center; gap: 9px;
  font-size: 13.5px; font-weight: 500; color: #14161C;
}
.pr-assist__ico { color: var(--pr-blue); display: inline-flex; }
.pr-assist__beta {
  margin-left: auto; padding: 2px 8px; border-radius: 999px;
  background: rgba(82,99,255,.09); color: var(--pr-blue);
  font-size: 10.5px; letter-spacing: .06em;
}
.pr-assist__k { margin: 16px 0 0; font-size: 12.5px; color: var(--pr-muted-2); }
.pr-assist__v { margin: 3px 0 0; font-size: 19px; font-weight: 500; letter-spacing: -.02em; color: var(--pr-blue); }
.pr-assist__v--sm { font-size: 17px; }
.pr-assist__meter { margin: 14px 0 0; font-size: 12.5px; color: #4A505C; }
.pr-assist__meter b { font-weight: 500; color: #14161C; }
.pr-assist__bar { display: block; margin-top: 8px; height: 3px; border-radius: 999px; background: rgba(19,28,48,.10); overflow: hidden; }

.pr-assist__bar > i {
  display: block; height: 100%; width: var(--w); border-radius: 999px; background: var(--pr-blue);
  transform-origin: left center; transform: scaleX(0);
}
.pr-panel.is-on .pr-assist__bar > i { animation: prFuellen 1400ms cubic-bezier(.22,.72,.24,1) forwards; }
@keyframes prFuellen { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) {
  .pr-assist__bar > i { transform: scaleX(1); }
  .pr-panel.is-on .pr-assist__bar > i { animation: none; }
}
.pr-assist__row { display: flex; justify-content: space-between; gap: 12px; margin: 14px 0 0; font-size: 12.5px; color: var(--pr-muted-2); }
.pr-assist__row b { font-weight: 500; color: #14161C; }
.pr-assist__list { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.pr-assist__list li { display: flex; align-items: center; gap: 9px; font-size: 13px; color: #2C313B; }
.pr-assist__list svg { color: var(--pr-blue); flex: none; }

.pr-assist__note { margin: 14px 0 0; font-size: 10.5px; letter-spacing: .04em; color: #A2A8B4; }

.pr-route {
  position: absolute; z-index: 2; right: clamp(24px, 3vw, 46px); top: 50%; transform: translateY(-54%);
  width: min(88%, 560px);
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 4px;
}
.pr-route__in { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 28px; }
.pr-route__in li {
  display: flex; align-items: center; gap: 10px;
  font-size: 13.5px; color: #2C313B; white-space: nowrap;
}
.pr-route__ico {
  width: 38px; height: 38px; border-radius: 50%;
  display: grid; place-items: center;
  border: 1px solid rgba(20,30,60,.08); background: rgba(255,255,255,.8);
  color: var(--pr-blue);
}
.pr-route__wires { width: 100%; height: 220px; display: block; }
.pr-route__core {
  padding: 18px 20px; border-radius: 16px;
  border: 1px solid rgba(82,99,255,.16);
  background: linear-gradient(150deg, rgba(255,255,255,.9), rgba(226,231,255,.6));
  box-shadow: 0 18px 44px rgba(40,54,140,.08);
}
.pr-route__core-label { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--pr-blue); }
.pr-route__out { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.pr-route__out li {
  font-size: 13px; color: #2C313B; padding-left: 14px; position: relative;
}
.pr-route__out li::before {
  content: ''; position: absolute; left: 0; top: 7px;
  width: 5px; height: 5px; border-radius: 50%; background: var(--pr-blue); opacity: .55;
}

.pr__close {
  margin-top: 42px; padding-top: 24px;
  border-top: 1px solid rgba(20,30,60,.08);
  display: flex; justify-content: space-between; align-items: center; gap: 32px;
}
.pr__close-text { margin: 0; max-width: 720px; font-size: 15px; line-height: 1.6; color: var(--pr-muted); }
.pr__close-link {
  display: inline-flex; align-items: center; gap: 9px; flex: none;
  font-size: 15px; font-weight: 500; color: var(--pr-blue); text-decoration: none;
  transition: gap 220ms ease;
}
.pr__close-link:hover { gap: 12px; }
.pr__close-link:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: 4px; border-radius: 4px; }

@media (max-width: 1199px) {
  .pr { padding-top: 92px; padding-bottom: 72px; }
  .pr__container { padding-inline: 32px; }
  .pr__title { font-size: clamp(54px, 8vw, 84px); }
  .pr__grid { grid-template-columns: 1fr; gap: 52px; }
  .pr__stage { min-height: 560px; }
  .pr-route,
  .pr-tree { width: min(94%, 540px); right: 50%; transform: translate(50%, -54%); }
  .pr-route__objekt { width: clamp(160px, 26vw, 210px); }
}

@media (max-width: 767px) {
  .pr { padding-top: 76px; padding-bottom: 64px; }
  .pr__container { padding-inline: 20px; }
  .pr__eyebrow { margin-bottom: 30px; }
  .pr__title { font-size: clamp(46px, 13vw, 64px); }
  .pr__lead { font-size: 17px; }
  .pr__grid { margin-top: 34px; gap: 34px; }
  .pr__list { padding-left: 18px; }
  .pr-row { grid-template-columns: 1fr; gap: 10px; padding: 22px 0 24px; }
  .pr-row__num { font-size: 34px; }
  .pr-row__text { max-width: none; }
  
  .pr-row { min-height: 44px; }
  .pr__stage { min-height: 470px; border-radius: 24px; }
  .pr-panel { padding: 22px 18px; }
  
  .pr-bild {
    position: static; inset: auto; order: 2;
    width: 100%; height: 230px; margin-top: 14px;
    border-radius: 12px;
  }
  .pr-bild--cover { opacity: .85; }
  .pr-assist { position: static; width: 100%; margin-top: 18px; }
  .pr-panel { display: flex; flex-direction: column; }
  .pr-route { position: static; transform: none; width: 100%; margin-top: 16px; gap: 2px; }
  .pr-route__wires { height: 150px; }
  .pr-route__in { gap: 18px; }
  .pr-route__in li span:not(.pr-route__ico) { display: none; }
  .pr__close { flex-direction: column; align-items: flex-start; gap: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .pr__marker { transition: none; animation: none !important; }
  .pr-panel { transition: none; }
  .pr-row, .pr-row__cta svg, .pr__close-link { transition: none; }
}

.fq {
  --fq-blue:     var(--accent);
  --fq-border:   rgba(20, 30, 60, .09);
  --fq-border-2: rgba(20, 30, 60, .08);
  --fq-muted:    #6B707C;

  position: relative; overflow: clip;
  background: #FBFBFC; color: #08090B;
  padding-top: 110px; padding-bottom: 110px;
}
.fq__anchor { position: absolute; top: -90px; }
.fq__container { max-width: 1540px; margin-inline: auto; padding-inline: 48px; }

.fq__grid {
  display: grid;
  grid-template-columns: minmax(360px, .72fr) minmax(0, 1.55fr);
  gap: clamp(64px, 7vw, 120px);
  align-items: start;
}

.fq__intro { position: sticky; top: 120px; }
.fq__eyebrow {
  display: flex; align-items: center; gap: 12px; margin: 0 0 40px;
  font-size: 14px; font-weight: 500; letter-spacing: .15em; text-transform: uppercase;
  color: #69707E;
}
.fq__eyebrow-line { width: 2px; height: 18px; border-radius: 999px; background: var(--fq-blue); }
.fq__num { color: var(--fq-blue); }

.fq__title {
  margin: 0; max-width: 480px;
  
  font-size: clamp(46px, 4.05vw, 66px);
  line-height: .98; letter-spacing: -.055em; font-weight: 500; color: #08090B;
}
.fq__title-accent {
  background: linear-gradient(90deg, #AAB3FF 0%, #6273FF 32%, #465BF7 60%, #17249E 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
@supports not (background-clip: text) {
  .fq__title-accent { -webkit-text-fill-color: currentColor; background: none; color: var(--fq-blue); }
}
.fq__lead { margin: 28px 0 0; max-width: 390px; font-size: 17px; line-height: 1.65; color: var(--fq-muted); }

.fq__panel {
  border: 1px solid var(--fq-border); border-radius: 22px;
  background: rgba(255,255,255,.38);
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(25,35,80,.02);
}
.fq-item + .fq-item { border-top: 1px solid var(--fq-border-2); }
.fq-item__h { margin: 0; font-size: inherit; font-weight: inherit; }

.fq-row {
  display: grid; width: 100%;
  grid-template-columns: 80px minmax(0, 1fr) 36px;
  gap: 24px; align-items: center;
  min-height: 86px; padding: 18px 28px;
  border: 0; background: none; font: inherit; color: inherit; text-align: left; cursor: pointer;
  transition: background 200ms ease;
}
.fq-row:hover { background: rgba(82,99,255,.018); }
.fq-row:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: -4px; }

.fq-row__num { font-size: 20px; font-weight: 500; color: var(--fq-blue); }
.fq-row__q {
  font-size: clamp(20px, 1.7vw, 30px); line-height: 1.2; letter-spacing: -.025em;
  font-weight: 450; color: #2A2F39; hyphens: none;
  transition: color 200ms ease;
}
.fq-row:hover .fq-row__q { color: #08090B; }
.fq-row[aria-expanded="true"] .fq-row__q { color: #08090B; }

.fq-row__sign { position: relative; display: block; width: 22px; height: 22px; justify-self: end; }
.fq-row__sign::before,
.fq-row__sign::after {
  content: ''; position: absolute; left: 50%; top: 50%;
  background: #4A505C; border-radius: 2px;
  transition: transform 260ms var(--quart), background 200ms ease, opacity 200ms ease;
}
.fq-row__sign::before { width: 22px; height: 1.6px; transform: translate(-50%, -50%); }
.fq-row__sign::after  { width: 1.6px; height: 22px; transform: translate(-50%, -50%); }
.fq-row[aria-expanded="true"] .fq-row__sign::before { background: var(--fq-blue); }
.fq-row[aria-expanded="true"] .fq-row__sign::after  { opacity: 0; transform: translate(-50%, -50%) rotate(90deg); }

.fq-item__wrap {
  display: grid; grid-template-rows: 0fr;
  transition: grid-template-rows 400ms var(--quart);
}
.fq-item.is-open .fq-item__wrap { grid-template-rows: 1fr; }
.fq-item__inner {
  overflow: hidden;
  display: grid; grid-template-columns: minmax(300px, .95fr) minmax(260px, .75fr);
  gap: 48px; align-items: center;
  opacity: 0; transform: translateY(6px);
  transition: opacity 320ms var(--quart), transform 320ms var(--quart);
}
.fq-item.is-open .fq-item__inner { opacity: 1; transform: none; }

.fq-item__inner > * { padding-block: 6px 44px; }
.fq-item__text { padding-left: 132px; }
.fq-item__text p { margin: 0; max-width: 520px; font-size: 17px; line-height: 1.65; color: var(--fq-muted); }
.fq-item__link {
  display: inline-flex; align-items: center; gap: 9px; margin-top: 18px;
  font-size: 15px; font-weight: 500; color: var(--fq-blue); text-decoration: none;
  transition: gap 200ms ease;
}
.fq-item__link:hover { gap: 12px; }
.fq-item__link:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: 4px; border-radius: 4px; }

.fq-vis { padding-right: 40px; }
.fq-vis svg { display: block; width: 100%; max-width: 320px; height: auto; margin-inline: auto; }

@media (max-width: 1099px) {
  .fq { padding-top: 92px; padding-bottom: 92px; }
  .fq__container { padding-inline: 32px; }
  .fq__grid { grid-template-columns: 1fr; gap: 60px; }
  .fq__intro { position: static; }
  .fq__title { font-size: clamp(50px, 8vw, 74px); max-width: 650px; }
  .fq__lead { max-width: 650px; }
  .fq-item__text { padding-left: 104px; }
}
@media (max-width: 849px) {
  .fq-item__inner { grid-template-columns: 1fr; gap: 22px; }
  .fq-vis { padding-right: 0; padding-top: 0; }
}

@media (max-width: 699px) {
  .fq { padding-top: 76px; padding-bottom: 76px; }
  .fq__container { padding-inline: 20px; }
  .fq__eyebrow { margin-bottom: 30px; }
  .fq__title { font-size: clamp(44px, 13vw, 62px); }
  .fq__lead { font-size: 16px; }
  .fq__panel { border-radius: 18px; }
  .fq-row { grid-template-columns: 48px 1fr 28px; gap: 10px; padding: 20px 16px; min-height: 44px; }
  .fq-row__num { font-size: 15px; }
  .fq-row__q { font-size: clamp(18px, 5.2vw, 22px); }
  .fq-row__sign { width: 18px; height: 18px; }
  .fq-row__sign::before { width: 18px; }
  .fq-row__sign::after { height: 18px; }
  .fq-item__inner > * { padding-block: 0 26px; }
  .fq-item__text { padding-left: 16px; padding-right: 16px; }
  .fq-item__text p { font-size: 16px; }
  .fq-vis { padding-inline: 16px; }
  .fq-vis svg { max-width: 260px; }
}

@media (prefers-reduced-motion: reduce) {
  .fq-item__wrap, .fq-item__inner, .fq-row, .fq-row__sign::before, .fq-row__sign::after,
  .fq-item__link { transition: none; }
}

.fc {
  --fc-blue:   var(--accent);
  --fc-border: rgba(20, 30, 60, .08);
  --fc-muted:  #6B707C;

  position: relative; overflow: clip;
  background: #FBFBFC; color: #08090B;
  padding-top: 90px; padding-bottom: 80px;
}
.fc__container { max-width: 1540px; margin-inline: auto; padding-inline: 48px; }

.fc__panel {
  position: relative; min-height: 620px;
  display: grid;
  grid-template-columns: minmax(420px, .92fr) minmax(0, 1.08fr);
  gap: 64px; align-items: center;
  padding: clamp(56px, 5vw, 82px);
  border: 1px solid var(--fc-border); border-radius: 30px;
  background:
    radial-gradient(circle at 75% 36%, rgba(82,99,255,.045), transparent 38%),
    rgba(255,255,255,.46);
  box-shadow: 0 24px 80px rgba(25,35,80,.025);
  overflow: hidden;
}

.fc__eyebrow {
  display: flex; align-items: center; gap: 12px; margin: 0 0 36px;
  font-size: 14px; font-weight: 500; letter-spacing: .15em; text-transform: uppercase;
  color: #69707E;
}
.fc__eyebrow-line { width: 2px; height: 18px; border-radius: 999px; background: var(--fc-blue); }
.fc__num { color: var(--fc-blue); }

.fc__title {
  margin: 0; max-width: 560px;
  
  font-size: clamp(46px, 4.35vw, 72px);
  line-height: .96; letter-spacing: -.058em; font-weight: 500; color: #08090B;
}
.fc__title-accent {
  background: linear-gradient(90deg, #AAB3FF 0%, #6273FF 32%, #465BF7 60%, #17249E 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
@supports not (background-clip: text) {
  .fc__title-accent { -webkit-text-fill-color: currentColor; background: none; color: var(--fc-blue); }
}
.fc__lead { margin: 26px 0 0; max-width: 520px; font-size: 19px; line-height: 1.6; color: var(--fc-muted); }

.fc__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
.fc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 14px;
  height: 54px; padding-inline: 26px; border-radius: 10px;
  font-size: 15px; font-weight: 500; text-decoration: none;
  transition: background 200ms ease, border-color 200ms ease;
}
.fc-btn svg { transition: transform 200ms ease; }
.fc-btn:hover svg { transform: translateX(3px); }
.fc-btn:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: 4px; }

.fc-btn--primary {
  background: linear-gradient(100deg, #2847FF 0%, #5264FF 45%, #3344D8 100%);
  color: #FFFFFF;
}
.fc-btn--primary:hover { background: linear-gradient(100deg, #3253FF 0%, #5E6FFF 45%, #3D4EE2 100%); }
.fc-btn--ghost {
  border: 1px solid rgba(20,30,60,.12); background: rgba(255,255,255,.38); color: #14161C;
}
.fc-btn--ghost:hover { border-color: rgba(20,30,60,.2); background: rgba(255,255,255,.6); }

.fc__hint { margin: 16px 0 0; font-size: 13.5px; color: #8A909C; }

ul.fc__trust {
  list-style: none; margin: 46px 0 0; padding: 30px 0 0;
  border-top: 1px solid var(--fc-border);
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px;
}
.fc__trust li { display: flex; align-items: flex-start; gap: 12px; font-size: 14px; line-height: 1.45; color: #3E4451; }
.fc__trust-ico { color: var(--fc-blue); flex: none; margin-top: 1px; }

.fc__visual { align-self: stretch; min-height: 520px; }
.fc__bild {
  position: absolute; right: 0; top: 0; bottom: 0;
  width: 52%; height: 100%;
  object-fit: cover; object-position: center;
  
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 9%);
  mask-image: linear-gradient(to right, transparent 0, #000 9%);
}

@media (max-width: 1099px) {
  .fc__container { padding-inline: 32px; }
  .fc__panel { grid-template-columns: 1fr; gap: 60px; min-height: 0; }
  .fc__title { font-size: clamp(50px, 8vw, 78px); }
  .fc__visual { min-height: 400px; }
}

@media (max-width: 719px) {
  .fc { padding-top: 76px; padding-bottom: 70px; }
  .fc__container { padding-inline: 20px; }
  .fc__panel { padding: 28px 22px; border-radius: 22px; gap: 44px; }
  .fc__eyebrow { margin-bottom: 28px; }
  .fc__title { font-size: clamp(42px, 12vw, 60px); }
  .fc__lead { font-size: 17px; }
  .fc__actions { flex-direction: column; }
  .fc-btn { width: 100%; min-height: 52px; }
  
  ul.fc__trust { grid-template-columns: 1fr; margin-top: 36px; }
  .fc__visual { min-height: 0; }
  .fc__bild { position: static; width: 100%; height: auto; max-height: 420px; }
}

@media (prefers-reduced-motion: reduce) {
  .fc-btn, .fc-btn svg { transition: none; }
}

.ft {
  --ft-blue:   var(--accent);
  --ft-border: rgba(20, 30, 60, .08);
  --ft-line:   rgba(20, 30, 60, .07);
  --ft-muted:  #6B707C;

  position: relative; overflow: clip;
  background: #FBFBFC; color: #08090B;
  padding-top: 120px; padding-bottom: 36px;
}
.ft__container { max-width: 1540px; margin-inline: auto; padding-inline: 48px; }

.ft__grid {
  display: grid;
  grid-template-columns:
    minmax(320px, 1.15fr)
    minmax(150px, .62fr)
    minmax(150px, .62fr)
    minmax(150px, .62fr);
  gap: 0;
}

.ft__contact { padding-right: clamp(32px, 4vw, 72px); }
.ft__eyebrow {
  display: flex; align-items: center; gap: 12px; margin: 0 0 34px;
  font-size: 14px; font-weight: 500; letter-spacing: .15em; text-transform: uppercase;
  color: #69707E;
}
.ft__eyebrow-line { width: 2px; height: 18px; border-radius: 999px; background: var(--ft-blue); }
.ft__num { color: var(--ft-blue); }

.ft__title {
  margin: 0; max-width: 460px;
  font-size: clamp(46px, 4.3vw, 74px);
  line-height: .98; letter-spacing: -.055em; font-weight: 500; color: #08090B;
}

.ft__title-accent {
  background-image: linear-gradient(90deg,
    #AAB3FF 0%, #6273FF 16%, #465BF7 30%, #17249E 50%,
    #465BF7 70%, #6273FF 84%, #AAB3FF 100%);
  background-size: 220% 100%;
  background-repeat: repeat;
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
@media (prefers-reduced-motion: no-preference) {
  .ft__title-accent { animation: ftFliessen 9s linear infinite; }
}
@keyframes ftFliessen {
  from { background-position: 0 0; }
  to   { background-position: -220% 0; }
}
@supports not (background-clip: text) {
  .ft__title-accent { -webkit-text-fill-color: currentColor; background: none; color: var(--ft-blue); }
}
.ft__lead { margin: 28px 0 0; max-width: 360px; font-size: 17px; line-height: 1.65; color: var(--ft-muted); }

.ft__cta {
  display: inline-flex; align-items: center; justify-content: center; gap: 14px;
  width: min(100%, 320px); height: 54px; padding-inline: 24px; margin-top: 32px;
  border-radius: 10px; background: #15171C; color: #FFFFFF;
  font-size: 15px; font-weight: 500; text-decoration: none; box-shadow: none;
  transition: background 200ms ease;
}
.ft__cta:hover { background: #22252D; }
.ft__cta svg { transition: transform 200ms ease; }
.ft__cta:hover svg { transform: translateX(3px); }
.ft__cta:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: 4px; }

.ft__mailnote { margin: 26px 0 0; font-size: 14px; color: var(--ft-muted); }
.ft__mail {
  display: inline-block; margin-top: 6px;
  font-size: 16px; color: var(--ft-blue); text-decoration: none;
}
.ft__mail:hover { text-decoration: underline; text-underline-offset: .18em; }
.ft__mail:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: 4px; border-radius: 4px; }

.ft__col { padding-left: clamp(24px, 2.6vw, 44px); padding-right: 16px; }

.ft__col--line { padding-left: clamp(24px, 3vw, 56px); }

.ft__ch {
  margin: 0 0 30px;
  font-size: 12.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: #08090B;
}
.ft__links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 30px; }
.ft__links a {
  font-size: 15.5px; line-height: 1.5; color: var(--ft-muted); text-decoration: none;
  transition: color 200ms ease;
}
.ft__links a:hover { color: #08090B; }
.ft__links a:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: 4px; border-radius: 4px; }

.ft__company {
  margin: 0; font-style: normal;
  font-size: 15.5px; line-height: 1.6; color: #2C313B;
}
.ft__company-note { color: var(--ft-muted); font-size: 14px; }
.ft__companylink { margin: 18px 0 0; }
.ft__companylink a {
  font-size: 14px; color: var(--ft-muted); text-decoration: none;
  transition: color 200ms ease;
}
.ft__companylink a:hover { color: var(--ft-blue); }
.ft__companylink a:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: 4px; border-radius: 4px; }

.ft__bottom {
  margin-top: 90px; padding-top: 28px;
  border-top: 1px solid rgba(20,30,60,.09);
  display: flex; justify-content: space-between; align-items: center; gap: 24px;
}
.ft__copy  { margin: 0; font-size: 14px; color: var(--ft-muted); }
.ft__brand { margin: 0; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: #A2A8B4; }

@media (max-width: 1099px) {
  .ft { padding-top: 96px; }
  .ft__container { padding-inline: 32px; }
  .ft__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 56px; }
  .ft__contact { grid-column: 1 / -1; padding-right: 0; }
  .ft__col { padding-left: 0; }
  .ft__col--line { border-left: 0; }
  .ft__title { font-size: clamp(44px, 7vw, 64px); }
}

@media (max-width: 699px) {
  .ft { padding-top: 80px; padding-bottom: 32px; }
  .ft__container { padding-inline: 20px; }
  .ft__grid { grid-template-columns: 1fr; row-gap: 44px; }
  .ft__title { font-size: clamp(42px, 13vw, 60px); }
  .ft__lead { max-width: none; }
  .ft__cta { width: 100%; min-height: 52px; }
  .ft__ch { margin-bottom: 20px; }
  .ft__links { gap: 20px; }
  .ft__bottom { margin-top: 56px; flex-direction: column; align-items: flex-start; gap: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .ft__cta, .ft__cta svg, .ft__links a, .ft__companylink a { transition: none; }
}

@media (max-width: 991px) {
  
  .hero__grid { grid-template-columns: minmax(0, 1fr); }
  .hero__col { min-width: 0; }
  .hero__col > * { max-width: 100%; }
  
  .hero__title .split-word { white-space: normal; }
}

.pin-bahn.is-pin { position: relative; }
.pin-bahn.is-pin > .pin-halt { position: sticky; top: 92px; }

.pin-bahn--rs.is-pin .rs-card {
  opacity: 0; transform: translateY(30px);
  transition: opacity 620ms var(--quart), transform 620ms var(--quart);
}
.pin-bahn--rs.is-pin .rs__cards[data-step="1"] .rs-card:nth-child(1),
.pin-bahn--rs.is-pin .rs__cards[data-step="2"] .rs-card:nth-child(-n+2),
.pin-bahn--rs.is-pin .rs__cards[data-step="3"] .rs-card {
  opacity: 1; transform: none;
}

.pin-bahn--rs.is-pin .rs__cards .rs-card:hover { transform: translateY(-2px); }

.pin-bahn--lg.is-pin .lg-step[aria-selected="true"] .lg-step__fill {
  animation: none;
  transform: scaleX(var(--teil, 0));
}

@media (prefers-reduced-motion: reduce) {
  .pin-bahn--rs.is-pin .rs-card { transition: none; }
}

.wc-map__puls path,
.pr-tree__puls path,
.pr-lokal__puls path,
.pr-route__puls path {
  fill: none; stroke-width: 2.4; stroke-linecap: round;
  stroke-dasharray: 5 95;
  stroke-dashoffset: 100;
}
.wc-map__puls path   { stroke: var(--wm-blue); }
.pr-tree__puls path,
.pr-lokal__puls path,
.pr-route__puls path { stroke: var(--pr-blue); }

@media (prefers-reduced-motion: no-preference) {
  .wc-map__puls path,
  .pr-tree__puls path,
  .pr-lokal__puls path,
  .pr-route__puls path {
    animation: leitungPuls 2.8s linear infinite;
    animation-delay: var(--d, 0s);
  }
}
@keyframes leitungPuls {
  from { stroke-dashoffset: 100; }
  to   { stroke-dashoffset: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .wc-map__puls, .pr-tree__puls, .pr-lokal__puls, .pr-route__puls { display: none; }
}

.wc-prod__lines > span { transform-origin: left center; }

@media (prefers-reduced-motion: no-preference) {
  .wc-prod__lines > span {
    transform: scaleX(0);
    animation: wcTippen 9s var(--quart) infinite;
    animation-delay: calc(var(--n, 0) * .42s);
  }
}
@keyframes wcTippen {
  0%   { transform: scaleX(0); }
  11%  { transform: scaleX(1); }
  63%  { transform: scaleX(1); }
  73%  { transform: scaleX(0); }
  100% { transform: scaleX(0); }
}

@media (max-width: 719px) {

  .rs, .lg, .pr, .fc { padding-top: 56px; padding-bottom: 52px; }
  .fq { padding-top: 56px; padding-bottom: 56px; }
  .wm { padding-top: 64px; padding-bottom: 52px; }   
  .ft { padding-top: 64px; }
  .trenner { padding-block: 26px; }

  .hero .eyebrow { font-size: 11.5px; letter-spacing: .16em; }

  ul.rs__principles { padding: 6px 20px; }
  .rs-prin { padding-inline: 0; padding-block: 16px; gap: 14px; grid-template-columns: 42px minmax(0, 1fr); }
  .rs-prin__icon { width: 38px; height: 38px; }
  .rs-prin__icon svg { width: 19px; height: 19px; }
  .rs-prin__title { margin-bottom: 4px; font-size: 15px; }
  .rs-prin__text { font-size: 13.5px; line-height: 1.45; }

  .ft__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; row-gap: 34px; }
  .ft__contact { grid-column: 1 / -1; }
  .ft__col--line { border: 0; padding-left: 0; }
  .ft__ch { margin-bottom: 14px; }
  .ft__links { gap: 13px; }
  .ft__bottom { margin-top: 40px; }
}

@media (max-width: 400px) {
  .ft__grid { grid-template-columns: 1fr; row-gap: 30px; }
}

@media (max-width: 719px) {
  .ft__links { gap: 0; }
  .ft__links a { display: inline-flex; align-items: center; min-height: 40px; }
  .ft__mail,
  .ft__companylink a,
  .fq-item__link,
  .pr__close-link { display: inline-flex; align-items: center; min-height: 40px; }
  .brand { display: inline-flex; align-items: center; min-height: 44px; }
  
  .demo__btn { width: 34px; height: 34px; position: relative; }
  
  .demo__btn::after { content: ''; position: absolute; inset: -5px -2px; }
}

.rt {
  --rt-muted: #6B707C;
  position: relative; overflow: clip;
  background: #FBFBFC; color: #08090B;
  padding-top: clamp(96px, 11vw, 168px);
  padding-bottom: clamp(72px, 8vw, 120px);
}
.rt__container { max-width: 1540px; margin-inline: auto; padding-inline: 48px; }

.rt__head { max-width: 900px; margin-bottom: clamp(48px, 5vw, 84px); }
.rt__title {
  margin: 0; font-size: clamp(48px, 6vw, 96px);
  line-height: .98; letter-spacing: -.055em; font-weight: 500; color: #08090B;
}
.rt__lead { margin: 24px 0 0; max-width: 620px; font-size: 19px; line-height: 1.6; color: var(--rt-muted); }

.rt__text {
  max-width: 760px;
  padding-top: clamp(32px, 3.4vw, 48px);
  border-top: 1px solid rgba(20,30,60,.09);
  font-size: 16.5px; line-height: 1.72; color: #34394333;
  color: #343943;
}
.rt__text > *:first-child { margin-top: 0; }

.rt__text h2 {
  margin: clamp(44px, 4.4vw, 64px) 0 14px;
  font-size: clamp(22px, 2vw, 28px); line-height: 1.2;
  letter-spacing: -.025em; font-weight: 500; color: #08090B;
}
.rt__text h3 {
  margin: 32px 0 10px;
  font-size: 17.5px; line-height: 1.35; font-weight: 500; color: #14161C;
}
.rt__text h4 { margin: 24px 0 8px; font-size: 16px; font-weight: 500; color: #14161C; }
.rt__text p { margin: 0 0 16px; }
.rt__text ul, .rt__text ol { margin: 0 0 16px; padding-left: 22px; }
.rt__text li { margin-bottom: 8px; }
.rt__text strong, .rt__text b { font-weight: 500; color: #14161C; }
.rt__text address { font-style: normal; }

.rt__text a {
  color: var(--accent-ink); text-decoration: none;
  border-bottom: 1px solid rgba(64,63,186,.28);
  transition: border-color 180ms ease;
}
.rt__text a:hover { border-bottom-color: var(--accent-ink); }
.rt__text a:focus-visible { outline: 2px solid rgba(82,99,255,.55); outline-offset: 3px; border-radius: 3px; }

.rt__text p + p { margin-top: 0; }

@media (max-width: 1099px) {
  .rt__container { padding-inline: 32px; }
}
@media (max-width: 719px) {
  .rt { padding-top: clamp(80px, 18vw, 112px); padding-bottom: 64px; }
  .rt__container { padding-inline: 20px; }
  .rt__title { font-size: clamp(40px, 12vw, 60px); }
  .rt__lead { font-size: 17px; }
  .rt__text { font-size: 16px; }
  .rt__text h2 { margin-top: 40px; font-size: 21px; }
}

@media (max-width: 719px) {

  .pr-tree {
    position: static; width: auto; transform: none;
    display: block; order: 2; margin-top: 16px;
  }
  .pr-tree__wires { display: none; }
  .pr-tree__root {
    display: flex; align-items: baseline; gap: 10px;
    padding: 12px 14px; margin-bottom: 14px;
  }
  .pr-tree__root-note { margin-top: 0; }
  .pr-tree__out { gap: 14px; }
  .pr-tree__out li > span:last-child { max-width: none; }

  .pr-route {
    position: static; width: auto; transform: none;
    display: block; order: 2; margin-top: 16px;
  }
  .pr-route__wires { display: none; }
  .pr-route__in {
    flex-direction: row; flex-wrap: wrap; gap: 8px; margin-bottom: 16px;
  }
  .pr-route__in li {
    gap: 7px; padding: 7px 12px 7px 8px;
    border: 1px solid rgba(20,30,60,.08); border-radius: 999px;
    background: rgba(255,255,255,.72); font-size: 12.5px;
  }
  .pr-route__ico { width: 26px; height: 26px; }
  .pr-route__ico svg { width: 13px; height: 13px; }
  .pr-route__objekt {
    width: min(58%, 200px); margin: 0 auto; display: block;
  }

  .pr__stage { min-height: 0; height: auto; }
  .pr-panel {
    position: static; inset: auto;
    opacity: 1; transform: none;
    display: flex; flex-direction: column;
  }
  .pr-panel[hidden] { display: none; }
  .pr-panel__tag { order: 1; }
  .pr-assist { order: 3; }

  .pr-panel { position: relative; overflow: hidden; border-radius: 18px; }
  .pr-bild {
    position: absolute; inset: 0; order: 0;
    width: 100%; height: 100%; margin: 0;
    object-fit: cover; z-index: 0;
  }
  .pr-panel__tag,
  .pr-panel__text,
  .pr-tree,
  .pr-route,
  .pr-lokal,
  .pr-assist { position: relative; z-index: 1; }
}

@media (max-width: 767px) {
  .wc {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
    align-items: start;
    row-gap: 26px;
  }
}

@media (max-width: 991px) {

  html.js .nav__burger { margin-left: auto; }

  .hero { padding-top: 36px; }              

  .hero__grid { display: flex; flex-direction: column; gap: 0; align-items: stretch; }
  .hero__col  { display: contents; }

  .hero .eyebrow { order: 1; }
  .hero__title   { order: 2; margin-top: 16px; }
  .hero__lead    { order: 3; margin-top: 18px; }
  .hero__stage   { order: 4; margin-top: 40px; }
  .hero__actions { order: 5; margin-top: 30px; }

  .hero .eyebrow, .hero__title, .hero__lead { text-align: left; }
  .hero__actions { align-items: stretch; }

  .hero__object {
    display: block; position: static; transform: none;
    width: 100%; max-width: none; height: auto;
    margin: 0 0 -34px;
    -webkit-mask-image: linear-gradient(to bottom, #000 72%, transparent 97%);
    mask-image: linear-gradient(to bottom, #000 72%, transparent 97%);
  }
  
  .hero__wires, .orbit { display: none; }

  .hero__stage {
    position: relative; display: block;
    aspect-ratio: auto; padding: 0;
    min-height: 0;
    transition: min-height .52s var(--quart);
  }
  .trigger { margin-top: 0; }
  html.js .hero__grid.is-demo .hero__stage { min-height: 560px; }
  
  .trigger {
    position: static; transform: none;
    margin: 0 auto; align-items: center; gap: 8px;
  }
  html.js [data-flow].is-connecting .trigger { transform: scale(.94); }
  
  .trigger__btn {
    width: 62px; height: 62px;
    box-shadow:
      0 2px 6px rgba(12,12,12,.10),
      0 14px 34px rgba(12,12,12,.16),
      0 0 0 6px color-mix(in srgb, var(--accent) 7%, transparent);
  }
  .trigger__core { width: 32px; height: 32px; }

  html.js .demo {
    position: absolute; inset: 0;
    width: 100%; margin: 0;
    display: flex;
    overflow: hidden;
  }
  
  .hero__object { transition: opacity .34s var(--ease); }
  html.js .hero__grid.is-demo .hero__object {
    
    animation: none;
    opacity: 0;
  }

  .demo { gap: 8px; }
  .demo__status { padding-block: 5px; }
  .dcard { padding: 10px 13px; gap: 7px; }
  .dcard__text { font-size: 13.5px; line-height: 1.4; }
  .dcard__sub { font-size: 11.5px; }
  .fwave { height: 26px; }
  .dcard__tags { gap: 6px; }
  .dcard__tags > li { padding: 3px 8px; font-size: 11px; }

  .hero__bar { margin-top: 40px; }
}

@media (max-width: 767px) {
  .lg-car__stage { --card-w: 86%; --side-scale: .88; --off: 80vw; }
  
  .lg-slide[data-slot="left"],
  .lg-slide[data-slot="right"] { opacity: .45; }
  .lg-slide:not([data-slot="center"]) .lg-card { cursor: pointer; }
  
  .lg-car__stage { touch-action: pan-y; }
  
  .lg-car__steps { margin-top: 30px; }
}

@media (max-width: 767px) {
  .pr__grid { display: flex; flex-direction: column; }
  .pr__list[data-aufklapper] { display: block; }

  .pr__list[data-aufklapper] .pr-row {
    position: relative;
    border: 1px solid rgba(20,30,60,.10);
    border-radius: 16px;
    background: rgba(255,255,255,.55);
    padding: 18px 44px 18px 18px;
    margin-bottom: 10px;
    transition: border-color 220ms ease, background 220ms ease;
  }
  .pr__list[data-aufklapper] .pr-row::after {
    content: ''; position: absolute; right: 20px; top: 26px;
    width: 9px; height: 9px;
    border-right: 1.6px solid #8A909C; border-bottom: 1.6px solid #8A909C;
    transform: rotate(45deg);
    transition: transform 260ms var(--quart), border-color 220ms ease;
  }
  .pr__list[data-aufklapper] .pr-row[aria-selected="true"] {
    border-color: rgba(82,99,255,.34);
    background: rgba(255,255,255,.9);
  }
  .pr__list[data-aufklapper] .pr-row[aria-selected="true"]::after {
    transform: rotate(-135deg); border-color: var(--accent);
  }

  .pr__list[data-aufklapper] .pr__stage {
    margin: -4px 0 16px;
    border-radius: 16px;
  }

  .pr__list[data-aufklapper] .pr__marker,
  .pr__list[data-aufklapper] .pr__rail { display: none; }
  .pr__list[data-aufklapper] { padding-left: 0; }
}

@media (max-width: 767px) {
  .wm-stack { --stack-top: 74px; --stack-step: 11px; }
  .wm-slot { position: sticky; }
  .wm-slot + .wm-slot { margin-top: 28px; }
  
  .wc { opacity: 1 !important; filter: none !important; }
  
  .wm__head { position: static; }
}

@media (max-width: 767px) {

  .fc__panel { display: flex; flex-direction: column; }
  .fc__visual { order: 1; margin-bottom: 4px; }
  .fc__body   { order: 2; }

  ul.fc__trust { padding-top: 26px; gap: 22px; }
  
  .fc__trust li br { display: none; }

  .rs__wires { display: none; }

  .rs-vis-bild { height: 46%; }
  .rs-card__vis { min-height: 0; }
}

@media (max-width: 767px) {
  .rs__panel {
    border: 0; background: none; box-shadow: none;
    border-radius: 0; padding: 0; min-height: 0;
    overflow: visible;
  }
  .rs__panel-title {
    margin-bottom: 18px;
    font-size: 13px; letter-spacing: .14em; text-transform: uppercase;
    color: var(--rs-muted, #6D7280); font-weight: 500;
  }
}

@media (max-width: 767px) {
  .lg-car__steps { margin-top: 34px; gap: 22px; position: relative; z-index: 4; }
  .lg-step { font-size: 13px; color: #6B707C; }
  .lg-step[aria-selected="true"] { color: #14161C; }
  .lg-step__bar { width: 44px; height: 3px; background: rgba(19,28,48,.20); }
}

.pr-panel__text { display: none; }

@media (max-width: 767px) {
  .pr__list[data-aufklapper] {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px; padding-left: 0;
  }
  .pr__list[data-aufklapper] .pr__rail,
  .pr__list[data-aufklapper] .pr__marker { display: none; }

  .pr__list[data-aufklapper] .pr-row {
    display: block; margin: 0;
    padding: 12px 10px 13px; min-height: 0;
    border: 1px solid rgba(20,30,60,.10); border-radius: 14px;
    background: rgba(255,255,255,.55); text-align: left;
    transition: border-color 200ms ease, background 200ms ease;
  }
  .pr__list[data-aufklapper] .pr-row::after { content: none; }
  .pr__list[data-aufklapper] .pr-row[aria-selected="true"] {
    border-color: rgba(82,99,255,.38);
    background: rgba(255,255,255,.95);
  }
  .pr__list[data-aufklapper] .pr-row__num {
    display: block; font-size: 15px; line-height: 1.1; color: #9AA0AC;
  }
  .pr__list[data-aufklapper] .pr-row[aria-selected="true"] .pr-row__num { color: var(--pr-blue); }
  .pr__list[data-aufklapper] .pr-row__body { display: block; margin-top: 6px; }
  .pr__list[data-aufklapper] .pr-row__head { display: block; }
  .pr__list[data-aufklapper] .pr-row__name {
    display: block; font-size: 13.5px; line-height: 1.25; color: #14161C;
  }
  .pr__list[data-aufklapper] .pr-row__brand { display: none; }   
  .pr__list[data-aufklapper] .pr-row__cat,
  .pr__list[data-aufklapper] .pr-row__text,
  .pr__list[data-aufklapper] .pr-row__cta { display: none; }
  
  .pr__list[data-aufklapper] .pr-badge { display: none; }

  .pr__stage { margin-top: 14px; }
  .pr-panel__text {
    display: block; order: 2;
    margin: 10px 0 0; font-size: 14.5px; line-height: 1.55; color: #4A505C;
  }
}

@media (max-width: 767px) {
  .pr-tree,
  .pr-route,
  .pr-lokal {
    position: relative; inset: auto;
    width: 520px; max-width: none; transform: none;
    margin: 0 auto; zoom: .60;
  }

  .pr-tree { display: grid; }
  .pr-route { display: grid; }
  .pr-tree__wires,
  .pr-route__wires { display: block; }
  .pr-tree__out li > span:last-child { max-width: 200px; }
  .pr-route__in { flex-direction: column; gap: 28px; margin-bottom: 0; }
  .pr-route__in li {
    border: 0; background: none; padding: 0; font-size: 13.5px;
  }
  .pr-route__ico { width: 38px; height: 38px; }
  .pr-route__ico svg { width: 15px; height: 15px; }
  .pr-route__objekt { width: 190px; margin: 0; }

  .pr-lokal { height: 320px; }
  .pr-lokal__grenze,
  .pr-lokal__marke,
  .pr-lokal__wires,
  .pr-lokal__k,
  .pr-lokal__kern { display: block; }
  .pr-lokal__k { display: inline-flex; }
  .pr-lokal__objekt { width: 150px; }

  .pr-panel { align-items: stretch; }
}

@media (max-width: 767px) {
  .pr-assist { display: none; }

  .pr-panel { padding: 20px 16px 24px; }
  .pr-panel__tag { margin: 0; }
  .pr-panel__text { margin: 10px 0 26px; }
  .pr-tree, .pr-route, .pr-lokal { margin-top: 0; margin-bottom: 0; }
  .pr-lokal { height: 300px; }
}

.rt--fehler { min-height: 62vh; display: grid; align-items: center; }
.rt--fehler .rt__head { margin-bottom: 0; }
.rt__wege { margin: 34px 0 0; }
.rt__klein { margin: 22px 0 0; font-size: 14.5px; color: #767C89; }
.rt__klein a { color: var(--accent-ink); text-decoration: none; border-bottom: 1px solid rgba(64,63,186,.28); }
.rt__klein a:hover { border-bottom-color: var(--accent-ink); }

@media (max-width: 719px) {
  .fc__title { line-height: 1.02; }
}