@font-face{font-family:"Archivo";src:url("/fonts/archivo.v2.3c93655578.woff2") format("woff2");font-weight:400 700;font-display:swap}
:root{
--field-blur:5.75px;
--paper:#FBF9F4; --navy:#1D1D2E; --navy-700:#3A3B52; --navy-500:#5C5E78;
--gold:#FFDB36; --gold-dim:#C9AE3E;
--bg:var(--paper); --ink:var(--navy); --ink-dim:var(--navy-500); --line:#E4DFCF;
--glass-a:0; --glass-2a:.27; --glass-blur:60px;
--pattern-op:0; --edge-strength:0; --veil-blur:4px; --refract:.42;
--card-tone-a:0.07; --card-grain-a:0.21;
--tone-out:2px; --tone-spread:37%;
--tone1-x:100%; --tone1-y:10%; --tone2-x:12%; --tone2-y:92%;
--card-tilt-x:2; --card-tilt-y:2; --card-scale:1;
--card-persp:1000px; --card-return:1400;
--card-ease:cubic-bezier(.22,1,.30,1); --card-intensity:1.1;
--chip-tilt-mult:1.3; --chip-persp:620px;
--tint-a:.60; --tint-dir:360deg; --tint-rgb:255,214,51;
--dl-tint-rgb:255,219,54;  --dl-tint-a:0.56;
--seg-tint-rgb:92,94,120; --seg-tint-a:0.00;
--btn-shadow-blur:2px; --btn-size:1.26rem;
--glass:rgba(255,255,255,var(--glass-a)); --glass-2:rgba(255,255,255,var(--glass-2a));
--glass-edge:rgba(255,255,255,.85); --hover:rgba(29,29,46,.05);
--shadow:rgba(29,29,46,.10); --on-gold:var(--navy); --dot:29,29,46; --dot-a:.22;
--lg-bg:rgba(255,255,255,.15); --lg-border:rgba(255,255,255,.42);
--lg-shadow:rgba(29,29,46,.16); --lg-hi:rgba(255,255,255,.85);
--lg-caustic:rgba(255,255,255,.45); --lg-refl:rgba(255,255,255,.55);
}
*{box-sizing:border-box;margin:0;padding:0}
html{color-scheme:light;scroll-behavior:smooth;scrollbar-gutter:stable}
body{font-family:"Archivo",-apple-system,sans-serif;background:var(--bg);color:var(--ink);
-webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background .5s,color .5s}
body::before{
content:"";position:fixed;left:-10%;top:-10%;width:120%;height:120%;
z-index:0;pointer-events:none;opacity:var(--wash-op,.5);
background-image:
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/></svg>"),
radial-gradient(70% 60% at 22% 24%, rgba(29,29,46,.30), transparent 72%),
radial-gradient(64% 58% at 82% 72%, rgba(255,219,54,.34), transparent 72%);
background-size:220px 220px, auto, auto;
background-blend-mode:multiply, normal, normal;
animation:washDrift 89s ease-in-out infinite alternate}
@keyframes washDrift{
from{transform:scale(1) translate(0,0)}
to{transform:scale(1.1) translate(-2%,1.5%)}}
#circuit{position:fixed;left:0;top:0;width:100%;height:100%;
z-index:0;pointer-events:none;opacity:0;
filter:blur(var(--field-blur))}
@media (prefers-reduced-motion:reduce){
body::before{animation:none}
}
#gridwrap{position:fixed;inset:0;z-index:0;pointer-events:none;perspective:900px;perspective-origin:50% 46%}
#grid{width:100%;height:100%;display:block;transform-origin:50% 62%;
transform:rotateX(var(--gx,0deg)) rotateY(var(--gy,0deg))}
body[data-home].play #grid{animation:gridIn 2.2s cubic-bezier(.18,.86,.22,1) forwards}
#grid.settled{animation:none;transition:transform .5s cubic-bezier(.2,.8,.25,1)}
@keyframes gridIn{from{transform:rotateX(60deg) scale(1.55);opacity:0}35%{opacity:1}to{transform:none;opacity:1}}
#veil{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:0;
transition:opacity .8s ease;
-webkit-mask-image:linear-gradient(to right, transparent 0 26px, #000 46px);
mask-image:linear-gradient(to right, transparent 0 26px, #000 46px)}
body[data-past="on"] #veil{opacity:1;
backdrop-filter:blur(var(--veil-blur,14px));-webkit-backdrop-filter:blur(var(--veil-blur,14px))}
.skip-link{
position:absolute;left:50%;top:0;transform:translate(-50%,-120%);
z-index:400;background:var(--navy);color:var(--paper);
font-size:.85rem;font-weight:500;padding:10px 18px;
border-radius:0 0 8px 8px;text-decoration:none;
transition:transform .18s ease;
}
.skip-link:focus{transform:translate(-50%,0)}
:where(a, button, [tabindex]):focus-visible{
outline:2px solid var(--navy);
outline-offset:3px;
border-radius:3px}
.topbar{position:sticky;top:0;z-index:120;border-bottom:1px solid transparent;
transition:background .4s,border-color .3s}
body[data-frost="on"] .topbar{background:rgba(251,249,244,.92);border-bottom-color:var(--line);
backdrop-filter:saturate(180%) blur(22px);-webkit-backdrop-filter:saturate(180%) blur(22px)}
.navlink{position:relative;padding:7px 2px;
font-size:.9rem;font-weight:500;color:var(--navy-700);text-decoration:none;
transition:color .18s}
.navlink::before{content:"";position:absolute;left:0;right:0;bottom:1px;height:2px;
background:var(--navy);border-radius:2px;
clip-path:inset(0 100% 0 0);
transition:clip-path .28s cubic-bezier(.22,1,.3,1)}
.nav-links{margin-left:auto;display:flex;align-items:center;list-style:none}
.nav-links li + li{margin-left:26px}
.navlink:hover{color:var(--ink)}
.navlink:hover::before{clip-path:inset(0 0 0 0)}
.navlink[aria-current="page"]{color:var(--ink);font-weight:600}
.navlink[aria-current="page"]::before{background:var(--gold);clip-path:inset(0 0 0 0)}
.topbar-inner{position:relative;z-index:1;
max-width:1100px;margin:0 auto;display:flex;align-items:center;gap:18px;padding:13px clamp(18px,4vw,30px)}
.brand{display:flex;align-items:center;gap:11px;font-weight:600;font-size:.98rem;color:inherit;text-decoration:none}
.brand .mk{width:27px;height:27px;flex:0 0 auto;display:block}
.menu-toggle{display:none}
.topbar-inner{flex-wrap:wrap}
@media (max-width:639px){
html.js .nav-links{
position:absolute;top:calc(100% + 8px);right:clamp(18px,4vw,30px);
min-width:190px;flex-direction:column;align-items:stretch;
margin:0;padding:7px;
background:rgba(255,255,255,.96);
border:1px solid var(--glass-edge);border-radius:16px;
box-shadow:0 18px 44px var(--shadow);
opacity:0;visibility:hidden;transform:translateY(-6px) scale(.97);
transform-origin:top right;
transition:opacity .18s,transform .26s cubic-bezier(.2,.8,.25,1),visibility .26s}
html.js .nav-links.open{opacity:1;visibility:visible;transform:none}
html.js .nav-links li + li{margin-left:0;margin-top:2px}
html.js .navlink{display:block;padding:9px 12px;border-radius:10px}
html.js .nav-links .navlink::before{display:none}
html.js .navlink:hover{background:var(--hover)}
html.js .menu-toggle{display:block;position:relative;margin-left:auto;
background:none;border:1px solid transparent;border-radius:10px;
color:inherit;padding:9px;cursor:pointer;line-height:0}
html.js .menu-toggle::after{content:"";position:absolute;top:50%;left:50%;
width:44px;height:44px;transform:translate(-50%,-50%)}
html.js .menu-toggle:hover{border-color:var(--line);background:var(--hover)}
.menu-bars{display:block;width:19px}
.menu-bars i{display:block;height:1.5px;background:currentColor;border-radius:2px;
transition:transform .3s cubic-bezier(.2,.7,.3,1),opacity .16s}
.menu-bars i + i{margin-top:5px}
.menu-toggle[aria-expanded="true"] .menu-bars i:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] .menu-bars i:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] .menu-bars i:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
}
.hero{position:relative;min-height:clamp(460px, calc(100vh - 56px), 660px);
display:flex;align-items:center;justify-content:center;padding:40px 24px 64px}
.hero-inner{position:relative;z-index:3;max-width:820px;text-align:center}
h1{font-size:clamp(1.6rem,5.8vw,3.9rem);line-height:1.06;font-weight:700;letter-spacing:-.035em}
.lede{margin:24px auto 0;max-width:36em;font-size:clamp(1.02rem,2vw,1.18rem);line-height:1.55;color:var(--ink-dim)}
@property --rim-angle{syntax:"<angle>";initial-value:-75deg;inherits:false}
@property --tint-dir{syntax:"<angle>";initial-value:360deg;inherits:true}
@property --tint-a{syntax:"<number>";initial-value:.6;inherits:true}
.btn-wrap{position:relative;display:inline-block;margin-top:34px;
border-radius:999vw;pointer-events:none}
.btn-shadow{--cut:2em;position:absolute;width:calc(100% + var(--cut));height:calc(100% + var(--cut));
top:calc(0% - var(--cut) / 2);left:calc(0% - var(--cut) / 2);
filter:blur(var(--btn-shadow-blur, 2px));pointer-events:none}
.btn-shadow::after{content:"";position:absolute;z-index:0;inset:0;border-radius:999vw;
background:linear-gradient(180deg, rgba(29,29,46,.20), rgba(29,29,46,.10));
width:calc(100% - var(--cut) - .25em);height:calc(100% - var(--cut) - .25em);
top:calc(var(--cut) - .5em);left:calc(var(--cut) - .875em);
padding:.125em;box-sizing:border-box;
-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
-webkit-mask-composite:xor;
mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
mask-composite:exclude;
transition:all 400ms cubic-bezier(.25,1,.5,1)}
.cta{--bw:clamp(1px, .0625em, 4px);
position:relative;z-index:3;display:inline-block;pointer-events:auto;
text-decoration:none;border-radius:999vw;
font-size:var(--btn-size, clamp(1.15rem, 1.7vw, 1.5rem));
background:linear-gradient(-75deg, rgba(255,255,255,.05), rgba(255,255,255,.22), rgba(255,255,255,.05));
box-shadow:inset 0 .125em .125em rgba(29,29,46,.05),
inset 0 -.125em .125em rgba(255,255,255,.5),
0 .25em .125em -.125em rgba(29,29,46,.2),
0 0 .1em .25em inset rgba(255,255,255,.2);
backdrop-filter:blur(clamp(1px, .125em, 4px));
-webkit-backdrop-filter:blur(clamp(1px, .125em, 4px));
transition:all 400ms cubic-bezier(.25,1,.5,1)}
.cta:hover{
backdrop-filter:blur(.01em);-webkit-backdrop-filter:blur(.01em);
box-shadow:inset 0 .125em .125em rgba(29,29,46,.05),
inset 0 -.125em .125em rgba(255,255,255,.5),
0 .15em .05em -.1em rgba(29,29,46,.25),
0 0 .05em .1em inset rgba(255,255,255,.5)}
.cta::before{content:"";position:absolute;inset:0;border-radius:inherit;
pointer-events:none;z-index:2;mix-blend-mode:overlay;
background-image:linear-gradient(var(--tint-dir, 135deg),
rgba(var(--tint-rgb, 255,219,54), var(--tint-a, .17)), transparent)}
.cta:focus-visible{outline:2px solid var(--navy-700);outline-offset:4px;border-radius:999px}
.cta > span{position:relative;display:block;user-select:none;
font-weight:600;letter-spacing:-.02em;font-size:1em;color:var(--navy);
text-shadow:0 .06em .14em rgba(29,29,46,.16);
padding-inline:1.6em;padding-block:.9em;
transition:all 400ms cubic-bezier(.25,1,.5,1)}
.cta:hover > span{text-shadow:0 .03em .1em rgba(29,29,46,.2)}
.cta::after{content:"";position:absolute;z-index:1;inset:0;border-radius:999vw;
width:calc(100% + var(--bw));height:calc(100% + var(--bw));
top:calc(0% - var(--bw) / 2);left:calc(0% - var(--bw) / 2);
padding:var(--bw);box-sizing:border-box;pointer-events:none;
background:conic-gradient(from var(--rim-angle) at 50% 50%,
rgba(29,29,46,.5), rgba(29,29,46,0) 5% 40%, rgba(29,29,46,.5) 50%,
rgba(29,29,46,0) 60% 95%, rgba(29,29,46,.5)),
linear-gradient(180deg, rgba(255,255,255,.5), rgba(255,255,255,.5));
-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
-webkit-mask-composite:xor;
mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
mask-composite:exclude;
box-shadow:inset 0 0 0 calc(var(--bw)/2) rgba(255,255,255,.5);
transition:all 400ms cubic-bezier(.25,1,.5,1), --rim-angle 500ms ease}
.cta:active::after{--rim-angle:-75deg}
body[data-anim="turn"] .cta::after{transition:all 400ms cubic-bezier(.25,1,.5,1), --rim-angle 900ms cubic-bezier(.4,0,.2,1)}
body[data-anim="turn"] .cta:hover::after{--rim-angle:285deg}
body[data-anim="turn"] .cta:hover{transform:scale(.99)}
body[data-anim="magnetic"] .cta{transition:transform 260ms cubic-bezier(.22,1,.3,1),
backdrop-filter 400ms, box-shadow 400ms}
body[data-anim="magnetic"] .cta:hover{
transform:translate(calc(var(--dx,0px) * .28), calc(var(--dy,0px) * .32))}
body[data-anim="magnetic"] .cta:hover > span{
transform:translate(calc(var(--dx,0px) * -.09), calc(var(--dy,0px) * -.1))}
body[data-anim="magnetic"] .cta > span{transition:transform 380ms cubic-bezier(.22,1,.3,1)}
body[data-anim="ripple"] .cta > span::before{content:"";position:absolute;
left:var(--mx,50%);top:var(--my,50%);width:2px;height:2px;border-radius:50%;
transform:translate(-50%,-50%) scale(1);pointer-events:none;z-index:-1;
background:radial-gradient(circle, rgba(255,219,54,.85), rgba(255,219,54,0) 70%);
opacity:0;transition:transform 620ms cubic-bezier(.2,.8,.25,1),opacity 620ms ease}
body[data-anim="ripple"] .cta:hover > span::before{transform:translate(-50%,-50%) scale(210);opacity:1}
body[data-anim="ripple"] .cta:hover{transform:scale(.99)}
body[data-anim="fill"] .cta > span::before{content:"";position:absolute;inset:0;
border-radius:inherit;pointer-events:none;z-index:-1;background:var(--gold);
transform-origin:bottom;transform:scaleY(0);
transition:transform 420ms cubic-bezier(.3,1,.35,1)}
body[data-anim="fill"] .cta:hover > span::before{transform:scaleY(1)}
body[data-anim="fill"] .cta:hover > span{text-shadow:none}
body[data-anim="fill"] .cta:hover::after{--rim-angle:-95deg}
body[data-anim="swap"] .cta > span{overflow:hidden;display:block}
body[data-anim="swap"] .cta > span::before{content:attr(data-label);
position:absolute;left:0;right:0;top:100%;
padding-inline:inherit;padding-block:inherit;
transition:transform 420ms cubic-bezier(.3,1,.35,1);pointer-events:none}
body[data-anim="swap"] .cta > span{transition:transform 420ms cubic-bezier(.3,1,.35,1)}
body[data-anim="swap"] .cta:hover > span{transform:translateY(-100%)}
body[data-anim="swap"] .cta:hover > span::before{transform:translateY(-100%)}
body[data-anim="tilt"] .btn-wrap{perspective:620px}
body[data-anim="tilt"] .cta{transition:transform 220ms cubic-bezier(.22,1,.3,1),
backdrop-filter 400ms, box-shadow 400ms;transform-style:preserve-3d}
body[data-anim="tilt"] .cta:hover{
transform:rotateY(calc(var(--dx,0px) * .10deg)) rotateX(calc(var(--dy,0px) * -.13deg)) scale(1.03)}
:root{--btn-ease:cubic-bezier(.16,.84,.28,1)}
.cta{--btn-in:190ms;--btn-press:130ms}
@property --rise{syntax:"<percentage>";initial-value:34%;inherits:true}
@property --split{syntax:"<percentage>";initial-value:0%;inherits:true}
@property --flare{syntax:"<percentage>";initial-value:58%;inherits:true}
@property --tide{syntax:"<percentage>";initial-value:20%;inherits:true}
@property --mx{syntax:"<percentage>";initial-value:50%;inherits:true}
@property --my{syntax:"<percentage>";initial-value:50%;inherits:true}
@property --pool-r{syntax:"<percentage>";initial-value:74%;inherits:true}
body[data-anim="sweep"] .cta{
transition:backdrop-filter 260ms var(--btn-ease), box-shadow 260ms var(--btn-ease),
--tint-dir var(--btn-in) var(--btn-ease), --tint-a var(--btn-in) var(--btn-ease)}
body[data-anim="sweep"] .cta:hover{--tint-dir:186deg;--tint-a:.74}
body[data-anim="sweep"] .cta:active{
transition:--tint-dir var(--btn-press) var(--btn-ease), --tint-a var(--btn-press) var(--btn-ease);
--tint-dir:88deg;--tint-a:.96}
body[data-anim="pool"] .cta::before{
background-image:radial-gradient(72% 150% at var(--mx) var(--my),
rgba(var(--tint-rgb), var(--tint-a)) 0%, rgba(var(--tint-rgb), 0) var(--pool-r))}
body[data-anim="pool"] .cta{
transition:--mx 440ms var(--btn-ease), --my 440ms var(--btn-ease),
--pool-r 300ms var(--btn-ease), --tint-a 300ms var(--btn-ease),
backdrop-filter 260ms var(--btn-ease), box-shadow 260ms var(--btn-ease)}
body[data-anim="pool"] .cta:hover{
transition:--mx 0s, --my 0s,
--pool-r var(--btn-in) var(--btn-ease), --tint-a var(--btn-in) var(--btn-ease),
backdrop-filter 260ms var(--btn-ease), box-shadow 260ms var(--btn-ease);
--tint-a:.9}
body[data-anim="pool"] .cta:active{
transition:--mx 0s, --my 0s,
--pool-r var(--btn-press) var(--btn-ease), --tint-a var(--btn-press) var(--btn-ease);
--pool-r:260%;--tint-a:1}
body[data-anim="rise"] .cta::before{
background-image:linear-gradient(0deg,
rgba(var(--tint-rgb), var(--tint-a)) 0%,
rgba(var(--tint-rgb), var(--tint-a)) var(--rise),
rgba(var(--tint-rgb), 0) calc(var(--rise) + 34%))}
body[data-anim="rise"] .cta{transition:--rise var(--btn-in) var(--btn-ease),
--tint-a var(--btn-in) var(--btn-ease),
backdrop-filter 260ms var(--btn-ease), box-shadow 260ms var(--btn-ease)}
body[data-anim="rise"] .cta:hover{--rise:88%;--tint-a:.72}
body[data-anim="rise"] .cta:active{
transition:--rise var(--btn-press) var(--btn-ease), --tint-a var(--btn-press) var(--btn-ease);
--rise:124%;--tint-a:.95}
body[data-anim="split"] .cta::before{
background-image:radial-gradient(58% 150% at calc(50% - var(--split)) 50%,
rgba(var(--tint-rgb), var(--tint-a)) 0%, rgba(var(--tint-rgb), 0) 70%),
radial-gradient(58% 150% at calc(50% + var(--split)) 50%,
rgba(var(--tint-rgb), var(--tint-a)) 0%, rgba(var(--tint-rgb), 0) 70%)}
body[data-anim="split"] .cta{transition:--split var(--btn-in) var(--btn-ease),
--tint-a var(--btn-in) var(--btn-ease),
backdrop-filter 260ms var(--btn-ease), box-shadow 260ms var(--btn-ease)}
body[data-anim="split"] .cta:hover{--split:30%;--tint-a:.72}
body[data-anim="split"] .cta:active{
transition:--split var(--btn-press) var(--btn-ease), --tint-a var(--btn-press) var(--btn-ease);
--split:44%;--tint-a:.94}
body[data-anim="tide"] .cta::before{
background-image:linear-gradient(100deg,
rgba(var(--tint-rgb), 0) calc(var(--tide) - 36%),
rgba(var(--tint-rgb), var(--tint-a)) var(--tide),
rgba(var(--tint-rgb), 0) calc(var(--tide) + 36%))}
body[data-anim="tide"] .cta{transition:--tide var(--btn-in) var(--btn-ease),
--tint-a var(--btn-in) var(--btn-ease),
backdrop-filter 260ms var(--btn-ease), box-shadow 260ms var(--btn-ease)}
body[data-anim="tide"] .cta:hover{--tide:78%;--tint-a:.76}
body[data-anim="tide"] .cta:active{
transition:--tide var(--btn-press) var(--btn-ease), --tint-a var(--btn-press) var(--btn-ease);
--tide:108%;--tint-a:.96}
body[data-anim="flare"] .cta::before{
background-image:radial-gradient(130% 170% at 50% 118%,
rgba(var(--tint-rgb), var(--tint-a)) 0%, rgba(var(--tint-rgb), 0) var(--flare))}
body[data-anim="flare"] .cta{transition:--flare var(--btn-in) var(--btn-ease),
--tint-a var(--btn-in) var(--btn-ease),
backdrop-filter 260ms var(--btn-ease), box-shadow 260ms var(--btn-ease)}
body[data-anim="flare"] .cta:hover{--flare:98%;--tint-a:.8}
body[data-anim="flare"] .cta:active{
transition:--flare var(--btn-press) var(--btn-ease), --tint-a var(--btn-press) var(--btn-ease);
--flare:130%;--tint-a:1}
body[data-anim="sweep"] .cta:hover,body[data-anim="pool"] .cta:hover,
body[data-anim="rise"] .cta:hover,body[data-anim="split"] .cta:hover,
body[data-anim="tide"] .cta:hover,body[data-anim="flare"] .cta:hover{transform:none}
@media (hover:none) and (pointer:coarse){
.cta::after,.cta:hover::after,.cta:active::after{--rim-angle:-75deg}
}
@media (prefers-reduced-motion:reduce){
.cta,.cta:hover,.cta > span,.cta:hover > span,
.cta > span::before,.cta:hover > span::before{transform:none !important}
}
.loop{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);z-index:3;
width:34px;height:34px;color:var(--ink-dim)}
.loop svg{width:100%;height:100%;display:block;animation:spin 5.5s linear infinite}
.loop .dot{animation:bob 2.4s ease-in-out infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes bob{0%,100%{opacity:.25}50%{opacity:1}}
h1 .line{display:block;overflow:hidden}
h1 .line > span{display:block}
body[data-intro="lines"].play h1 .line > span{transform:translateY(106%);animation:lineUp .9s cubic-bezier(.16,.84,.24,1) forwards}
body[data-intro="lines"].play h1 .line:nth-child(2) > span{animation-delay:.13s}
@keyframes lineUp{to{transform:none}}
body[data-intro="assemble"].play h1 .ch{opacity:0;filter:blur(9px);transform:translateY(24px);
animation:chIn .62s cubic-bezier(.2,.8,.25,1) forwards;animation-delay:calc(var(--c) * 26ms)}
@keyframes chIn{to{opacity:1;filter:blur(0);transform:none}}
body[data-intro="assemble"].play h1 .w{opacity:0;filter:blur(14px);
transform:translate3d(var(--dx),var(--dy),0) scale(1.4) rotate(var(--rot));
animation:wIn .95s cubic-bezier(.18,.86,.22,1) forwards;animation-delay:calc(var(--n) * 85ms)}
@keyframes wIn{to{opacity:1;filter:blur(0);transform:none}}
body.play .lede,body.play .hero .cta{opacity:0;animation:fadeUp .8s ease forwards}
body.play .lede{animation-delay:.72s}
body.play .hero .cta{animation-delay:.86s}
body.play .brand{opacity:0;animation:fadeOnly .9s ease forwards;animation-delay:.1s}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes fadeOnly{from{opacity:0}to{opacity:1}}
.lg{position:relative;isolation:isolate;
background:var(--lg-bg);
backdrop-filter:blur(var(--lg-blur,34px)) saturate(190%);
-webkit-backdrop-filter:blur(var(--lg-blur,34px)) saturate(190%);
box-shadow:
0 40px 80px -22px var(--lg-shadow),
0 10px 30px -12px var(--lg-shadow),
inset 0 2px 3px -1px var(--lg-hi),
inset 0 -2px 4px -1px var(--lg-caustic),
inset 0 0 0 1px var(--lg-border)}
.lg::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;
backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
filter:url(#refract);-webkit-filter:url(#refract);
isolation:isolate;pointer-events:none;opacity:var(--refract,1)}
body.scrolling .lg::after{filter:none;-webkit-filter:none;
backdrop-filter:none;-webkit-backdrop-filter:none}
.lg-hi{position:absolute;top:1px;left:1px;right:1px;height:46%;pointer-events:none;z-index:1;
border-radius:inherit;
background:linear-gradient(180deg,var(--lg-refl) 0%,transparent 100%)}
.section{position:relative;z-index:1;padding:clamp(40px,5.5vw,76px) clamp(14px,3vw,28px)}
.stack{max-width:920px;margin:0 auto;position:relative;will-change:transform}
body[data-stack="on"] .stack::before,
body[data-stack="on"] .stack::after{content:"";position:absolute;left:0;right:0;border-radius:30px;
background:var(--glass-2);border:1px solid var(--glass-edge);pointer-events:none;
transition:opacity .4s}
body[data-stack="on"] .stack::before{
top:calc(-14px * var(--spread,1));bottom:calc(14px * var(--spread,1));
transform:scaleX(calc(1 - .035 * var(--spread,1)));
backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:.85}
body[data-stack="on"] .stack::after{
top:calc(-28px * var(--spread,1));bottom:calc(28px * var(--spread,1));
transform:scaleX(calc(1 - .072 * var(--spread,1)));
backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);opacity:.6}
.panel::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
z-index:0;opacity:0;transition:opacity .4s}
body:not([data-pattern="none"]) .panel::before{opacity:var(--pattern-op,.5)}
body[data-pattern="none"] .panel::before{background-image:
repeating-linear-gradient(0deg, rgba(var(--dot),.10) 0 1px, transparent 1px 3px),
repeating-linear-gradient(90deg, rgba(var(--dot),.08) 0 1px, transparent 1px 3px)}
body[data-pattern="grid"] .panel::before{background-image:
linear-gradient(0deg, rgba(var(--dot),.10) 1px, transparent 1px),
linear-gradient(90deg, rgba(var(--dot),.10) 1px, transparent 1px);
background-size:34px 34px}
body[data-pattern="dots"] .panel::before{background-image:
radial-gradient(circle at 1px 1px, rgba(var(--dot),.16) 1px, transparent 0);
background-size:16px 16px}
body[data-pattern="lines"] .panel::before{background-image:
repeating-linear-gradient(52deg, rgba(var(--dot),.09) 0 1px, transparent 1px 9px)}
body[data-pattern="frost"] .panel::before{background-image:
radial-gradient(circle at 2px 3px, rgba(var(--dot),.13) .8px, transparent 0),
radial-gradient(circle at 9px 7px, rgba(var(--dot),.10) .8px, transparent 0),
radial-gradient(circle at 5px 12px, rgba(var(--dot),.08) .8px, transparent 0);
background-size:13px 15px, 17px 19px, 23px 21px}
.panel > *{position:relative;z-index:1}
.panel{z-index:1;border-radius:30px;--panel-pad:clamp(30px,4.5vw,58px);
padding:var(--panel-pad);--lg-blur:var(--glass-blur)}
.section-label{font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
color:var(--ink-dim);margin-bottom:14px;display:flex;align-items:center;gap:10px}
.section-label::after{content:"";flex:1;height:1px;background:var(--line)}
.section-title{font-size:clamp(1.6rem,3.4vw,2.2rem);font-weight:600;letter-spacing:-.022em}
.prose{margin-top:18px;max-width:62ch}
.prose p + p{margin-top:14px}
.prose p{font-size:1rem;line-height:1.7}
.prose a:not(.more){color:var(--navy-700);text-decoration:underline;
text-underline-offset:2px;text-decoration-thickness:1px;
text-decoration-color:rgba(58,59,82,.4)}
.prose a:not(.more):hover{text-decoration-color:currentColor}
.cards{margin-top:30px;list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:32px}
@media (max-width:640px){.cards{grid-template-columns:1fr}}
.card{border-radius:18px;padding:16px;--lg-blur:9px;
--lg-bg:rgba(255,255,255,.26);--lg-border:rgba(255,255,255,.55)}
.cardwrap{position:relative;isolation:isolate;min-width:0;
--chip-shade:color-mix(in srgb, var(--tone) 62%, var(--navy))}
.cardwrap .tone{position:absolute;z-index:0;pointer-events:none;
inset:calc(var(--tone-out,0px) * -1);
border-radius:calc(18px + var(--tone-out,0px));
opacity:var(--card-tone-a,.5);
background:
radial-gradient(circle at var(--tone1-x,84%) var(--tone1-y,10%),
var(--tone) 0%, transparent var(--tone-spread,58%)),
radial-gradient(circle at var(--tone2-x,12%) var(--tone2-y,92%),
var(--tone2, var(--tone)) 0%, transparent calc(var(--tone-spread,58%) - 8%))}
.cardwrap > .card{position:relative;z-index:1;height:100%}
.cardwrap::after{content:"";position:absolute;inset:0;z-index:2;border-radius:18px;
pointer-events:none;opacity:var(--card-grain-a,.13);mix-blend-mode:overlay;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
background-size:78px 78px}
.cards{perspective:var(--card-persp,1000px)}
.chip{position:relative;display:block;border-radius:13px;padding:11px 14px;
background:rgba(255,255,255,.72);
box-shadow:0 6px 16px -4px rgba(29,29,46,.16),
inset 0 1px 1px rgba(255,255,255,.95),
inset 0 0 0 1px rgba(255,255,255,.6);
box-shadow:0 6px 16px -4px color-mix(in srgb, var(--chip-shade) 30%, transparent),
inset 0 1px 1px rgba(255,255,255,.95),
inset 0 0 0 1px rgba(255,255,255,.6);
font-size:1.02rem;font-weight:600;letter-spacing:-.012em;margin-bottom:12px;
transition:box-shadow 260ms cubic-bezier(.16,.84,.28,1)}
.cardwrap > .card:hover .chip{
box-shadow:0 13px 26px -8px rgba(29,29,46,.26),
inset 0 1px 1px rgba(255,255,255,.95),
inset 0 0 0 1px rgba(255,255,255,.7);
box-shadow:0 13px 26px -8px color-mix(in srgb, var(--chip-shade) 46%, transparent),
inset 0 1px 1px rgba(255,255,255,.95),
inset 0 0 0 1px rgba(255,255,255,.7)}
.card p{padding:0 4px 2px}
.card::after{filter:url(#refract-sm);-webkit-filter:url(#refract-sm)}
@property --ang{syntax:"<angle>";initial-value:0deg;inherits:false}
body[data-tones="on"] .card::after{content:"";position:absolute;inset:0;border-radius:inherit;
pointer-events:none;z-index:2;padding:1px;
--ang:calc(var(--k) * 90deg);
background:conic-gradient(from var(--ang),
transparent 0 6%, var(--tone) 15%, transparent 30%,
transparent 54%, var(--tone2, var(--tone)) 68%, transparent 84%);
-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
-webkit-mask-composite:xor;
mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
mask-composite:exclude;
opacity:var(--edge-strength,.85)}
.card h3,.card p{position:relative;z-index:1}
.card h3{font-size:1.08rem;font-weight:600}
.card p{margin-top:10px;font-size:.92rem;line-height:1.6;color:var(--navy-700)}
.page-head .prose{max-width:66ch}
.prose .lede-2{font-size:1.12rem;line-height:1.6;font-weight:500}
.sub{margin-top:38px;font-size:1.06rem;font-weight:600;letter-spacing:-.012em;color:var(--ink)}
.sub + .prose{margin-top:10px}
.more{display:inline-flex;align-items:center;gap:.4em;font-weight:600;color:var(--ink);
text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;
text-decoration-color:rgba(29,29,46,.3)}
.more::after{content:"\2192";transition:transform .18s ease}
.more:hover{text-decoration-color:currentColor}
.more:hover::after{transform:translateX(3px)}
.contact{margin-top:28px;display:grid;gap:24px;
grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.page-head .contact{margin-top:34px;padding-top:28px;border-top:1px solid var(--line)}
.contact > div{min-width:0}
.contact dt{font-size:.72rem;font-weight:600;letter-spacing:.14em;
text-transform:uppercase;color:var(--ink-dim)}
.contact dd{margin:9px 0 0;font-size:.98rem;line-height:1.65}
.contact dd a{padding:4px 0;display:inline-block;color:var(--ink);font-weight:500;text-decoration:underline;
text-underline-offset:3px;text-decoration-thickness:1px;
text-decoration-color:rgba(29,29,46,.32);overflow-wrap:anywhere}
.contact dd a:hover{text-decoration-color:currentColor}
.kit{margin-top:26px;padding:22px;border-radius:20px;
background:rgba(255,255,255,.42);border:1px solid var(--glass-edge);
display:flex;flex-wrap:wrap;gap:26px;align-items:center}
.kit-stage{flex:0 0 auto;width:180px;height:180px;
position:relative;display:grid;place-items:center;border-radius:18px;
background:rgba(29,29,46,.055);
box-shadow:inset 0 2px 5px rgba(29,29,46,.14),
inset 0 -1px 0 rgba(255,255,255,.55);
border:1px solid rgba(29,29,46,.07)}
.kit-frame{position:relative;width:160px;height:160px;
transform:scale(var(--k,.72));
transition:transform .46s cubic-bezier(.22,1,.3,1)}
.kit-shot{position:absolute;inset:0;width:100%;height:100%;
opacity:0;transition:opacity .3s ease}
.kit:has(#ks-128:checked){--k:.34}
.kit:has(#ks-256:checked){--k:.52}
.kit:has(#ks-512:checked){--k:.74}
.kit:has(#ks-1024:checked){--k:1}
.kit:has(#kv-logo:checked) .kit-shot[data-v="logo"]{opacity:1}
.kit:has(#kv-mark:checked) .kit-shot[data-v="mark"]{opacity:1}
.kit-controls{flex:1 1 260px;min-width:0;display:flex;flex-direction:column;gap:16px}
.kit-field{border:0;padding:0;margin:0;min-width:0}
.kit-legend{padding:0;margin-bottom:7px;font-size:.72rem;font-weight:600;
letter-spacing:.1em;text-transform:uppercase;color:var(--navy-700)}
.kit-seg{position:relative;display:grid;grid-auto-flow:column;
grid-auto-columns:1fr;gap:0;padding:3px;border-radius:999px;
background:rgba(29,29,46,.055);
box-shadow:inset 0 1px 2px rgba(29,29,46,.13),
inset 0 -1px 0 rgba(255,255,255,.55);
border:1px solid rgba(29,29,46,.07)}
.kit-pill{position:absolute;z-index:0;
--tint-rgb:var(--seg-tint-rgb);--tint-a:var(--seg-tint-a);
top:3px;bottom:3px;left:3px;width:calc((100% - 6px) / var(--n));
--bw:clamp(1px,.0625em,4px);
font-size:.85rem;                       
border-radius:999vw;pointer-events:none;
background:linear-gradient(-75deg,rgba(255,255,255,.05),rgba(255,255,255,.22),rgba(255,255,255,.05));
box-shadow:inset 0 .125em .125em rgba(29,29,46,.05),
inset 0 -.125em .125em rgba(255,255,255,.5),
0 .25em .125em -.125em rgba(29,29,46,.2),
0 0 .1em .25em inset rgba(255,255,255,.2);
backdrop-filter:blur(clamp(1px,.125em,4px));
-webkit-backdrop-filter:blur(clamp(1px,.125em,4px));
transform:translateX(calc(var(--i,0) * 100%));
transition:transform .38s cubic-bezier(.22,1,.3,1)}
.kit-pill::before{content:"";position:absolute;inset:0;border-radius:inherit;
pointer-events:none;z-index:2;mix-blend-mode:overlay;
background-image:linear-gradient(var(--tint-dir,135deg),
rgba(var(--tint-rgb,255,219,54),var(--tint-a,.17)),transparent)}
.kit-pill::after{content:"";position:absolute;z-index:1;border-radius:999vw;
width:calc(100% + var(--bw));height:calc(100% + var(--bw));
top:calc(0% - var(--bw) / 2);left:calc(0% - var(--bw) / 2);
padding:var(--bw);box-sizing:border-box;pointer-events:none;
background:conic-gradient(from var(--rim-angle,-75deg) at 50% 50%,
rgba(29,29,46,.5), rgba(29,29,46,0) 5% 40%, rgba(29,29,46,.5) 50%,
rgba(29,29,46,0) 60% 95%, rgba(29,29,46,.5)),
linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,.5));
-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
-webkit-mask-composite:xor;
mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
mask-composite:exclude;
box-shadow:inset 0 0 0 calc(var(--bw)/2) rgba(255,255,255,.5)}
.kit-seg[data-n="2"]{--n:2}
.kit-seg[data-n="4"]{--n:4}
.kit:has(#kv-logo:checked) .kit-seg[data-n="2"]{--i:0}
.kit:has(#kv-mark:checked) .kit-seg[data-n="2"]{--i:1}
.kit:has(#ks-128:checked)  .kit-seg[data-n="4"]{--i:0}
.kit:has(#ks-256:checked)  .kit-seg[data-n="4"]{--i:1}
.kit:has(#ks-512:checked)  .kit-seg[data-n="4"]{--i:2}
.kit:has(#ks-1024:checked) .kit-seg[data-n="4"]{--i:3}
.kit-opt{position:relative;z-index:1;display:block;text-align:center;cursor:pointer}
.kit-opt input{position:absolute;width:1px;height:1px;opacity:0;
margin:0;pointer-events:none}
.kit-opt span{display:block;padding:8px 10px;border-radius:999px;
font-size:.85rem;font-weight:500;color:var(--navy-700);
white-space:nowrap;transition:color .22s}
.kit-opt input:checked + span{color:var(--ink);font-weight:600}
.kit-opt input:focus-visible + span{outline:2px solid var(--navy);outline-offset:2px}
.kit-actions{position:relative;display:grid;grid-template-columns:max-content}
.kit-actions .kit-dl.cta{grid-area:1/1;visibility:hidden}
.kit-actions .kit-dl > span{transition:text-shadow 400ms cubic-bezier(.25,1,.5,1)}
.kit-actions .kit-dl::after{transition:--rim-angle 500ms ease}
.kit-n{display:inline-block;width:2.2em;text-align:center;white-space:nowrap;
font-variant-numeric:tabular-nums;perspective:220px}
.kit-n i{display:inline-block;font-style:normal;
transform:rotateX(-90deg);transform-origin:50% 50% -.6em;
transition:transform .42s cubic-bezier(.22,.85,.3,1)}
.kit-n i:nth-child(2){transition-delay:.055s}
.kit-n i:nth-child(3){transition-delay:.11s}
.kit-n i:nth-child(4){transition-delay:.165s}
.kit:has(#kv-logo:checked):has(#ks-128:checked)  .kit-dl[data-v="logo"][data-s="128"],
.kit:has(#kv-logo:checked):has(#ks-256:checked)  .kit-dl[data-v="logo"][data-s="256"],
.kit:has(#kv-logo:checked):has(#ks-512:checked)  .kit-dl[data-v="logo"][data-s="512"],
.kit:has(#kv-logo:checked):has(#ks-1024:checked) .kit-dl[data-v="logo"][data-s="1024"],
.kit:has(#kv-mark:checked):has(#ks-128:checked)  .kit-dl[data-v="mark"][data-s="128"],
.kit:has(#kv-mark:checked):has(#ks-256:checked)  .kit-dl[data-v="mark"][data-s="256"],
.kit:has(#kv-mark:checked):has(#ks-512:checked)  .kit-dl[data-v="mark"][data-s="512"],
.kit:has(#kv-mark:checked):has(#ks-1024:checked) .kit-dl[data-v="mark"][data-s="1024"]{
visibility:visible}
.kit:has(#ks-128:checked)  .kit-dl[data-s="128"]  .kit-n i,
.kit:has(#ks-256:checked)  .kit-dl[data-s="256"]  .kit-n i,
.kit:has(#ks-512:checked)  .kit-dl[data-s="512"]  .kit-n i,
.kit:has(#ks-1024:checked) .kit-dl[data-s="1024"] .kit-n i{
transform:rotateX(0deg)}
@media (prefers-reduced-motion:reduce){
.kit-n i{transition:none;transition-delay:0s}
}
.kit-dl{--btn-size:.92rem;--tint-rgb:var(--dl-tint-rgb);--tint-a:var(--dl-tint-a)}
.kit-dl > span{padding-inline:1.35em;padding-block:.75em}
@supports not selector(:has(*)){
.kit-seg::before{display:none}
.kit-dl{display:inline-flex;align-items:center;gap:.5em;margin:0 6px 6px 0}
.kit-shot[data-v="logo"]{opacity:1}
.kit-n i{transform:none}
}
body{min-height:100vh;min-height:100svh;display:flex;flex-direction:column}
main{flex:1 0 auto}
.footer{flex-shrink:0}
.footer-meta{margin-top:7px}
.footer-links{margin-top:16px;display:flex;flex-direction:column;gap:9px}
.footer-row{display:flex;flex-wrap:wrap;gap:6px 10px;
justify-content:center;align-items:baseline}
.footer-links a{position:relative;color:var(--navy-700);text-decoration:none;
padding:5px 2px 6px;transition:color .18s}
.footer-links a::before{content:"";position:absolute;left:2px;right:2px;bottom:3px;height:1.5px;
background:var(--navy-700);border-radius:2px;
clip-path:inset(0 100% 0 0);
transition:clip-path .28s cubic-bezier(.22,1,.3,1)}
.footer-links a:hover{color:var(--ink)}
.footer-links a:hover::before{clip-path:inset(0 0 0 0);background:var(--navy)}
.footer-links a[aria-current="page"]{color:var(--ink);font-weight:600}
.footer-links a[aria-current="page"]::before{background:var(--gold);clip-path:inset(0 0 0 0)}
.page-head{padding-top:clamp(96px,11vw,150px);padding-bottom:clamp(24px,4vw,34px)}
.page-head .stack,
.page-sub .stack{max-width:760px}
.page-title{font-size:clamp(2rem,5vw,2.9rem);line-height:1.12;font-weight:600;letter-spacing:-.028em}
.page-date{margin-top:10px;font-size:.85rem;color:var(--ink-dim)}
.legal{max-width:68ch;margin-top:26px}
.legal p{font-size:.98rem;line-height:1.72;color:var(--ink)}
.legal p+p{margin-top:15px}
.legal p.legal-lead{font-size:1.1rem;font-weight:600;line-height:1.55;
padding-bottom:22px;margin-bottom:4px;border-bottom:1px solid var(--line)}
.legal h2{margin-top:34px;font-size:1.06rem;font-weight:600;letter-spacing:-.012em;color:var(--ink)}
.legal h2+p{margin-top:9px}
.legal a{color:var(--navy-700);text-decoration:underline;text-underline-offset:2px;
text-decoration-thickness:1px;text-decoration-color:rgba(58,59,82,.4)}
.legal a:hover{text-decoration-color:currentColor}
.legal p.legal-address{margin-top:14px;font-size:.92rem;line-height:1.6;
color:var(--navy-700);padding-left:15px;border-left:2px solid var(--line)}
.footer{position:relative;z-index:1;padding:60px 20px 72px;text-align:center;
font-size:.8rem;color:var(--ink-dim);
background:linear-gradient(to bottom, rgba(251,249,244,0) 0%,
var(--paper) 34%, var(--paper) 100%)}
@media (prefers-reduced-motion:reduce){
*{animation:none !important;transition:none !important}
}