@font-face{font-family:Inter;src:url(assets/fonts/Inter.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url(assets/fonts/Inter-Italic.woff2) format("woff2");font-weight:100 900;font-style:italic;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(assets/fonts/PlexMono-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
:root{--accent:#FF5A1F;--ink:#111;--grey:#6B6B6B;--line:#E5E5E5;--soft:#A8A8A8;--bg:#fff;--pad:48px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,system-ui,sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;font-weight:400}
img{display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button{font:inherit;background:none;border:0;cursor:pointer;color:inherit}
.mono{font-family:"IBM Plex Mono",monospace;font-weight:500;font-size:12px;letter-spacing:.6px;text-transform:uppercase}
.grey{color:var(--grey)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.m{display:none}
.x.mo{display:none}
section,.nav,.foot{border-bottom:1px solid var(--line);position:relative}
/* crosshairs at grid intersections */
.x{position:absolute;width:11px;height:11px;transform:translate(-5px,-5px);pointer-events:none;z-index:2}
.x::before,.x::after{content:"";position:absolute;background:#9A9A9A}
.x::before{left:5px;top:0;width:1px;height:11px}.x::after{top:5px;left:0;height:1px;width:11px}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;height:52px;padding:0 24px;font-size:15px;font-weight:500;white-space:nowrap}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{filter:brightness(.92)}
.btn-outline{border:1px solid var(--ink);height:50px;width:360px}
.btn-outline:hover{background:var(--ink);color:#fff}
/* nav */
.nav{height:73px;background:#fff;z-index:20;position:sticky;top:0}
.nav-in{height:72px;display:flex;align-items:center;padding:0 var(--pad);position:relative}
.logo img{height:54px;width:auto;margin-left:-9px}
.links{position:absolute;left:620px;top:0;height:72px;display:flex;gap:0}
.nav-link{display:flex;align-items:center;height:72px;font-size:15px;font-weight:450;color:var(--ink);margin-right:42px;position:relative}
.chev{width:7px;height:7px;margin-left:7px;border-right:1.2px solid currentColor;border-bottom:1.2px solid currentColor;transform:translateY(-2px) rotate(45deg) scale(.72);display:inline-block}
#tools-trigger[aria-expanded=true]{font-weight:500}
#tools-trigger[aria-expanded=true] .chev{transform:translateY(2px) rotate(225deg) scale(.72)}
#tools-trigger[aria-expanded=true]::after{content:"";position:absolute;left:0;right:-14px;bottom:0;height:2px;background:var(--ink)}
.nav-cta{margin-left:auto;height:40px;width:168px;padding:0}
.nav-cta .sm{display:none}
.burger{display:none}
.mobile-menu{display:none}
/* mega menu */
.mega{position:absolute;left:0;right:0;top:73px;background:#fff;border-bottom:1px solid var(--line)}
.mega[hidden]{display:none}
.mega-in{display:grid;grid-template-columns:320px minmax(0,1fr);border-bottom:1px solid var(--line)}
.mm-rail{padding:22px 40px 32px;border-right:1px solid var(--line)}
.mm-rail .mono{display:block;font-size:12px}
.mm-rail>p{font-size:14px;margin:14px 0 18px}
.feat{display:block;border:1px solid var(--ink)}
.feat img{width:100%;height:auto;border-bottom:1px solid var(--ink)}
.feat-b{display:flex;flex-direction:column;padding:16px 16px 18px;gap:6px}
.feat-b strong{font-size:16px;font-weight:500;letter-spacing:-.3px;margin-top:6px}
.feat-b .grey{font-size:12.5px;line-height:1.45}
.feat-link{font-size:13px;font-weight:500;margin-top:8px}
.badge{background:var(--accent);color:#fff;padding:3px 8px;align-self:flex-start}
.mm-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.mm-col+.mm-col{border-left:1px solid var(--line)}
.mm-head{height:52px;display:flex;justify-content:space-between;align-items:center;padding:0 24px;font-family:"IBM Plex Mono",monospace;font-size:12px;font-weight:500;letter-spacing:.6px;color:var(--grey);border-bottom:1px solid var(--line)}
.mm-head span+span{color:var(--soft);font-size:11px}
.mm-col li+li{border-top:1px solid var(--line)}
.mm-item{display:flex;align-items:center;height:104px;padding:0 20px;gap:14px;position:relative}
.mm-ico{width:56px;height:56px;flex:none}
.mm-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.mm-name{font-size:15px;font-weight:500;letter-spacing:-.2px}
.mm-desc{font-size:12.5px;letter-spacing:-.1px;color:var(--grey);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tag{font-family:"IBM Plex Mono",monospace;font-size:10px;font-weight:500;letter-spacing:.6px;color:var(--soft);margin-top:4px}
.tag-live{color:var(--ink)}
.mm-arrow{position:absolute;right:30px;opacity:0;transform:translateX(-10px);transition:.2s;font-size:20px}
.mm-item:hover,.mm-item:focus-visible{background:#F5F5F5;outline:none}
.mm-item:hover .mm-arrow,.mm-item:focus-visible .mm-arrow{opacity:1;transform:none}
.mm-item:hover .mm-desc{padding-right:40px}
.mm-bottom{height:52px;display:flex;justify-content:space-between;align-items:center;padding:0 40px;font-size:11px;color:var(--grey)}
.mm-bottom a{color:var(--ink);text-decoration:underline;text-underline-offset:4px;margin-left:24px}
.dim{position:fixed;inset:73px 0 0;background:rgba(17,17,17,.42);z-index:10}
.dim[hidden]{display:none}
/* hero */
.hero{border-bottom:1px solid var(--line)}
.hero-top{display:grid;grid-template-columns:912px 1fr;height:372px;border-bottom:1px solid var(--line)}
.hero-l{padding:60px 0 0 var(--pad);border-right:1px solid var(--line)}
.hero-l .mono{display:block}
h1{font-size:84px;line-height:87px;font-weight:500;letter-spacing:-3.4px;margin-top:20px}
.pb{display:inline-flex;align-items:center;margin-left:-4px}
.pb em{font-style:italic;font-weight:500;padding:0 8px 0 6px}
.br{height:78px;width:auto;transform:translateY(-4px)}
.hero-r{padding:113px var(--pad) 0}
.lead{font-size:18px;line-height:27px;color:var(--grey)}
.waitlist{display:flex;flex-wrap:wrap;margin-top:24px}
.waitlist input{flex:1;min-width:0;height:52px;border:1px solid #BDBDBD;border-right:0;border-radius:0;padding:0 16px;font:15px Inter,sans-serif;color:var(--ink);outline:none}
.waitlist input:focus{border-color:var(--ink)}
.waitlist input::placeholder{color:#9A9A9A}
.waitlist .btn{width:172px;padding:0}
.form-msg{flex-basis:100%;font-size:13px;margin-top:8px;min-height:0}
.form-msg:empty{display:none}
.form-msg.err{color:#B3261E}
.small{font-size:13px;line-height:1.5;color:var(--grey);margin-top:14px}
.hero-fig{height:520px;position:relative}
.fig-label{position:absolute;left:250px;top:24px}
.vf{position:absolute;left:250px;top:50px;width:940px;height:420px;display:flex;align-items:center;justify-content:center}
.vf::before{content:"";position:absolute;inset:0;pointer-events:none;
 background:linear-gradient(var(--ink),var(--ink)) 0 0/22px 1.5px,linear-gradient(var(--ink),var(--ink)) 0 0/1.5px 22px,
 linear-gradient(var(--ink),var(--ink)) 100% 0/22px 1.5px,linear-gradient(var(--ink),var(--ink)) 100% 0/1.5px 22px,
 linear-gradient(var(--ink),var(--ink)) 0 100%/22px 1.5px,linear-gradient(var(--ink),var(--ink)) 0 100%/1.5px 22px,
 linear-gradient(var(--ink),var(--ink)) 100% 100%/22px 1.5px,linear-gradient(var(--ink),var(--ink)) 100% 100%/1.5px 22px;background-repeat:no-repeat}
.hero-art{position:absolute;left:383px;top:57px}
/* tools */
.sec-head{height:77px;display:flex;justify-content:space-between;align-items:center;padding:0 var(--pad);border-bottom:1px solid var(--line)}
.tool-grid{display:grid;grid-template-columns:repeat(4,1fr);position:relative}
.tool{height:420px;padding:28px 32px 0;position:relative;display:flex;flex-direction:column}
.tool+.tool{border-left:1px solid var(--line)}
.tool .idx{color:var(--grey)}
/* every icon centred on the same point in the band above the title, whatever its size */
.tool-ico{position:absolute;left:50%;top:138px;transform:translate(-50%,-50%)}
.tool h3{margin-top:auto;font-size:22px;font-weight:500;letter-spacing:-.5px;position:absolute;top:248px}
.tool p{position:absolute;top:286px;left:32px;right:40px;font-size:15px;line-height:22.5px;color:var(--grey)}
.tool .status{position:absolute;bottom:22px;left:32px;color:var(--soft)}
.tool .status.badge{color:#fff;padding:3px 8px;left:32px;bottom:20px}
/* transition */
.transition{height:250px;text-align:center;padding-top:80px}
.transition h2{font-size:60px;font-weight:500;letter-spacing:-2.2px;margin-top:30px;line-height:1}
/* sticky */
.sticky{display:grid;grid-template-columns:860px 1fr;min-height:641px}
.gen-wrap{padding:48px;border-right:1px solid var(--line)}
.gen{border:1px solid var(--ink)}
.gen-bar{height:36px;border-bottom:1px solid var(--ink);display:flex;align-items:center;padding-left:14px;gap:6px;position:relative}
.gen-bar i{width:8px;height:8px;border:1px solid var(--ink)}
.gen-bar span{position:absolute;left:0;right:0;text-align:center;font-size:11px;letter-spacing:.4px}
.pages{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:20px;position:relative}
.pg img{width:100%;aspect-ratio:971/750;object-fit:cover;outline:1px solid #CFCFCF;outline-offset:-1px}
.pg figcaption{font-size:10px;margin-top:4px}
.pg.locked img{image-rendering:pixelated}
.pg.locked figcaption{color:var(--grey)}
.lock{position:absolute;left:50%;top:75%;transform:translate(-50%,-50%);background:var(--ink);color:#fff;padding:10px 20px;white-space:nowrap}
.steps{display:grid;grid-template-rows:repeat(3,1fr)}
.step{padding:40px 48px;color:#A8A8A8;position:relative;cursor:pointer}
.step+.step{border-top:1px solid var(--line)}
.step h3{font-size:30px;font-weight:500;letter-spacing:-.8px;margin-top:22px}
.step p{font-size:16px;margin-top:14px;color:#B5B5B5}
.step.active{color:var(--ink)}
.step.active p{color:var(--grey)}
.step.active::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ink)}
/* plans */
.plans-head{height:186px;display:flex;justify-content:space-between;align-items:flex-end;padding:0 var(--pad) 36px;border-bottom:1px solid var(--line)}
.plans-head h2{font-size:52px;font-weight:500;letter-spacing:-1.8px;margin-top:26px;line-height:1}
.plans-head p{font-size:15px}
.plan-grid{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line);position:relative}
.plan{height:220px;padding:42px 32px 0;position:relative}
.plan+.plan{border-left:1px solid var(--line)}
.plan-top{display:flex;align-items:baseline;gap:14px}
.plan h3{font-size:28px;font-weight:500;letter-spacing:-.7px}
.plan .plan-top .mono{color:var(--grey)}
.plan:nth-child(2) .plan-top .mono{color:var(--ink)}
.plan p{font-size:15px;line-height:22.5px;color:var(--grey);margin-top:16px}
.tier{position:absolute;bottom:28px;color:var(--soft)}
.plans-cta{height:138px;display:flex;align-items:center;justify-content:center}
/* cta */
.cta{height:380px}
.vf-cta{left:50%;transform:translateX(-50%);top:56px;width:760px;height:268px;flex-direction:column;text-align:center}
.cta h2{font-size:72px;font-weight:500;letter-spacing:-2.8px;line-height:1}
.cta p{font-size:18px;margin-top:22px}
.cta .waitlist{width:520px;margin-top:24px}
/* footer */
.foot{border-bottom:0}
.foot-top{height:132px;display:flex;align-items:center;padding:0 var(--pad);border-bottom:1px solid var(--line)}
.foot-logo{height:66px;width:auto;margin-left:-11px;flex:none}
.foot-top p{font-size:14px;margin-left:63px}
.foot-top p a{color:var(--ink);font-weight:500;text-decoration:underline;text-underline-offset:3px}
.priv{font-size:14px;margin-left:220px;text-decoration:underline;text-underline-offset:3px}
.orbit{margin-left:auto}
.foot-bot{height:64px;display:flex;justify-content:space-between;align-items:center;padding:0 var(--pad);font-size:11px}

/* ---------- mobile ---------- */
@media (max-width:760px){
 :root{--pad:20px}
 .m{display:inline}
 .x.dk{display:none}
 .x.mo{display:block}
 .nav{height:63px}.nav-in{height:62px}
 .logo img{height:48px;margin-left:-8px}
 .links,.mega,.dim{display:none!important}
 .nav-cta{width:92px;height:34px;font-size:14px;margin-right:8px}
 .nav-cta .lg{display:none}.nav-cta .sm{display:inline}
 .burger{display:flex;flex-direction:column;justify-content:center;gap:4.5px;width:44px;height:34px;border:1px solid var(--ink);padding:0 12px}
 .burger i{display:block;height:1.5px;background:var(--ink)}
 .mobile-menu:not([hidden]){display:flex;flex-direction:column;background:#fff;border-top:1px solid var(--line)}
 .mobile-menu a{padding:16px 20px;border-bottom:1px solid var(--line);font-weight:500}
 .hero-top{grid-template-columns:1fr;height:auto}
 .hero-l{border-right:0;padding:32px 20px 0}
 .hero-l .mono{font-size:10.5px}
 h1{font-size:44px;line-height:46.6px;letter-spacing:-1.8px;margin-top:22px}
 .br{height:42px}.pb em{padding:0 4px 0 3px}.pb{margin-left:0}
 .hero-r{padding:18px 20px 20px}
 .lead{font-size:16px;line-height:24px}
 .waitlist{flex-direction:column;margin-top:16px}
 .waitlist input{border-right:1px solid #BDBDBD;flex:none;height:50px}
 .waitlist .btn{width:100%;height:50px;margin-top:8px}
 .small{font-size:12px;margin-top:16px}
 .hero-fig{height:300px}
 .fig-label{display:none}
 .vf{left:20px;right:20px;width:auto;top:24px;height:250px}
 .hero-art{left:50%;top:52px;transform:translateX(-50%);width:291px;height:auto}
 .sec-head{height:63px;padding:0 20px}.sec-head .mono{font-size:10.5px}.sec-head .mono:first-child{font-size:12px}
 .tool-grid{grid-template-columns:1fr}
 .tool{height:auto;padding:22px 20px 24px;border-left:0!important;border-bottom:1px solid var(--line)}
 .tool:last-child{border-bottom:0}
 .tool-ico{left:auto;right:20px;transform:none;top:12px;width:calc(var(--w)/2);height:calc(var(--h)/2)}
 .tool:nth-child(2) .tool-ico{top:22px}
 .tool h3,.tool p,.tool .status{position:static}
 .tool h3{margin-top:56px;font-size:20px;letter-spacing:-.4px}
 .tool p{font-size:14px;line-height:21px;margin-top:10px;padding-right:20px}
 .tool .status{margin-top:12px;align-self:flex-start}
 .transition{height:180px;padding-top:36px}
 .transition .mono{font-size:12px}
 .transition h2{font-size:34px;letter-spacing:-1.2px;margin-top:14px;line-height:40px}
 .sticky{grid-template-columns:1fr;min-height:0}
 .gen-wrap{padding:24px 20px;border-right:0;border-bottom:1px solid var(--line)}
 .gen-bar span{font-size:7.5px;left:62px;text-align:left}
 .pages{gap:10px;padding:14px}
 .lock{font-size:11px;padding:8px 16px}
 .step{padding:22px 20px;height:120px}
 .step h3{font-size:24px;margin-top:12px}.step p{font-size:14px;margin-top:8px}
 .plans-head{height:166px;padding:0 20px 30px;flex-direction:column;align-items:flex-start;justify-content:flex-end}
 .plans-head h2{font-size:36px;letter-spacing:-1.2px;line-height:40px;margin-top:16px}
 .plans-head>p{display:none}
 .plan-grid{grid-template-columns:1fr 1fr}
 .plan{height:170px;padding:24px 20px 0;border-left:0!important}
 .plan:nth-child(even){border-left:1px solid var(--line)!important}
 .plan:nth-child(-n+2){border-bottom:1px solid var(--line)}
 .plan-top{flex-direction:column;gap:12px}
 .plan h3{font-size:22px;letter-spacing:-.5px}
 .plan-top .mono{font-size:10.5px}
 .plan p{font-size:13.5px;line-height:20px;margin-top:14px}
 .plan:nth-child(n+3) p{margin-top:40px}
 .tier{display:none}
 .plans-cta{height:106px;padding:0 20px}
 .btn-outline{width:100%}
 .cta{height:300px;padding:0 20px}
 .vf-cta{position:static;transform:none;width:auto;height:auto;padding-top:52px}
 .vf-cta::before{display:none}
 .cta h2{font-size:38px;letter-spacing:-1.4px}
 .cta p{font-size:14.5px;margin-top:14px}
 .cta .waitlist{width:100%;margin-top:20px}
 .foot-top{height:auto;flex-wrap:wrap;padding:24px 20px 0;border-bottom:1px solid var(--line)}
 .foot-logo{height:57px}
 .orbit{margin-left:auto}
 .foot-top p{flex-basis:100%;margin:22px 0 0;order:2}
 .priv{order:3}
 .priv{margin:14px 0 20px}
 .foot-bot{height:56px;padding:0 20px;font-size:10.5px}
 .foot-bot .d{display:none}
}

.nw{white-space:nowrap}

/* ---------- scroll-driven how-it-works ---------- */
.sticky{display:block;min-height:0;height:calc(max(641px, 100vh - 73px) + 140vh)}
.sticky-in{position:sticky;top:73px;height:max(641px, calc(100vh - 73px));display:grid;grid-template-columns:860px 1fr;border-bottom:0;background:#fff}
.sticky-in .gen-wrap{position:relative;padding:48px}
.vis{position:relative;height:100%}
.layer{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0;transform:translateY(16px);transition:opacity .45s ease,transform .45s ease;pointer-events:none}
.sticky[data-step="0"] .l0,.sticky[data-step="1"] .l1,.sticky[data-step="2"] .l2{opacity:1;transform:none;pointer-events:auto}
.kit{border:1px solid var(--ink)}
.kit-bar{height:36px;border-bottom:1px solid var(--ink);display:flex;align-items:center;padding:0 16px;font-size:11px}
.kit-body{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;padding:20px}
.kit-body img{width:100%;aspect-ratio:971/750;object-fit:cover;outline:1px solid #CFCFCF;outline-offset:-1px}
.kit-body figcaption,.kit-type .mono{font-size:10px;margin-top:6px;display:block}
.kit-type{display:flex;flex-direction:column}
.kit-type .aa{aspect-ratio:971/750;border:1px solid #CFCFCF;display:flex;align-items:center;justify-content:center;font-size:64px;font-weight:500;letter-spacing:-2px}
.export{display:flex;flex-direction:column;align-items:center;padding-top:30px}
.stack{position:relative;width:420px;height:325px}
.stack img{position:absolute;width:380px;height:auto;outline:1px solid #CFCFCF;outline-offset:-1px;transition:transform .5s ease}
.stack img:nth-child(1){left:40px;top:0}.stack img:nth-child(2){left:20px;top:12px}.stack img:nth-child(3){left:0;top:24px;outline-color:var(--ink)}
.file{margin-top:28px;border:1px solid var(--ink);padding:14px 18px;display:flex;flex-direction:column;gap:4px;min-width:420px}
.file strong{font-weight:500;font-size:16px}.file .grey{font-size:13px}
.steps-wrap{position:relative;border-left:1px solid var(--line)}
.sticky-in .gen-wrap{border-right:0}
.steps-wrap .steps{height:100%}
.progress{position:absolute;left:-1px;top:0;bottom:0;width:3px;z-index:1}
.progress .bar{position:absolute;left:0;top:0;width:3px;height:100%;background:var(--ink);transform-origin:top;transform:scaleY(var(--p,.333));transition:transform .15s linear}
.step.active::before{display:none}
.step{transition:color .35s ease}
.step p{transition:color .35s ease}
.step h3{transition:transform .35s ease}
.step.active h3{transform:translateX(6px)}
.count{position:absolute;right:48px;bottom:24px;font-size:11px}
.count b{font-weight:500;color:var(--ink)}
@media (prefers-reduced-motion:reduce){
 .layer,.step,.step p,.step h3,.progress .bar,.stack img{transition:none!important}
 .layer{transform:none}
 html{scroll-behavior:auto}
}
@media (max-width:760px){
 .sticky{height:auto}
 .sticky-in{position:static;height:auto;grid-template-columns:1fr}
 .sticky-in .gen-wrap{padding:24px 20px;border-bottom:1px solid var(--line)}
 .vis{height:auto}
 .layer{display:none!important;position:static;opacity:1;transform:none}
 .layer.l1{display:block!important}
 .steps-wrap{border-left:0}
 .progress{display:none}
 .step.active::before{display:block}
 .step::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ink);transform:scaleY(0);transform-origin:top;transition:transform .35s ease}
 .step.active::before{transform:scaleY(1)}
 .step.active h3{transform:none}
 .count{display:none}
}
@media (max-width:760px) and (prefers-reduced-motion:reduce){.step::before{transition:none}}

/* ---------- hero FIG. 01 loop (5s, transforms/opacity/dash only: no layout shift) ---------- */
.hero-art g{transform-box:fill-box;transform-origin:center}
.hero-art .token{opacity:0}
@media (prefers-reduced-motion:no-preference){
 .hero-art .flow{animation:hf-flow 5s linear infinite}
 .hero-art .token{animation:hf-token 5s ease-in-out infinite}
 .hero-art .toppage{animation:hf-page 5s ease-in-out infinite}
 .hero-art .ln{stroke-dasharray:1;animation:hf-line 5s ease-out infinite}
 .hero-art .ln.l1{animation-name:hf-line1}.hero-art .ln.l2{animation-name:hf-line2}.hero-art .ln.l3{animation-name:hf-line3}
 .hero-art .sw{animation:hf-sw 5s ease-out infinite}
 .hero-art .chip{animation:hf-bob 5s ease-in-out infinite}
 .hero-art .c1{animation-delay:-.25s}.hero-art .c2{animation-delay:-.5s}.hero-art .c3{animation-delay:-.75s}
}
@keyframes hf-flow{to{stroke-dashoffset:-40}}
@keyframes hf-token{0%,4%{opacity:0;transform:none}10%{opacity:1;transform:none}40%{opacity:1;transform:translate(var(--dx),var(--dy))}46%,100%{opacity:0;transform:translate(var(--dx),var(--dy))}}
@keyframes hf-page{0%,44%{opacity:1;transform:none}50%{opacity:0;transform:translateY(-18px)}52%{opacity:0;transform:translateY(-18px)}64%,100%{opacity:1;transform:none}}
@keyframes hf-line{0%,44%{stroke-dashoffset:0}46%,52%{stroke-dashoffset:1}72%,100%{stroke-dashoffset:0}}
@keyframes hf-line1{0%,44%{stroke-dashoffset:0}46%,56%{stroke-dashoffset:1}76%,100%{stroke-dashoffset:0}}
@keyframes hf-line2{0%,44%{stroke-dashoffset:0}46%,60%{stroke-dashoffset:1}80%,100%{stroke-dashoffset:0}}
@keyframes hf-line3{0%,44%{stroke-dashoffset:0}46%,64%{stroke-dashoffset:1}84%,100%{stroke-dashoffset:0}}
@keyframes hf-sw{0%,44%{opacity:1}46%,70%{opacity:0}86%,100%{opacity:1}}
@keyframes hf-bob{0%,20%,100%{transform:none}10%{transform:translateY(-4px)}}
.kit-type .aa{background:#0B0D10;color:#F4F6F8;border-color:#0B0D10}
/* cap the layout at 1440px and centre it on wide screens; nav bar background stays full width */
main>section,.foot,.nav-in{max-width:1440px;margin-left:auto;margin-right:auto}
@media (min-width:1441px){main>section,.foot{border-left:1px solid var(--line);border-right:1px solid var(--line)}}