@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url('instrument-serif-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url('instrument-serif-latin-400-italic.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('inter-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('inter-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('inter-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('inter-latin-700-normal.woff2') format('woff2')}

body{margin:0;background:#FFFFFF}
a{color:#0B0B0B}a:hover{color:#4A4A4A}
.serif{font-family:'Instrument Serif',Georgia,serif;font-weight:400;letter-spacing:-0.01em}
.eyebrow{font-size:12px;letter-spacing:0.16em;text-transform:uppercase;color:#5E5E5E;font-weight:500}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px;box-sizing:border-box}
.logo{font-weight:700;letter-spacing:0.08em;text-transform:uppercase;line-height:1}
.logo i{font-style:normal;display:inline-block;width:0.32em;height:0.32em;background:currentColor;border-radius:50%;margin:0 0.12em;transform:translateY(-0.02em)}
details summary{cursor:pointer;list-style:none}
details summary::-webkit-details-marker{display:none}
details[open] .plus{transform:rotate(45deg)}
.plus{transition:transform .3s ease;flex:none}

.dots{background-image:radial-gradient(rgba(11,11,11,0.09) 1px,transparent 1px);background-size:22px 22px}

@keyframes rise{from{opacity:0;transform:translateY(36px)}to{opacity:1;transform:none}}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes words{0%,20%{transform:translateY(0)}25%,45%{transform:translateY(-1.1em)}50%,70%{transform:translateY(-2.2em)}75%,95%{transform:translateY(-3.3em)}100%{transform:translateY(-4.4em)}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(11,11,11,0.45)}70%{box-shadow:0 0 0 10px rgba(11,11,11,0)}100%{box-shadow:0 0 0 0 rgba(11,11,11,0)}}
@keyframes rowin{0%,8%{opacity:0;transform:translateX(-14px)}14%,88%{opacity:1;transform:none}100%{opacity:0}}
@keyframes status{0%,40%{background:#FFFFFF;color:#0B0B0B}48%,100%{background:#0B0B0B;color:#FFFFFF}}
@keyframes draw{from{stroke-dashoffset:300}to{stroke-dashoffset:0}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

.in{animation:rise 1s cubic-bezier(.2,.7,.2,1) both}
.d1{animation-delay:.1s}.d2{animation-delay:.25s}.d3{animation-delay:.4s}.d4{animation-delay:.55s}.d5{animation-delay:.7s}
.marquee{display:flex;width:max-content;animation:marquee 38s linear infinite}
.marquee.slow{animation-duration:60s}
.marquee:hover{animation-play-state:paused}
.words{display:inline-flex;flex-direction:column;animation:words 10s cubic-bezier(.7,0,.2,1) infinite}
.live{animation:pulse 1.8s infinite}
.row{animation:rowin 9s ease infinite both}
.r1{animation-delay:0s}.r2{animation-delay:.6s}.r3{animation-delay:1.2s}.r4{animation-delay:1.8s}
.st{animation:status 9s ease infinite both}
.s1{animation-delay:.4s}.s2{animation-delay:1s}.s3{animation-delay:1.6s}.s4{animation-delay:2.2s}
.float{animation:float 6s ease-in-out infinite}
.line{stroke-dasharray:300;animation:draw 2.4s .6s ease-out both}

.btn{transition:transform .25s ease,background .25s ease,color .25s ease}
.btn:hover{transform:translateY(-2px)}
.btn .arr{display:inline-block;transition:transform .25s ease}
.btn:hover .arr{transform:translateX(5px)}
.btn-dark:hover{background:#2A2A2A;color:#FFFFFF}
.btn-line:hover{background:#0B0B0B;color:#FFFFFF}
.btn-light:hover{background:#E8E8E8;color:#0B0B0B}
.card{transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .35s ease,box-shadow .35s ease}
.card:hover{transform:translateY(-6px);border-color:#0B0B0B;box-shadow:0 18px 40px -24px rgba(11,11,11,0.35)}
.ul{background-image:linear-gradient(#0B0B0B,#0B0B0B);background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .3s ease}
.ul:hover{background-size:100% 1px;color:#0B0B0B}
.outline{color:transparent;-webkit-text-stroke:1px #0B0B0B}

.board{position:relative}
@keyframes travel{0%,3%{transform:translateX(0);opacity:0}7%,21%{transform:translateX(0);opacity:1}29%,46%{transform:translateX(calc(100% + 14px))}54%,71%{transform:translateX(calc(200% + 28px))}79%,95%{transform:translateX(calc(300% + 42px));opacity:1}100%{transform:translateX(calc(300% + 42px));opacity:0}}
@keyframes cardhi{0%,76%{background:#161616;color:#FFFFFF;border-color:#333333}80%,100%{background:#FFFFFF;color:#0B0B0B;border-color:#FFFFFF}}
@keyframes l1{0%,24%{opacity:1}27%,100%{opacity:0}}
@keyframes l2{0%,24%{opacity:0}27%,49%{opacity:1}52%,100%{opacity:0}}
@keyframes l3{0%,49%{opacity:0}52%,74%{opacity:1}77%,100%{opacity:0}}
@keyframes l4{0%,74%{opacity:0}78%,100%{opacity:1}}
@keyframes toast{0%,78%{opacity:0;transform:translateY(18px) scale(.98)}82%,95%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-6px)}}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes sheen{0%{transform:translateX(-100%)}60%,100%{transform:translateX(300%)}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.35}}
.mover{position:absolute;left:0;top:0;width:calc((100% - 42px) / 4);animation:travel 12s cubic-bezier(.7,0,.2,1) infinite}
.mover .mc{animation:cardhi 12s ease infinite}
.lab{position:absolute;left:0;top:0;white-space:nowrap}
.lab1{animation:l1 12s infinite}.lab2{animation:l2 12s infinite}.lab3{animation:l3 12s infinite}.lab4{animation:l4 12s infinite}
.toast{animation:toast 12s ease infinite}
.bar{transform-origin:left;animation:grow 1.6s cubic-bezier(.2,.8,.2,1) both}
.bar2{animation-delay:.2s}.bar3{animation-delay:.4s}.bar4{animation-delay:.6s}
.sheen{position:absolute;inset:0;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.18),transparent);animation:sheen 3.5s ease-in-out infinite}
.blink{animation:blink 1.4s ease-in-out infinite}

.hc{transition:background .35s ease,color .35s ease,border-color .35s ease,transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease}
.hc:hover{transform:translateY(-6px);box-shadow:0 24px 48px -24px rgba(11,11,11,0.45);background:#0B0B0B !important;border-color:#0B0B0B !important;color:#FFFFFF !important}
.hc:hover *{color:#FFFFFF !important;border-color:rgba(255,255,255,0.35) !important}
.hc:hover .outline,.hc:hover .outw{-webkit-text-stroke-color:#FFFFFF !important}
.hc.inv:hover{background:#FFFFFF !important;border-color:#FFFFFF !important;color:#0B0B0B !important}
.hc.inv:hover *{color:#0B0B0B !important;border-color:rgba(11,11,11,0.2) !important}
.hc.inv:hover .outline,.hc.inv:hover .outw{-webkit-text-stroke-color:#0B0B0B !important}
.hc.inv:hover .tag-inv{background:#0B0B0B !important;color:#FFFFFF !important}
.chip{transition:background .25s ease,color .25s ease,border-color .25s ease}
.chip:hover{background:#0B0B0B;border-color:#0B0B0B !important;color:#FFFFFF}
.ref{transition:background .35s ease,color .35s ease}
.ref:hover{background:#0B0B0B !important}
.ref:hover,.ref:hover *{color:#FFFFFF !important}
@media (max-width: 760px){
.board-cols{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
.mover,.slot{display:none !important}
.funnel{max-width:none !important;border-right:0 !important;border-bottom:1px solid #222222}
.toast{display:none !important}
}
@property --r{syntax:'<length>';initial-value:0px;inherits:false}
@keyframes introhole{0%,52%{--r:0px}100%{--r:160vmax}}
@keyframes introlog{0%{opacity:0;filter:blur(18px);transform:scale(.82)}30%,50%{opacity:1;filter:blur(0);transform:scale(1)}78%,100%{opacity:0;filter:blur(26px);transform:scale(5.5)}}
@keyframes introword{0%,18%{opacity:0;letter-spacing:.9em}36%,50%{opacity:1;letter-spacing:.42em}64%,100%{opacity:0;letter-spacing:1.2em}}
@keyframes introline{0%,10%{transform:scaleX(0)}46%{transform:scaleX(1);opacity:1}58%,100%{transform:scaleX(1);opacity:0}}
@keyframes introgone{0%,99%{visibility:visible}100%{visibility:hidden}}
.intro{position:absolute;left:0;top:0;right:0;height:100vh;z-index:60;background:#0B0B0B;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;pointer-events:none;
  -webkit-mask-image:radial-gradient(circle at 50% 46%,transparent var(--r),#000 calc(var(--r) + 1px));mask-image:radial-gradient(circle at 50% 46%,transparent var(--r),#000 calc(var(--r) + 1px));
  animation:introhole 2.6s cubic-bezier(.7,0,.2,1) forwards,introgone 2.6s linear forwards}
.intro .il{animation:introlog 2.6s cubic-bezier(.6,0,.2,1) forwards}
.intro .iw{animation:introword 2.6s ease forwards}
.intro .ib{transform-origin:left;animation:introline 2.6s cubic-bezier(.6,0,.2,1) forwards}
.in{animation-delay:1.55s}.d1{animation-delay:1.65s}.d2{animation-delay:1.8s}.d3{animation-delay:1.95s}.d4{animation-delay:2.1s}.d5{animation-delay:2.25s}
.no-intro .intro{display:none}
.no-intro .in{animation-delay:0s}.no-intro .d1{animation-delay:.1s}.no-intro .d2{animation-delay:.25s}.no-intro .d3{animation-delay:.4s}.no-intro .d4{animation-delay:.55s}.no-intro .d5{animation-delay:.7s}
@supports (animation-timeline: view()){
.reveal{animation:rise linear both;animation-timeline:view();animation-range:entry 0% cover 28%}
}
@media (prefers-reduced-motion: reduce){
*{animation:none !important;transition:none !important}
.intro{display:none !important}
}

/* --- Live-Website --- */
.legal a{color:#0B0B0B;text-decoration:underline;text-underline-offset:3px}
.legal p{max-width:72ch}
.intro{position:fixed !important;height:100vh !important;height:100dvh !important}
@media (prefers-reduced-motion: reduce){.intro{display:none !important}}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
*,*::before,*::after{box-sizing:border-box}
img{max-width:100%}
.no-sdt .reveal{opacity:0;transform:translateY(36px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.no-sdt .reveal.is-in{opacity:1;transform:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:#0B0B0B;color:#fff;padding:10px 16px;border-radius:8px}
.skip:focus{left:8px}
a:focus-visible,summary:focus-visible{outline:2px solid #0B0B0B;outline-offset:3px}
@media (max-width: 1100px){
  header nav{gap:18px !important}
}
@media (max-width: 900px){
  [style*="font-size: 120px"]{font-size:clamp(52px,14vw,120px) !important}
  [style*="font-size: 84px"]{font-size:clamp(40px,10vw,84px) !important}
  [style*="font-size: 80px"]{font-size:clamp(40px,10vw,80px) !important}
  [style*="font-size: 60px"]{font-size:clamp(36px,9vw,60px) !important}
  [style*="font-size: 56px"]{font-size:clamp(34px,8.5vw,56px) !important}
  [style*="font-size: 36px; line-height: 1.12"]{font-size:28px !important}
  [style*="font-size: 160px"]{font-size:90px !important}
  [style*="padding: 128px 0"],[style*="padding: 120px 0"]{padding-top:88px !important;padding-bottom:88px !important}
  [style*="padding: 104px 0 96px"]{padding-top:56px !important;padding-bottom:64px !important}
  header nav a.ul:not(.keep){display:none}
  header nav{gap:14px !important}
  header .serif{display:none}
  header a span[style*="width: 1px"]{display:none}
  header .wrap{flex-wrap:nowrap !important}
  header nav a.btn{padding:10px 14px !important;font-size:13px !important}
  [style*="grid-template-columns: repeat(auto-fit, minmax(360px, 1fr))"],
  [style*="grid-template-columns: repeat(auto-fit, minmax(320px, 1fr))"],
  [style*="grid-template-columns: repeat(auto-fit, minmax(300px, 1fr))"]{grid-template-columns:1fr !important}
}
@media (max-width: 520px){
  [style*="grid-template-columns: repeat(2, minmax(0, 1fr))"]:not(.board-cols){grid-template-columns:1fr !important}
}
