body{margin:0;background:#F2F3F5}
#werkzeuge,#subset,#ansichten,#prinzipien,#roadmap,#beta,#top{scroll-margin-top:24px}
.arrived h2{animation:arrive 1.6s cubic-bezier(.2,.7,.2,1)}

/* floating back-to-top */
.totop{position:fixed;right:24px;bottom:24px;z-index:30;width:52px;height:52px;border-radius:50%;background:#fff;border:1px solid #E5E6EA;color:#6556C7;display:grid;place-items:center;text-decoration:none;box-shadow:0 1px 2px rgba(32,33,38,.06),0 14px 30px -12px rgba(32,33,38,.35);opacity:0;visibility:hidden;transform:translateY(16px) scale(.9);transition:opacity .35s,transform .45s cubic-bezier(.2,.7,.2,1),visibility .35s,background .2s,color .2s,border-color .2s}
.totop:hover{background:#6556C7;border-color:#6556C7;color:#fff}
.totop svg{transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.totop:hover svg{transform:translateY(-3px)}
.totop:focus-visible{outline:2px solid #6556C7;outline-offset:3px}
.totop.show{opacity:1;visibility:visible;transform:none}
@supports (animation-timeline: scroll()){
  .totop:not(.js){animation:totop linear both;animation-timeline:scroll(root)}
  @keyframes totop{0%,9%{opacity:0;visibility:hidden;transform:translateY(16px) scale(.9)}13%,84%{opacity:1;visibility:visible;transform:none}88%,100%{opacity:0;visibility:hidden;transform:translateY(16px) scale(.9)}}
}
@keyframes arrive{0%,25%{color:#6556C7}100%{color:inherit}}
a{color:#6556C7}a:hover{color:#5546B5}
.ts *{box-sizing:border-box}
.ts{font-family:"Geist",ui-sans-serif,system-ui,-apple-system,"Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.mono{font-family:"Geist Mono",ui-monospace,"SF Mono",Menlo,monospace}
.ts ::selection{background:#6556C7;color:#fff}

/* baseline grid behind the hero */
.grid-bg{background-image:linear-gradient(to bottom,rgba(101,86,199,.09) 1px,transparent 1px);background-size:100% 28px;-webkit-mask-image:radial-gradient(ellipse 70% 80% at 30% 20%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse 70% 80% at 30% 20%,#000 30%,transparent 75%)}

/* nav */
.navlink{color:#4F5159;text-decoration:none;font-size:15px;padding:10px 4px;position:relative;transition:color .2s}
.navlink::after{content:"";position:absolute;left:4px;right:4px;bottom:4px;height:2px;background:#6556C7;transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.navlink:hover{color:#202126}.navlink:hover::after{transform:scaleX(1)}
.lang{color:#62646C;text-decoration:none;font-size:13px;font-weight:500;padding:6px 9px;border-radius:7px;transition:background .2s,color .2s}
.lang:hover{background:#E5E6EA;color:#202126}
.lang.on{background:#F0EDFF;color:#6556C7}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 22px;border-radius:10px;font-size:16px;font-weight:500;text-decoration:none;transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s,background .2s,border-color .2s,color .2s}
.btn-p{background:#6556C7;color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 6px 18px -6px rgba(101,86,199,.6)}
.btn-p:hover{background:#5546B5;color:#fff;transform:translateY(-2px);box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 14px 28px -10px rgba(101,86,199,.75)}
.btn-s{background:#fff;color:#202126;border:1px solid #D6D8DE}
.btn-s:hover{color:#202126;border-color:#6556C7;transform:translateY(-2px)}
.btn-d{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.28)}
.btn-d:hover{color:#fff;border-color:#fff;transform:translateY(-2px)}
.arr{display:inline-block;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
a:hover .arr{transform:translateX(5px)}
a:hover .arr.up{transform:translateY(-4px)}
.btn:focus-visible,.navlink:focus-visible,.tab:focus-visible,.lang:focus-visible,.plink:focus-visible{outline:2px solid #6556C7;outline-offset:3px}

/* hero entrance */
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes lineUp{from{transform:translateY(105%)}to{transform:none}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(101,86,199,.45)}70%{box-shadow:0 0 0 8px rgba(101,86,199,0)}100%{box-shadow:0 0 0 0 rgba(101,86,199,0)}}
.in{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
.d1{animation-delay:.1s}.d2{animation-delay:.55s}.d3{animation-delay:.7s}.d4{animation-delay:.85s}.d5{animation-delay:.4s}
.ln{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.ln>span{display:inline-block;animation:lineUp 1s cubic-bezier(.2,.75,.15,1) both}
.ln:nth-child(2)>span{animation-delay:.12s}
.dot{width:7px;height:7px;border-radius:50%;background:#6556C7;animation:pulse 2.2s infinite}
.mark{position:relative;color:#6556C7;white-space:nowrap}
@keyframes grow{to{transform:scaleX(1)}}
.mark{animation:wght 1.6s .45s cubic-bezier(.3,0,.2,1) both}
@keyframes wght{from{font-weight:100;letter-spacing:-.02em}to{font-weight:600;letter-spacing:-.045em}}

/* scroll progress */
.sprog{position:fixed;top:0;left:0;right:0;height:3px;background:#6556C7;transform-origin:left;transform:scaleX(0);z-index:20;display:none}
@supports (animation-timeline: scroll()){
  .sprog{display:block;animation:grow linear both;animation-timeline:scroll(root)}
}

/* kerning demo */
.kern{position:relative;display:inline-block;font-family:"Familjen Grotesk","Geist",sans-serif;font-weight:500;line-height:1.02;letter-spacing:0}
.k-off{font-kerning:none;font-feature-settings:"kern" 0;color:#C9CBD3}
.k-on{position:absolute;inset:0;font-kerning:normal;color:#202126;clip-path:inset(-20px 100% -20px 0);transition:clip-path 1.5s cubic-bezier(.65,0,.25,1)}
.kerned .k-on{clip-path:inset(-20px -20px -20px 0)}
.k-line{position:absolute;top:-10px;bottom:-10px;left:0;width:2px;margin-left:-1px;background:#6556C7;transition:left 1.5s cubic-bezier(.65,0,.25,1)}
.kerned .k-line{left:100%}
.kstate{position:absolute;top:14px;left:16px;font-size:12px;padding:5px 10px;border-radius:999px;background:#fff;border:1px solid #E5E6EA;color:#62646C;transition:color .4s,border-color .4s,background .4s}
.kerned .kstate{color:#5546B5;border-color:#D4D1E0;background:#F0EDFF}
.ks-on{display:none}.kerned .ks-on{display:inline}.kerned .ks-off{display:none}
.k-line::before{content:"";position:absolute;top:-5px;left:-4px;width:10px;height:10px;border-radius:50%;background:#6556C7}
/* convert slot machine */
.slot{height:40px;overflow:hidden;border-radius:9px;background:#fff;border:1px solid #D6D8DE;min-width:96px}
.slot-t{background:#6556C7;border-color:#6556C7}
.slot-in{--h:40px;display:flex;flex-direction:column;transition:transform .75s cubic-bezier(.7,0,.2,1)}
.slot-n .slot-in{--h:20px}
.cvz.snap .slot-in{transition:none !important}
@keyframes slotroll{from{transform:translateY(0)}to{transform:translateY(calc(var(--h) * -6))}}
.cvz.rolling .slot-in{animation:slotroll 7s linear infinite;animation-delay:var(--cvd,0s) !important;transition:none !important}
.slot-i{display:block;height:40px;line-height:40px;text-align:center;font-size:16px;padding:0 14px;white-space:nowrap;color:#202126}
.slot-t .slot-i{color:#fff}
.slot-n{height:20px;border:0;background:transparent;border-radius:0}
.slot-n .slot-i{height:20px;line-height:20px;font-size:12px;color:#62646C;letter-spacing:.04em;text-transform:uppercase}

/* family menu demo */
.menu{background:#fff;border:1px solid #E5E6EA;border-radius:12px;padding:10px;box-shadow:0 18px 40px -28px rgba(32,33,38,.35)}
.ghead{font-family:"Source Sans 3","Geist",sans-serif;font-size:18px;font-weight:400;color:#202126;padding:8px 12px 6px;opacity:0;transform:translateY(4px);transition:opacity .5s,transform .6s cubic-bezier(.2,.7,.2,1)}
.grouped .ghead{opacity:1;transform:none}
.mrow{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;font-family:"Source Sans 3","Geist",sans-serif;font-size:20px;color:#202126;transition:padding .6s cubic-bezier(.2,.7,.2,1),background .3s}
.grouped .mrow{padding-left:34px}
.mrow:nth-child(2){transition-delay:.04s}.mrow:nth-child(3){transition-delay:.08s}.mrow:nth-child(4){transition-delay:.12s}.mrow:nth-child(5){transition-delay:.16s}
.mico{width:16px;height:12px;border:1.5px solid #B9BCC5;border-radius:3px;flex:none;transition:opacity .3s,width .5s,margin .5s}
.grouped .mico{opacity:0;width:0;margin-right:-10px}
.pref{display:inline-block;white-space:pre;overflow:hidden;max-width:9em;vertical-align:bottom;transition:max-width .7s cubic-bezier(.2,.7,.2,1),opacity .4s}
.grouped .pref{max-width:0;opacity:0}
.s-after{display:none}.grouped .s-after{display:inline}.grouped .s-before{display:none}
.fdot{width:7px;height:7px;border-radius:50%;background:#B9BCC5;transition:background .4s}
.grouped .fdot{background:#2B7A4B}

/* word ticker */
.ticker{height:1.4em;overflow:hidden;display:inline-block;vertical-align:bottom}
.ticker-in{display:flex;flex-direction:column;animation:tick 10s cubic-bezier(.7,0,.2,1) infinite}
.ticker-in span{height:1.4em;line-height:1.4em;white-space:nowrap}
@keyframes tick{0%,20%{transform:translateY(0)}25%,45%{transform:translateY(-1.4em)}50%,70%{transform:translateY(-2.8em)}75%,95%{transform:translateY(-4.2em)}100%{transform:translateY(-5.6em)}}

/* report window */
.win{background:#fff;border:1px solid #E5E6EA;border-radius:16px;box-shadow:0 1px 2px rgba(32,33,38,.04),0 30px 60px -30px rgba(32,33,38,.28),0 18px 36px -24px rgba(101,86,199,.25);overflow:hidden}
.prog{height:4px;background:#E5E6EA;border-radius:4px;overflow:hidden}
.prog i{display:block;height:100%;background:#6556C7;transform-origin:left;transform:scaleX(0);animation:fill 2.1s .5s cubic-bezier(.6,0,.2,1) forwards}
@keyframes fill{to{transform:scaleX(1)}}
.step{color:#62646C;animation:stepOn .3s both}
.step:nth-child(1){animation-delay:.5s}.step:nth-child(2){animation-delay:1.1s}.step:nth-child(3){animation-delay:1.8s}.step:nth-child(4){animation-delay:2.5s}
@keyframes stepOn{from{color:#62646C}to{color:#202126}}
.step b{display:inline-block;width:6px;height:6px;border-radius:50%;background:#D6D8DE;margin-right:7px;vertical-align:middle;animation:stepDot .3s both;animation-delay:inherit}
@keyframes stepDot{to{background:#6556C7}}
.rrow{opacity:0;animation:rowIn .5s cubic-bezier(.2,.7,.2,1) forwards}
.rrow:nth-child(1){animation-delay:2.7s}.rrow:nth-child(2){animation-delay:2.82s}.rrow:nth-child(3){animation-delay:2.94s}.rrow:nth-child(4){animation-delay:3.06s}.rrow:nth-child(5){animation-delay:3.18s}.rrow:nth-child(6){animation-delay:3.3s}.rrow:nth-child(7){animation-delay:3.42s}
@keyframes rowIn{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
.chk{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%}
.badge-pop{opacity:0;animation:pop .5s 3.7s cubic-bezier(.3,1.6,.5,1) forwards}
@keyframes pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
.flow-arr{display:inline-block;animation:nudge 1.6s ease-in-out infinite}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}
.replay{font:inherit;font-size:13px;color:#62646C;background:none;border:0;padding:8px 10px;border-radius:8px;cursor:pointer;display:inline-flex;gap:6px;align-items:center;min-height:36px;transition:background .2s,color .2s}
.replay:hover{background:#F0EDFF;color:#6556C7}
.replay svg{transition:transform .5s}.replay:hover svg{transform:rotate(-180deg)}

/* marquee */
.marq{display:flex;width:max-content;animation:marq 38s linear infinite}
.marq:hover{animation-play-state:paused}
.marq.big{font-size:clamp(17px,1.7vw,22px);font-weight:500;letter-spacing:-.01em;line-height:1.15;color:#202126;animation-duration:60s}
.marq.rev{animation-direction:reverse;animation-duration:70s;color:#B9BCC5}
.mq:hover .marq{animation-play-state:paused}
.marq .sep{font-size:.42em;color:#6556C7}
@keyframes marq{to{transform:translateX(-50%)}}

/* big product shot, tilts flat on scroll */
.stage{perspective:1600px}
.tilt{transform-origin:50% 0;transition:transform .6s}
@supports (animation-timeline: view()){
  .tilt{animation:untilt linear both;animation-timeline:view();animation-range:entry 0% cover 80%}
  @keyframes untilt{from{transform:rotateX(18deg) scale(.9) translateY(40px);opacity:.4}to{transform:none;opacity:1}}
  .reveal{animation:revealUp linear both;animation-timeline:view();animation-range:entry 0% entry 35%}
  @keyframes revealUp{from{opacity:0}to{opacity:1}}
}

/* tool cards */
.tool{background:#fff;border:1px solid #E5E6EA;border-radius:18px;transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s,border-color .3s}
.tool:hover{transform:translateY(-6px);border-color:#D4D1E0;box-shadow:0 28px 50px -30px rgba(101,86,199,.45)}
.tool .num{transition:color .3s}.tool:hover .num{color:#6556C7}
.viz{height:150px;border-radius:12px;background:#F2F3F5;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}
/* convert viz */
.fmt{font-size:13px;padding:7px 11px;border-radius:7px;background:#fff;border:1px solid #D6D8DE;color:#4F5159;transition:all .45s cubic-bezier(.2,.7,.2,1)}
.tool:hover .fmt.t{background:#6556C7;border-color:#6556C7;color:#fff;transform:translateY(-3px)}
.tool:hover .fmt.s{opacity:.55}
.cv-arr{color:#62646C;transition:transform .45s,color .3s}.tool:hover .cv-arr{transform:translateX(6px);color:#6556C7}
/* family viz */
.ftiles{display:flex;gap:10px}
.ftile{width:58px;height:68px;background:#fff;border:1px solid #D6D8DE;border-radius:10px;display:flex;align-items:center;justify-content:center;font-family:"Source Sans 3","Geist",sans-serif;font-size:30px;line-height:1;color:#202126;box-shadow:0 8px 18px -12px rgba(32,33,38,.35);transition:transform .8s cubic-bezier(.3,1.3,.4,1),border-color .4s,box-shadow .4s}
.ftile:nth-child(1){transform:translate(-14px,-16px) rotate(-11deg)}
.ftile:nth-child(2){transform:translate(8px,18px) rotate(8deg);transition-delay:.05s}
.ftile:nth-child(3){transform:translate(-6px,-12px) rotate(6deg);transition-delay:.1s}
.ftile:nth-child(4){transform:translate(14px,14px) rotate(-7deg);transition-delay:.15s}
.grouped .ftile,.tool:hover .ftile{transform:none;border-color:#D4D1E0;box-shadow:0 2px 6px -4px rgba(32,33,38,.3)}
.fbr{width:262px;height:9px;border:2px solid #6556C7;border-top:0;border-radius:0 0 5px 5px;transform:scaleX(0);transition:transform .6s cubic-bezier(.2,.7,.2,1) .35s}
.grouped .fbr,.tool:hover .fbr{transform:scaleX(1)}
.flab{font-size:12px;color:#5546B5;opacity:0;transition:opacity .4s .55s}
.grouped .flab,.tool:hover .flab{opacity:1}
/* transfer viz */
.tx{position:relative;width:min(304px, calc(100% - 28px));height:112px}
.tcard{position:absolute;top:0;width:92px;height:112px;border-radius:10px;background:#fff;border:1px solid #D6D8DE;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
.tcard .ta{font-size:42px;line-height:1;color:#202126}
.tcard .tl{font-size:9.5px;color:#62646C;text-align:center;line-height:1.25;letter-spacing:.02em}
.tsrc{left:0}.tsrc .ta{font-family:"Space Grotesk","Geist",sans-serif;font-weight:500}
.tdst{right:0;border-style:dashed;animation:tdst 3s cubic-bezier(.4,0,.2,1) infinite}
.tdst .ta{font-family:"Familjen Grotesk","Geist",sans-serif;font-weight:500;color:#B9BCC5;animation:tgta 3s cubic-bezier(.4,0,.2,1) infinite}
@keyframes tdst{0%,44%{border-color:#D6D8DE;border-style:dashed}54%,90%{border-color:#6556C7;border-style:solid}100%{border-color:#D6D8DE;border-style:dashed}}
@keyframes tgta{0%,44%{color:#B9BCC5}54%,90%{color:#202126}100%{color:#B9BCC5}}
.tlane{position:absolute;left:92px;right:92px;height:0;border-top:1.5px dashed #D6D8DE}
.tpill{position:absolute;left:58px;font-size:11px;padding:4px 8px;border-radius:6px;background:#6556C7;color:#fff;white-space:nowrap;opacity:0;animation:tpill 3s cubic-bezier(.6,0,.25,1) infinite}
.tpill.p2{animation-delay:.45s}
@keyframes tpill{0%{left:58px;opacity:0;transform:none}8%{left:58px;opacity:1}40%{left:calc(100% - 122px);opacity:1;transform:none}50%,100%{left:calc(100% - 122px);opacity:0;transform:scale(.7)}}
.tchk{position:absolute;top:-8px;right:-8px;width:22px;height:22px;border-radius:50%;background:#2B7A4B;color:#fff;display:grid;place-items:center;opacity:0;transform:scale(.4);animation:tchk 3s cubic-bezier(.3,1.5,.5,1) infinite}
@keyframes tchk{0%,48%{opacity:0;transform:scale(.4)}56%,88%{opacity:1;transform:scale(1)}96%,100%{opacity:0;transform:scale(.4)}}

/* gallery tabs */
.tab{all:unset;box-sizing:border-box;display:block;width:100%;text-align:left;cursor:pointer;padding:20px 22px 22px;border-radius:14px;transition:background .3s}
.tab:hover{background:rgba(255,255,255,.6)}
.tab .tt{color:#4F5159;transition:color .3s}
.tab .td{max-height:0;opacity:0;overflow:hidden;transition:max-height .5s cubic-bezier(.2,.7,.2,1),opacity .4s,margin .4s}
.tab.on{background:#fff;box-shadow:0 1px 2px rgba(32,33,38,.05),0 12px 30px -20px rgba(32,33,38,.3)}
.tab.on .tt{color:#202126}
.tab.on .td{max-height:160px;opacity:1;margin-top:8px}
.tab .tn{color:#62646C;transition:color .3s}.tab.on .tn{color:#6556C7}
.tbar{height:2px;background:#E5E6EA;border-radius:2px;overflow:hidden;margin-top:16px;opacity:0;transition:opacity .3s}
.tab.on .tbar{opacity:1}
.tbar i{display:block;height:100%;background:#6556C7;transform:scaleX(0);transform-origin:left}
.tab.on .tbar i{animation:fill 5s linear forwards}
.gal.paused .tab.on .tbar i{animation-play-state:paused}
.shots{position:relative;aspect-ratio:1600/1079}
.shot{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transform:translateY(16px) scale(.975);transition:opacity .6s,transform .8s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.shot.on{opacity:1;transform:none}

/* principles */
.prow{border-top:1px solid #D6D8DE;transition:background .3s}
.prow:last-child{border-bottom:1px solid #D6D8DE}
.prow .pn{transition:color .3s,transform .4s}
.prow:hover .pn{color:#6556C7}
.prow h3{transition:color .3s}
.prow:hover h3{color:#6556C7}
.mlink{color:#5546B5;text-decoration:none;border-bottom:1px solid currentColor;transition:opacity .2s}.mlink:hover{opacity:.7}
.plink{color:#202126;text-decoration:none;font-weight:500;display:inline-flex;gap:8px;align-items:center;border-bottom:1px solid #D6D8DE;padding:6px 0;transition:border-color .3s,color .3s}
.plink:hover{color:#6556C7;border-color:#6556C7}

/* beta band */
@keyframes bob{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-12px) rotate(-1deg)}}
.bob{animation:bob 6s ease-in-out infinite}
.ring{position:absolute;inset:-28px;border-radius:50%;border:1px solid rgba(179,169,242,.35);animation:ringP 4s ease-out infinite}
.ring.r2{animation-delay:2s}
@keyframes ringP{from{transform:scale(.7);opacity:.9}to{transform:scale(1.5);opacity:0}}
.foot a{color:#4F5159;text-decoration:none;font-size:14px;transition:color .2s}
.foot a:hover{color:#6556C7}

/* Type-1-Abschnitt */
.t1list li{position:relative;padding:10px 0 10px 26px;border-top:1px solid #F2F3F5;font-size:16px;line-height:1.5;color:#202126}
.t1list li:last-child{border-bottom:1px solid #F2F3F5}
.t1list li::before{content:"";position:absolute;left:2px;top:18px;width:8px;height:8px;border-radius:2px;background:#6556C7}
.t1grid{display:grid;grid-template-columns:auto minmax(40px,1fr) auto;column-gap:16px;row-gap:12px;align-items:center;width:100%;max-width:400px}
.t1head{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#62646C}
.t1in,.t1out{display:block;padding:9px 12px;border-radius:9px;font-size:14px;line-height:20px;text-align:center;border:1px solid #D6D8DE}
.t1in{min-width:104px;background:#fff;color:#4F5159;animation:t1in 7.2s ease-in-out infinite}
.t1out{min-width:80px;background:transparent;border-style:dashed;border-color:#C9CBD3;color:transparent;animation:t1out 7.2s ease-in-out infinite}
.t1ln{position:relative;height:2px;border-radius:1px;background:#D6D8DE}
.t1ln::after{content:"";position:absolute;right:-1px;top:-4px;border-left:7px solid #D6D8DE;border-top:5px solid transparent;border-bottom:5px solid transparent}
.t1ln::before{content:"";position:absolute;top:-3px;left:0;width:8px;height:8px;border-radius:50%;background:#6556C7;opacity:0;animation:t1dot 7.2s cubic-bezier(.5,0,.3,1) infinite}
.r2{animation-delay:1.2s}.r2::before{animation-delay:1.2s}
.r3{animation-delay:2.4s}.r3::before{animation-delay:2.4s}
.r4{animation-delay:3.6s}.r4::before{animation-delay:3.6s}
@keyframes t1in{0%,3%{background:#fff;border-color:#D6D8DE;color:#4F5159}8%,18%{background:#F0EDFF;border-color:#B3A9F2;color:#5546B5}26%,100%{background:#fff;border-color:#D6D8DE;color:#4F5159}}
@keyframes t1dot{0%,7%{left:0;opacity:0}10%{left:0;opacity:1}20%{left:calc(100% - 14px);opacity:1}24%,100%{left:calc(100% - 14px);opacity:0}}
@keyframes t1out{0%,20%{background:transparent;border-color:#C9CBD3;border-style:dashed;color:transparent;transform:scale(1)}24%{background:#6556C7;border-color:#6556C7;border-style:solid;color:#fff;transform:scale(1.06)}28%,84%{background:#6556C7;border-color:#6556C7;border-style:solid;color:#fff;transform:scale(1)}92%,100%{background:transparent;border-color:#C9CBD3;border-style:dashed;color:transparent;transform:scale(1)}}
.t1side{font-size:11px;color:#2B7A4B;background:#E7F5EC;padding:5px 10px;border-radius:6px;white-space:nowrap}

/* mobiles Menü */
.mnav{display:none;position:relative}
.mnav summary{list-style:none;cursor:pointer;width:44px;height:44px;border-radius:11px;border:1px solid #D6D8DE;background:#fff;display:grid;place-items:center;color:#202126;transition:border-color .2s,background .2s,color .2s}
.mnav summary::-webkit-details-marker{display:none}
.mnav summary:focus-visible{outline:2px solid #6556C7;outline-offset:2px}
.mnav[open] summary{background:#6556C7;border-color:#6556C7;color:#fff}
.mnav .i-close{display:none}.mnav[open] .i-open{display:none}.mnav[open] .i-close{display:block}
.mnav-panel{position:absolute;right:0;top:54px;width:min(300px,calc(100vw - 32px));background:#fff;border:1px solid #E5E6EA;border-radius:16px;padding:8px;box-shadow:0 30px 60px -24px rgba(32,33,38,.35);animation:menuIn .3s cubic-bezier(.2,.7,.2,1)}
.mnav-panel a{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:0 14px;border-radius:10px;color:#202126;text-decoration:none;font-size:17px;font-weight:500}
.mnav-panel a::after{content:"→";color:#B9BCC5;transition:color .2s,transform .2s}
.mnav-panel a:hover,.mnav-panel a:active{background:#F0EDFF;color:#5546B5}
.mnav-panel a:hover::after{color:#6556C7;transform:translateX(3px)}
@keyframes menuIn{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}

@media (max-width:760px){
  .hide-s{display:none !important}
  .mnav{display:block}
  .lang{padding:13px 10px}
  div:has(> .shots){order:-1}
  .fam span{transform:none !important}
  .foot a{display:inline-block;padding:10px 0}
  .more{padding:10px 0 !important}
}
@media (max-width:480px){
  .hide-xs{display:none !important}
  #type1 > div{padding:28px 20px !important}
  .t1in{min-width:88px}
  .t1out{min-width:64px}
  .t1grid{column-gap:10px}
  .mrow{font-size:16px;white-space:nowrap;padding-top:7px;padding-bottom:7px}
  .ghead{font-size:16px}
  .rrow{gap:6px !important;padding:9px 6px !important;font-size:13px !important}
  .rrow .mono{font-size:11px !important;overflow-wrap:anywhere}
}
/* subset */
.ssviz{flex:1 1 380px;min-width:0;background:#F2F3F5;border-radius:14px;padding:28px 24px;display:flex;flex-direction:column;align-items:center;gap:16px}
.sslab{margin:0;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#62646C}
.sstext{display:flex;gap:1px;padding:10px 18px;border-radius:10px;background:#fff;border:1px solid #E5E6EA;font-size:40px;line-height:1.1;font-weight:600;letter-spacing:-.02em}
.sstext span{position:relative;color:#B9BCC5;animation:sschar 8s infinite;animation-delay:calc(var(--i) * .18s)}
.sstext span::after{content:"";position:absolute;left:1px;right:1px;bottom:-4px;height:3px;border-radius:2px;background:#6556C7;transform:scaleX(0);animation:ssline 8s infinite;animation-delay:calc(var(--i) * .18s)}
@keyframes sschar{0%,4%{color:#B9BCC5}9%,88%{color:#202126}96%,100%{color:#B9BCC5}}
@keyframes ssline{0%,4%{transform:scaleX(0)}9%,88%{transform:scaleX(1)}96%,100%{transform:scaleX(0)}}
.ssgl{display:flex;gap:6px}
.ssgl span{position:relative;width:38px;height:38px;border-radius:8px;display:grid;place-items:center;background:#6556C7;color:#fff;font-size:18px;font-weight:600;opacity:0;animation:ssgl 8s infinite;animation-delay:calc(1.2s + var(--i) * .14s)}
.ssgl span.add{background:#fff;color:#5546B5;border:1.5px dashed #6556C7}
.ssgl i{position:absolute;top:-8px;right:-10px;font-style:normal;font-size:10px;font-weight:600;color:#fff;background:#C98A00;padding:1px 5px;border-radius:999px}
@keyframes ssgl{0%{opacity:0;transform:scale(.6)}5%,70%{opacity:1;transform:none}78%,100%{opacity:0;transform:scale(.9)}}
.ssfmt{display:flex;gap:6px;font-size:12px}
.ssfmt span{padding:5px 10px;border-radius:7px;border:1px solid #D6D8DE;background:#fff;color:#62646C;animation:ssfmt 8s infinite;animation-delay:calc(2.4s + var(--i) * .7s)}
@keyframes ssfmt{0%{background:#fff;border-color:#D6D8DE;color:#62646C}3%,9%{background:#202126;border-color:#202126;color:#fff}13%,100%{background:#fff;border-color:#D6D8DE;color:#62646C}}
.ssfoot{display:flex;gap:10px;align-items:center}
.sskb{position:relative;width:64px;height:22px;font-size:12px;overflow:hidden}
.sskb b{position:absolute;inset:0;display:flex;align-items:center;font-weight:400}
.sskb b:first-child{color:#62646C;animation:sskb1 8s infinite}
.sskb b:last-child{color:#2B7A4B;font-weight:600;animation:sskb2 8s infinite}
@keyframes sskb1{0%,40%{transform:none;opacity:1}46%,90%{transform:translateY(-100%);opacity:0}96%,100%{transform:none;opacity:1}}
@keyframes sskb2{0%,40%{transform:translateY(100%);opacity:0}46%,90%{transform:none;opacity:1}96%,100%{transform:translateY(100%);opacity:0}}
.sschk{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:#2B7A4B;background:#E7F5EC;padding:5px 10px;border-radius:6px;opacity:0;animation:sschk 8s infinite}
.sschk::before{content:"✓";font-weight:700}
@keyframes sschk{0%,48%{opacity:0;transform:scale(.8)}54%,90%{opacity:1;transform:none}96%,100%{opacity:0}}
@media (max-width:480px){.sstext{font-size:32px;padding:8px 14px}.ssgl span{width:34px;height:34px}.ssfmt{flex-wrap:wrap;justify-content:center}}
/* roadmap */
.rmtrack{position:relative;height:22px;margin:56px 0 18px}
.rmtrack::before{content:"";position:absolute;left:0;right:0;top:10px;height:2px;border-radius:1px;background:repeating-linear-gradient(90deg,#D6D8DE 0 8px,transparent 8px 14px)}
.rmfill{position:absolute;left:0;top:9px;height:4px;border-radius:2px;background:#6556C7;width:0;animation:rmfill 9s cubic-bezier(.4,0,.2,1) infinite}
.rd{position:absolute;top:3px;width:16px;height:16px;border-radius:50%;background:#F2F3F5;border:2px solid #D6D8DE;box-sizing:border-box}
.rd.d1{left:24px;animation:rmd1 9s infinite}
.rd.d2{left:calc((100% - 60px) / 4 + 44px);animation:rmd2 9s infinite}
.rd.d3{left:calc((100% - 60px) / 2 + 64px)}
.rd.d4{left:calc((100% - 60px) * .75 + 84px)}
@keyframes rmfill{0%{width:0;opacity:1}8%{width:40px}30%,88%{width:calc((100% - 60px) / 4 + 52px);opacity:1}96%,100%{width:calc((100% - 60px) / 4 + 52px);opacity:0}}
@keyframes rmd2{0%,26%{background:#F2F3F5;border-color:#D6D8DE}31%,90%{background:#2B7A4B;border-color:#2B7A4B}100%{background:#F2F3F5;border-color:#D6D8DE}}
@keyframes rmd1{0%,6%{background:#F2F3F5;border-color:#D6D8DE}10%,90%{background:#2B7A4B;border-color:#2B7A4B}100%{background:#F2F3F5;border-color:#D6D8DE}}
.rmgrid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.rmcard{background:#fff;border:1px solid #E5E6EA;border-radius:18px;padding:12px 12px 26px;transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s,border-color .3s}
.rmcard:hover{transform:translateY(-4px);border-color:#D4D1E0;box-shadow:0 24px 44px -30px rgba(101,86,199,.45)}
.rmcard h3{margin:12px 12px 0;font-size:22px;line-height:1.2;font-weight:600;letter-spacing:-.02em}
.rmcard p{margin:8px 12px 0;font-size:15px;line-height:1.55;color:#4F5159;text-wrap:pretty}
.rmchip{display:inline-flex;align-items:center;gap:8px;margin:20px 12px 0;padding:5px 10px;border-radius:999px;background:#F2F3F5;color:#62646C;font-size:12px;font-weight:500}
.rmchip::before{content:"";width:6px;height:6px;border-radius:50%;background:#B9BCC5}
.rmchip.ok{background:#E7F5EC;color:#2B7A4B}.rmchip.ok::before{background:#2B7A4B}
.rmchip.dev{background:#F0EDFF;color:#5546B5}.rmchip.dev::before{background:#6556C7;animation:pulse 2.2s infinite}
.rmviz{height:128px;border-radius:12px;background:#F2F3F5;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:14px}
/* Basic switch */
.rmsw{position:relative;display:grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:11px;background:#fff;border:1px solid #E5E6EA;font-size:14px;font-weight:500}
.rmo{position:relative;z-index:1;padding:8px 14px;text-align:center;transition:color .3s}
.rmo.a{animation:rmoa 6s infinite}.rmo.b{animation:rmob 6s infinite}
.rmknob{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:8px;background:#6556C7;animation:rmknob 6s cubic-bezier(.6,0,.2,1) infinite}
@keyframes rmknob{0%,40%{transform:translateX(100%)}50%,90%{transform:translateX(0)}100%{transform:translateX(100%)}}
@keyframes rmoa{0%,44%{color:#62646C}50%,90%{color:#fff}98%,100%{color:#62646C}}
@keyframes rmob{0%,40%{color:#fff}46%,92%{color:#62646C}100%{color:#fff}}
/* Subsetting */
.rmsub{display:grid;grid-template-columns:repeat(4,26px);gap:4px}
.rmsub span{height:26px;border-radius:6px;background:#fff;border:1px solid #E5E6EA;display:grid;place-items:center;font-size:14px;font-weight:500;color:#202126}
.rmsub .s{animation:rmsel 7s infinite;animation-delay:var(--d)}
.rmsub .u{animation:rmdim 7s infinite}
@keyframes rmsel{0%,8%{background:#fff;border-color:#E5E6EA;color:#202126}14%,86%{background:#6556C7;border-color:#6556C7;color:#fff}94%,100%{background:#fff;border-color:#E5E6EA;color:#202126}}
@keyframes rmdim{0%,40%{opacity:1}50%,84%{opacity:.25}94%,100%{opacity:1}}
.rmkb{position:relative;width:58px;height:20px;font-size:12px;overflow:hidden}
.rmkb b{position:absolute;inset:0;font-weight:400;display:flex;align-items:center}
.rmkb b:first-child{color:#62646C;animation:rmk1 7s infinite}
.rmkb b:last-child{color:#2B7A4B;font-weight:600;animation:rmk2 7s infinite}
@keyframes rmk1{0%,44%{transform:none;opacity:1}52%,88%{transform:translateY(-100%);opacity:0}96%,100%{transform:none;opacity:1}}
@keyframes rmk2{0%,44%{transform:translateY(100%);opacity:0}52%,88%{transform:none;opacity:1}96%,100%{transform:translateY(100%);opacity:0}}
/* Deutsche Oberfläche */
.rmlang{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.rml{position:relative;display:block;width:132px;height:34px;border-radius:9px;background:#fff;border:1px solid #E5E6EA;overflow:hidden;font-size:14px;font-weight:500}
.rml b{position:absolute;inset:0;padding:0 12px;display:flex;align-items:center;font-weight:500}
.rml b:first-child{animation:rmk1 6s infinite}.rml b:last-child{color:#5546B5;animation:rmk2 6s infinite}
.rml.r2 b{animation-delay:.18s}
.rmflag{position:absolute;top:12px;right:12px;width:30px;height:20px;border-radius:5px;background:#202126;color:#fff;font-size:10px;overflow:hidden}
.rmflag b{position:absolute;inset:0;display:grid;place-items:center;font-weight:400}
.rmflag b:first-child{animation:rmk1 6s infinite}.rmflag b:last-child{animation:rmk2 6s infinite}
/* Glyph Transfer */
.rmgt{position:relative;display:flex;gap:44px;align-items:center}
.rmbox{position:relative;display:flex;align-items:center;gap:2px;height:54px;padding:0 12px;border-radius:10px;background:#fff;border:1px solid #E5E6EA;font-size:26px;font-weight:600;letter-spacing:-.02em}
.rmbox i{position:absolute;left:0;right:0;bottom:-18px;text-align:center;font-style:normal;font-size:10px;font-weight:400;letter-spacing:.06em;text-transform:uppercase;color:#62646C;font-family:"Geist Mono",ui-monospace,Menlo,monospace}
.rmslot{display:inline-block;width:18px;height:30px;border-radius:5px;border:1.5px dashed #B9BCC5;animation:rmslot 6s infinite}
.rmfly{position:absolute;z-index:2;left:30px;top:50%;margin-top:-17px;width:24px;height:34px;display:grid;place-items:center;font-size:26px;font-weight:600;color:#6556C7;animation:rmfly 6s cubic-bezier(.5,0,.3,1) infinite}
@keyframes rmfly{0%,10%{transform:translate(0,0);opacity:0}16%{opacity:1;transform:translate(0,-8px)}48%{transform:translate(103px,-8px);opacity:1}56%,100%{transform:translate(103px,0);opacity:0}}
@keyframes rmslot{0%,50%{border-color:#B9BCC5;background:transparent}56%,88%{border-color:#6556C7;background:#F0EDFF}96%,100%{border-color:#B9BCC5;background:transparent}}
@media (max-width:1060px){.rmgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.rmtrack{display:none}.rmgrid{margin-top:48px}}
@media (max-width:600px){.rmgrid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){
  .ticker-in,.ring,.bob,.dot{animation:none !important}
  .marq.big{animation-duration:120s}
  .marq.rev{animation-duration:140s}
  .sprog{display:none !important}
  .tilt,.reveal{animation:none !important;opacity:1 !important;transform:none !important}
}

/* ===== Unterseiten ===== */
.wrap{max-width:1240px;margin:0 auto;padding:0 24px}
.sub-hero{position:relative;border-bottom:1px solid #E5E6EA}
.sub-hero .inner{position:relative;max-width:1240px;margin:0 auto;padding:80px 24px 56px}
.eyebrow{margin:0;font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#6556C7}
.sub-hero h1{margin:16px 0 0;font-size:clamp(2.6rem,6vw,5rem);line-height:1;font-weight:600;letter-spacing:-.045em;text-wrap:balance}
.note{position:relative;display:block;margin:28px 0 0;max-width:760px;padding:14px 18px 14px 38px;border-radius:12px;background:#fff;border:1px solid #E5E6EA;font-size:15px;line-height:1.55;color:#4F5159}
.note::before{content:"";position:absolute;left:18px;top:22px;width:8px;height:8px;border-radius:50%;background:#C98A00}
.note.ok::before{background:#2B7A4B}
.note a{color:#5546B5}

/* legal layout */
.legal-wrap{max-width:1240px;margin:0 auto;padding:56px 24px 40px;display:flex;flex-wrap:wrap;gap:40px 72px;align-items:flex-start}
.toc{flex:0 1 260px;position:sticky;top:24px}
.toc p{margin:0 0 12px;font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#62646C}
.toc ol{list-style:none;margin:0;padding:0;border-left:1px solid #D6D8DE}
.toc a{display:block;padding:7px 0 7px 16px;margin-left:-1px;border-left:2px solid transparent;color:#4F5159;text-decoration:none;font-size:14px;line-height:1.35;transition:color .2s,border-color .2s}
.toc a:hover{color:#202126;border-left-color:#B3A9F2}
.toc a.on{color:#6556C7;border-left-color:#6556C7}
.legal{flex:999 1 560px;min-width:0;max-width:760px}
.legal section{padding:28px 0 30px;border-top:1px solid #E5E6EA;scroll-margin-top:24px}
.legal section:first-child{border-top:0;padding-top:0}
.legal h2{margin:0 0 14px;font-size:24px;line-height:1.2;font-weight:600;letter-spacing:-.02em}
.legal p{margin:0 0 14px;font-size:17px;line-height:1.65;color:#4F5159;text-wrap:pretty;overflow-wrap:anywhere}
.legal p:last-child{margin-bottom:0}
.legal strong{color:#202126;font-weight:600}
.legal a{color:#5546B5;text-decoration-thickness:1px;text-underline-offset:3px}
.legal.arrived h2,.legal section.arrived h2{animation:arrive 1.6s cubic-bezier(.2,.7,.2,1)}
.updated{max-width:1240px;margin:0 auto;padding:0 24px 72px;font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:12px;color:#62646C}
.savelink{display:inline-flex;gap:8px;align-items:center;margin-top:22px;font-size:14px;font-weight:500;color:#202126;text-decoration:none;border-bottom:1px solid #D6D8DE;padding:4px 0}
.savelink:hover{color:#6556C7;border-color:#6556C7}

/* pricing */
.price{max-width:1240px;margin:0 auto;padding:56px 24px 0}
.price-card{background:#fff;border:1px solid #E5E6EA;border-radius:22px;overflow:hidden;box-shadow:0 30px 60px -40px rgba(32,33,38,.35)}
.price-top{display:flex;flex-wrap:wrap;gap:24px 48px;justify-content:space-between;align-items:flex-end;padding:40px 40px 36px;border-bottom:1px solid #E5E6EA}
.price-top h2{margin:0;font-size:28px;font-weight:600;letter-spacing:-.02em}
.price-top .sub{margin:8px 0 0;color:#4F5159;font-size:16px}
.amount{text-align:right}
.amount .launch{display:inline-block;font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:12px;color:#5546B5;background:#F0EDFF;padding:5px 10px;border-radius:999px}
.amount strong{display:block;margin-top:10px;font-size:clamp(4rem,9vw,6.5rem);line-height:.9;font-weight:600;letter-spacing:-.05em;color:#202126}
.amount .reg{display:block;margin-top:10px;font-size:15px;color:#62646C}
.amount s{color:#62646C}
.price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.price-grid div{padding:26px 40px 28px;border-bottom:1px solid #F2F3F5;border-right:1px solid #F2F3F5}
.price-grid strong{display:flex;gap:10px;align-items:center;font-size:17px;font-weight:600}
.price-grid strong::before{content:"";width:18px;height:18px;flex:none;border-radius:50%;background:#E7F5EC url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B7A4B' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/11px no-repeat}
.price-grid p{margin:8px 0 0 28px;font-size:15px;line-height:1.55;color:#4F5159}
.price-foot{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;justify-content:space-between;padding:26px 40px;background:#F7F7F9}
.price-foot p{margin:0;max-width:640px;font-size:15px;line-height:1.55;color:#4F5159}
.pending{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:10px;background:#FDF3D7;color:#7A5000;font-weight:500;font-size:15px}
.pending::before{content:"";width:7px;height:7px;border-radius:50%;background:#C98A00;animation:pulseA 2.2s infinite}
@keyframes pulseA{0%{box-shadow:0 0 0 0 rgba(201,138,0,.5)}70%{box-shadow:0 0 0 8px rgba(201,138,0,0)}100%{box-shadow:0 0 0 0 rgba(201,138,0,0)}}

/* beta page */
.chips{display:flex;flex-wrap:wrap;gap:8px;max-width:1240px;margin:0 auto;padding:28px 24px 0}
.chips a{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;background:#fff;border:1px solid #E5E6EA;color:#4F5159;text-decoration:none;font-size:14px;font-weight:500;transition:border-color .2s,color .2s,background .2s}
.chips a:hover{border-color:#6556C7;color:#6556C7}
.chips a.on{background:#6556C7;border-color:#6556C7;color:#fff}
.bsec{max-width:1240px;margin:0 auto;padding:104px 24px 0;scroll-margin-top:16px}
.bhead{display:flex;flex-wrap:wrap;gap:20px 64px;align-items:flex-end;justify-content:space-between;margin-bottom:44px}
.bhead h2{margin:0;flex:1 1 460px;font-size:clamp(2.2rem,4.4vw,3.6rem);line-height:1.04;font-weight:600;letter-spacing:-.035em}
.bhead p{margin:0;flex:1 1 340px;max-width:460px;font-size:17px;line-height:1.55;color:#4F5159;text-wrap:pretty}
.tool .more{display:inline-flex;gap:8px;margin-top:16px;color:#202126;font-weight:500;text-decoration:none;border-bottom:1px solid #D6D8DE;padding:4px 0}
.tool .more:hover{color:#6556C7;border-color:#6556C7}
.tool .eg{margin:10px 0 0;font-size:15px;line-height:1.55;color:#62646C}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:20px;counter-reset:st}
.steps li{position:relative;background:#fff;border:1px solid #E5E6EA;border-radius:18px;padding:28px 26px 30px;counter-increment:st;transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s,border-color .3s}
.steps li:hover{transform:translateY(-4px);border-color:#D4D1E0;box-shadow:0 24px 44px -30px rgba(101,86,199,.45)}
.steps li::before{content:"0" counter(st);display:block;font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:44px;line-height:1;color:#D4D1E0;margin-bottom:22px;transition:color .3s}
.steps li:hover::before{color:#6556C7}
.steps strong{display:block;font-size:19px;line-height:1.3;font-weight:600;letter-spacing:-.01em}
.steps p{margin:10px 0 0;font-size:15px;line-height:1.55;color:#4F5159}
.strip{margin:0 0 20px;padding:14px 18px;border-radius:12px;background:#F0EDFF;border:1px solid #D4D1E0;color:#4F5159;font-size:15px;line-height:1.5}
.strip strong{color:#202126}
:root{interpolate-size:allow-keywords}
.acc{border-top:1px solid #D6D8DE}
.acc:last-of-type{border-bottom:1px solid #D6D8DE}
.acc summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:20px;padding:26px 4px;font-size:21px;font-weight:600;letter-spacing:-.015em;transition:color .2s}
.acc summary::-webkit-details-marker{display:none}
.acc summary:hover{color:#6556C7}
.acc summary:focus-visible{outline:2px solid #6556C7;outline-offset:2px;border-radius:6px}
.acc summary .n{font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:13px;font-weight:400;color:#62646C;min-width:36px}
.acc summary .pm{margin-left:auto;flex:none;width:32px;height:32px;border-radius:50%;border:1px solid #D6D8DE;display:grid;place-items:center;color:#6556C7;transition:transform .4s cubic-bezier(.2,.7,.2,1),background .2s,border-color .2s}
.acc[open] summary .pm{transform:rotate(45deg);background:#6556C7;border-color:#6556C7;color:#fff}
.acc::details-content{height:0;overflow:clip;transition:height .45s cubic-bezier(.2,.7,.2,1),content-visibility .45s allow-discrete}
.acc[open]::details-content{height:auto}
.acc .body{padding:0 4px 30px 60px;max-width:860px}
.acc ol{margin:0 0 16px;padding-left:20px}
.acc li{margin:0 0 10px;font-size:16px;line-height:1.6;color:#4F5159;padding-left:6px}
.acc li::marker{font-family:"Geist Mono",ui-monospace,Menlo,monospace;color:#6556C7;font-size:13px}
.acc p{margin:0 0 12px;font-size:16px;line-height:1.6;color:#4F5159}
.acc strong{color:#202126;font-weight:600}
.access{background:#202126;color:#fff;border-radius:24px;padding:48px;display:flex;flex-wrap:wrap;gap:40px 64px;position:relative;overflow:hidden}
.access::before{content:"";position:absolute;inset:0;background-image:linear-gradient(to bottom,rgba(255,255,255,.05) 1px,transparent 1px);background-size:100% 28px;pointer-events:none}
.access > div{position:relative;flex:1 1 400px;min-width:0}
.access h3{margin:0;font-size:30px;line-height:1.15;font-weight:600;letter-spacing:-.02em}
.access p{margin:16px 0 0;font-size:16px;line-height:1.6;color:#D6D8DE}
.access p strong{color:#fff}
.access .small{font-size:14px;color:#B9BCC5}
.access .tag{display:inline-flex;margin-top:20px;font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:12px;color:#B3A9F2;border:1px solid rgba(179,169,242,.35);padding:6px 12px;border-radius:999px}
.access .links{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.access .links a{color:#fff;text-decoration:none;font-size:14px;padding:9px 14px;border-radius:9px;border:1px solid rgba(255,255,255,.2);transition:border-color .2s,background .2s}
.access .links a:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.btn-off{display:inline-flex;align-items:center;min-height:48px;padding:0 22px;margin-top:22px;border-radius:10px;font:inherit;font-size:15px;background:transparent;color:#B9BCC5;border:1px dashed rgba(255,255,255,.3);cursor:not-allowed}
.fb{display:flex;flex-wrap:wrap;gap:24px}
.fb > div{flex:1 1 380px;min-width:0;background:#fff;border:1px solid #E5E6EA;border-radius:18px;padding:32px}
.fb .mail{margin:0;font-size:22px;font-weight:600;letter-spacing:-.015em}
.fb .mail a{color:#6556C7}
.fb ul{margin:18px 0 0;padding:0;list-style:none}
.fb li{position:relative;padding:8px 0 8px 26px;font-size:16px;line-height:1.5;color:#4F5159;border-top:1px solid #F2F3F5}
.fb li::before{content:"";position:absolute;left:2px;top:16px;width:8px;height:8px;border-radius:2px;background:#B3A9F2}
.fb p{margin:12px 0 0;font-size:16px;line-height:1.6;color:#4F5159}
.fb .muted{font-size:14px;color:#62646C}
.board{background:#fff;border:1px solid #E5E6EA;border-radius:18px;padding:8px;box-shadow:0 30px 60px -36px rgba(32,33,38,.4)}
.board-h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px 12px;font-size:14px;font-weight:600}
.board-h span:last-child{font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:11px;font-weight:400;color:#5546B5;background:#F0EDFF;padding:4px 9px;border-radius:999px}
.board-i{display:flex;gap:18px;align-items:baseline;padding:18px 16px;border-top:1px solid #F2F3F5;opacity:0;animation:rowIn .6s cubic-bezier(.2,.7,.2,1) forwards}
.board-i:nth-of-type(2){animation-delay:.5s}.board-i:nth-of-type(3){animation-delay:.65s}.board-i:nth-of-type(4){animation-delay:.8s}
.board-i .bn{font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:13px;color:#6556C7}
.board-i strong{display:block;font-size:20px;font-weight:600;letter-spacing:-.015em}
.board-i p{margin:4px 0 0;color:#4F5159;font-size:15px}
.board-c{margin:0;padding:14px 16px 12px;border-top:1px solid #F2F3F5;font-size:13px;line-height:1.5;color:#62646C}
@media (max-width:760px){
  .toc{position:static}
  .access{padding:32px 24px}
  .price-top,.price-grid div,.price-foot{padding-left:24px;padding-right:24px}
  .amount{text-align:left}
  .acc .body{padding-left:4px}
}
@media (prefers-reduced-motion:reduce){ .board-i{opacity:1} }

/* download page */
.dl-lead{margin:26px 0 0;max-width:640px;font-size:19px;line-height:1.55;color:#4F5159;text-wrap:pretty}
.dl{max-width:1240px;margin:0 auto;padding:40px 24px 0;display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start}
.dl-info{flex:999 1 560px;min-width:0;display:grid;gap:20px}
.dl-side{flex:1 1 380px;min-width:0;position:sticky;top:24px}
.dl-card{position:relative;background:#fff;border:1px solid #E5E6EA;border-radius:20px;padding:30px 32px 32px;scroll-margin-top:24px}
.dl-n{font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:13px;color:#6556C7}
.dl-card h2{margin:10px 0 0;font-size:26px;line-height:1.2;font-weight:600;letter-spacing:-.02em}
.dl-card p{margin:14px 0 0;font-size:16px;line-height:1.6;color:#4F5159;text-wrap:pretty}
.dl-card .mono{font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:14px;color:#202126}
.dl-list{margin:16px 0 0;padding:0;list-style:none}
.dl-list li{position:relative;padding:10px 0 10px 28px;border-top:1px solid #F2F3F5;font-size:16px;line-height:1.55;color:#4F5159}
.dl-list li:first-child{border-top:0}
.dl-list li::before{content:"";position:absolute;left:2px;top:17px;width:16px;height:16px;border-radius:50%;background:#E7F5EC url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B7A4B' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/10px no-repeat}
.dl-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.dl-links a{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:10px;border:1px solid #E5E6EA;color:#202126;text-decoration:none;font-size:14px;font-weight:500;transition:border-color .2s,color .2s}
.dl-links a:hover{border-color:#6556C7;color:#6556C7}
.dl-days{position:relative;display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin:20px 0 4px;max-width:420px}
.dl-days i{height:34px;border-radius:8px;background:#F0EDFF;border:1px solid #D4D1E0;animation:dayOn 7s cubic-bezier(.2,.7,.2,1) infinite;animation-delay:calc(var(--i) * .5s)}
@keyframes dayOn{0%,4%{background:#F0EDFF;border-color:#D4D1E0}10%,70%{background:#6556C7;border-color:#6556C7}85%,100%{background:#F0EDFF;border-color:#D4D1E0}}
.dl-form{position:relative;overflow:hidden;background:#202126;color:#fff;border-radius:24px;padding:36px 32px 32px;scroll-margin-top:24px;box-shadow:0 40px 70px -40px rgba(32,33,38,.6)}
.dl-form::before{content:"";position:absolute;inset:0;background-image:linear-gradient(to bottom,rgba(255,255,255,.05) 1px,transparent 1px);background-size:100% 28px;pointer-events:none}
.dl-form > *{position:relative}
.dl-pkg{margin:0;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#B3A9F2}
.dl-form h2{margin:12px 0 0;font-size:30px;line-height:1.12;font-weight:600;letter-spacing:-.025em}
.dl-form p{margin:14px 0 0;font-size:15px;line-height:1.6;color:#D6D8DE}
.dl-check{display:flex;gap:14px;align-items:flex-start;margin-top:26px;padding:18px;border-radius:14px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);cursor:pointer;font-size:15px;line-height:1.55;color:#fff;transition:border-color .2s,background .2s}
.dl-check:hover{border-color:rgba(179,169,242,.7)}
.dl-check input{position:absolute;opacity:0;width:22px;height:22px;margin:0}
.dl-check .box{flex:none;width:22px;height:22px;margin-top:1px;border-radius:6px;border:1.5px solid rgba(255,255,255,.55);display:grid;place-items:center;transition:background .2s,border-color .2s}
.dl-check .box::after{content:"";width:11px;height:6px;border:solid #fff;border-width:0 0 2.4px 2.4px;transform:rotate(-45deg) scale(0);margin-top:-3px;transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.dl-check input:checked + .box{background:#6556C7;border-color:#6556C7}
.dl-check input:checked + .box::after{transform:rotate(-45deg) scale(1)}
.dl-check input:focus-visible + .box{outline:2px solid #B3A9F2;outline-offset:3px}
.dl-check:has(input:checked){border-color:rgba(179,169,242,.7);background:rgba(101,86,199,.16)}
.dl-check a{color:#fff;text-decoration-thickness:1px;text-underline-offset:3px}
.dl-btn{width:100%;justify-content:center;margin-top:18px;font:inherit;font-size:16px;font-weight:600;border:0;cursor:pointer}
.dl-btn:disabled{background:transparent;color:#B9BCC5;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3);cursor:not-allowed;transform:none}
.dl-btn:disabled .arr{opacity:.5}
.dl-form .dl-new{margin-top:10px;font-size:14px;color:#B3A9F2}.dl-form .dl-new a{color:#fff}
.dl-form .dl-status{margin-top:12px;min-height:1.6em;font-size:14px;color:#B9BCC5}
.dl-form .dl-status.warn{color:#F5C46A}
.dl-form .dl-fb{margin-top:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,.14);font-size:15px;color:#fff}
.dl-form .dl-fb a{color:#B3A9F2;text-decoration:none;border-bottom:1px solid currentColor}
.dl-form .tag{display:inline-flex;margin-top:18px;font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:12px;color:#B3A9F2;border:1px solid rgba(179,169,242,.35);padding:6px 12px;border-radius:999px}
.dl-form.closed .dl-check,.dl-form.closed .dl-btn{display:none}
@media (max-width:760px){.dl-side{position:static}.dl-card{padding:26px 22px 28px}.dl-form{padding:30px 22px 26px}}
@media (prefers-reduced-motion:reduce){.dl-days i{animation:none;background:#6556C7;border-color:#6556C7}}