@import"https://fonts.googleapis.com/css2?family=Karla:wght@550;650;750&display=swap";button:where(.astro-VNZLVQNM){color:var(--color-primary);font-weight:750;border:none;cursor:pointer;background:none;padding:var(--m-1) var(--m-2);text-align:left;font-size:21px;border-radius:var(--radius-medium);transition:all var(--duration-fast) ease-out;margin:0;position:relative;overflow:hidden;backface-visibility:hidden;transform:translateZ(0)}button:where(.astro-VNZLVQNM) label:where(.astro-VNZLVQNM){letter-spacing:-.25px;z-index:3;line-height:var(--font-lineHeight-body);cursor:pointer;position:relative;display:block;transition:all .3s ease-out;pointer-events:none;font-size:var(--font-size-body);font-weight:700}button:where(.astro-VNZLVQNM) svg:where(.astro-VNZLVQNM) path:where(.astro-VNZLVQNM){stroke:#000;stroke-linecap:round;stroke-linejoin:round;stroke-width:3}button:where(.astro-VNZLVQNM):hover bg:where(.astro-VNZLVQNM) svg:where(.astro-VNZLVQNM){transform:scale(1)}button:where(.astro-VNZLVQNM):active label:where(.astro-VNZLVQNM),button:where(.astro-VNZLVQNM):active .arrow:where(.astro-VNZLVQNM){transform:scale(.9);opacity:1}button:where(.astro-VNZLVQNM):active bg:where(.astro-VNZLVQNM) svg:where(.astro-VNZLVQNM){filter:blur(.5rem)}button:where(.astro-VNZLVQNM):active,button:where(.astro-VNZLVQNM):focus{outline:none}bg:where(.astro-VNZLVQNM){position:absolute;top:0;left:0;width:100%;height:100%;display:block;animation:buttonBg 3s linear infinite;pointer-events:none}bg:where(.astro-VNZLVQNM) svg:where(.astro-VNZLVQNM){display:block;width:100%;height:100%;filter:blur(16px);transform:scale(0);transition:opacity .15s ease-out,transform .3s ease-out,filter .3s ease-out;box-shadow:inset 0 0 0 2px #ffffffbf}bg:where(.astro-VNZLVQNM) svg:where(.astro-VNZLVQNM) .red:where(.astro-VNZLVQNM){fill:#ffb3cc}bg:where(.astro-VNZLVQNM) svg:where(.astro-VNZLVQNM) .yellow:where(.astro-VNZLVQNM){fill:#fe9}bg:where(.astro-VNZLVQNM) svg:where(.astro-VNZLVQNM) .blue:where(.astro-VNZLVQNM){fill:#9df}button:where(.astro-VNZLVQNM).primary bg:where(.astro-VNZLVQNM) svg:where(.astro-VNZLVQNM){transform:scale(1)}h3,h4,p{margin-block-start:0px;margin-block-end:0px;margin-inline-start:0px;margin-inline-end:0px;padding-inline-start:0px}ul,li{list-style:none}h1{margin-block-start:0px;margin-block-end:1.5rem;margin-inline-start:0px;margin-inline-end:0px;padding-inline-start:0px}h2{margin-block-start:1.5rem;margin-block-end:0;margin-inline-start:0px;margin-inline-end:0px;padding-inline-start:0px}ul{margin-block-start:1rem;margin-block-end:0px;margin-inline-start:0px;margin-inline-end:0px;padding-inline-start:0px}:root{--gray-10: lch(10 2 220);--gray-20: lch(20 2 220);--gray-30: lch(30 2 220);--gray-40: lch(40 2 220);--gray-50: lch(50 2 220);--gray-60: lch(60 2 220);--gray-70: lch(70 2 220);--gray-80: lch(80 2 220);--gray-90: lch(90 2 220);--gray-92: lch(92 2 220);--gray-94: lch(94 2 220);--gray-96: lch(96 2 220);--gray-98: lch(98 2 220);--blue-10: lch(10 115 250);--blue-20: lch(20 115 250);--blue-30: lch(30 115 250);--blue-40: lch(40 115 250);--blue-50: lch(50 115 250);--blue-60: lch(60 115 250);--blue-70: lch(70 115 250);--blue-80: lch(80 115 250);--blue-90: lch(90 115 250);--blue-92: lch(92 115 250);--blue-94: lch(94 115 250);--blue-96: lch(96 115 250);--blue-98: lch(98 115 250);--red-20: lch(20 115 20);--red-10: lch(10 115 20);--red-30: lch(30 115 20);--red-40: lch(40 115 20);--red-50: lch(50 115 20);--red-60: lch(60 115 20);--red-70: lch(70 115 20);--red-80: lch(80 115 20);--red-90: lch(90 115 20);--red-92: lch(92 115 20);--red-94: lch(94 115 20);--red-96: lch(96 115 20);--red-98: lch(98 115 20);--color-primary: var(--gray-30);--color-secondary: var(--gray-50);--color-tiedye-red: hsl(340, 100%, 85%);--color-tiedye-blue: hsl(200, 100%, 80%);--color-tiedye-yellow: hsl(50, 100%, 80%);--radius-small: .5rem;--radius-medium: 1rem;--radius-large: 1.5rem;--radius-xlarge: 2rem;--radius-round: 999999999px;--border-width-thin: .16rem;--border-width-medium: .1rem;--border-width-thick: .1875rem;--duration-xslow: .8s;--duration-slow: .6s;--duration-med: .3s;--duration-fast: .15s;--duration-xfast: .1s;--font-family: "Karla", sans-serif;--font-size-h1: 5rem;--font-size-h2: 2rem;--font-size-h3: 1.75rem;--font-size-body: 1.375rem;--font-size-small: 1.25rem;--font-lineHeight-h1: 5rem;--font-lineHeight-h2: 2rem;--font-lineHeight-h3: 1.75rem;--font-size-h4: 1.5rem;--font-lineHeight-body: 2rem;--font-letterSpacing-h1: -4px;--font-letterSpacing-h2: auto;--font-letterSpacing-body: auto;--grid-unit: .5rem;--m-h: calc(var(--grid-unit) / 2);--m-1: var(--grid-unit);--m-1h5: calc(var(--grid-unit) / 1.5);--m-2: calc(var(--grid-unit) * 2);--m-3: calc(var(--grid-unit) * 3);--m-4: calc(var(--grid-unit) * 4);--m-5: calc(var(--grid-unit) * 5);--m-6: calc(var(--grid-unit) * 6);--m-7: calc(var(--grid-unit) * 7);--m-8: calc(var(--grid-unit) * 8)}*,html{box-sizing:border-box!important;font:550 16px var(--font-family);-webkit-tap-highlight-color:transparent}:root{--nav-width: 200px}body.grid{background-size:8px 8px;background-position:0 0;background-image:url(src/assets/8ptGrid.svg);background-color:#fff}body.grid article{box-shadow:inset 0 0 0 1px red}body.grid section{box-shadow:0 0 0 1px #00f}body.grid:after{content:"";display:block;background:red;position:absolute;top:0;left:0;height:8px;width:8px}body{background:white;color:var(--color-primary);overflow-y:overlay;overflow-x:hidden;margin:0;padding:0}body.loading{overflow:hidden!important}body.loading site article{opacity:0;transform:translateY(4rem);filter:blur(.5rem) hue-rotate(360deg)}body.loading site nav li.active button label{filter:hue-rotate(360deg)}body.loading site nav{pointer-events:none}body.loading loader{opacity:1;transform:translate(-50%,-50%) scale(1)}site{display:grid;grid-template-columns:var(--nav-width) 1fr;grid-template-rows:auto;transition:transform var(--duration-med) ease-out;justify-content:start;align-content:space-evenly}nav{z-index:99;padding:var(--m-4) 0 var(--m-4) var(--m-2);position:relative}nav li{list-style:none}nav a button{margin-left:0}nav a button label:before{content:"";position:absolute;width:100%;bottom:3px;height:3px;left:0;border-radius:var(--radius-small);background-color:var(--gray-70);visibility:hidden;transform:scaleX(0);transition:all .3s ease-in-out 0s;transform-origin:left center;z-index:-1}nav a.active button{pointer-events:none}nav a.active button label:before{visibility:visible;transform:scaleX(1)}article{display:block;position:relative;transition:all var(--duration-slow) ease-out;font-size:var(--font-size-body);align-content:start;padding:var(--m-6) var(--m-4)}hamburger{display:none;z-index:999;position:absolute;width:3rem;height:3rem;right:-3.75rem;top:0;cursor:pointer;padding:.5rem}hamburger path{stroke-width:.25rem;stroke-linecap:butt;stroke-miterlimit:0;transform-origin:center center}hamburger .close path{transition:transform var(--duration-fast) ease-out 0ms,stroke 0ms calc(var(--duration-fast) * 1.5)}hamburger .hamburger path{stroke:var(--color-primary);transition:transform calc(var(--duration-fast) * 1.75) ease-in calc(var(--duration-fast) * 1.5),stroke 0ms calc(var(--duration-fast) * 1.5)}.menu-open .hamburger path{stroke:transparent;transition:transform var(--duration-med)/2 ease-out 0ms,stroke 0ms var(--duration-med)}.menu-open .hamburger path:first-of-type{transform:translateY(.5rem)}.menu-open .hamburger path:last-of-type{transform:translateY(-.5rem)}.menu-open .close path{stroke:var(--color-primary);transition:transform var(--duration-fast) ease-out calc(var(--duration-fast) * 1.5),stroke 0ms 0ms}.menu-open .close path:first-of-type{transform:rotate(-45deg)}.menu-open .close path:last-of-type{transform:rotate(45deg)}.menu-open site{transform:translate(0)}hamburger{display:none}logo{height:6rem;display:inline-block;margin-bottom:var(--m-4);position:relative;cursor:pointer;margin-left:var(--m-2)}logo .logo{position:relative;z-index:9;height:100%}logo:hover bg svg{transform:scale(1)}body,p,a,words{font-size:var(--font-size-body);line-height:var(--font-lineHeight-body);letter-spacing:var(--font-letterSpacing-body)}strong{font-size:var(--font-size-body);font-weight:700}code{font-weight:light;font-size:var(--font-size-body);background:var(--gray-96);padding-left:.25rem;padding-right:.25rem;color:var(--gray-50)}h1{font-size:var(--font-size-h1);line-height:var(--font-lineHeight-h1);letter-spacing:var(--font-letterSpacing-h1);font-weight:700;translate:-4px;font-size-adjust:115.4%}h2{font-size:var(--font-size-h2);line-height:var(--font-lineHeight-h2);letter-spacing:var(--font-letterSpacing-h2);font-weight:700;margin-block-start:var(--m-4)}h3{font-size:var(--font-size-h3);line-height:var(--font-lineHeight-h3);letter-spacing:var(--font-letterSpacing-h2);font-weight:700}h4{font-size:var(--font-size-h4);line-height:var(--font-lineHeight-h4);letter-spacing:var(--font-letterSpacing-h2);font-weight:700}subtitle{display:block;font-size:var(--font-size-h4);line-height:var(--font-lineHeight-h4);letter-spacing:var(--font-letterSpacing-body);font-weight:700}a{color:#2066df}bg{position:absolute}@keyframes loadingAnim{0%{stroke-dashoffset:0}to{stroke-dashoffset:-303}}button{color:var(--color-primary);font-weight:750;border:none;cursor:pointer;background:none;padding:var(--m-1) var(--m-2);text-align:left;font-size:21px;border-radius:var(--radius-medium);transition:all var(--duration-fast) ease-out;margin:0;position:relative;overflow:hidden;backface-visibility:hidden;transform:translateZ(0)}button label{letter-spacing:-.25px;z-index:3;line-height:var(--font-lineHeight-body);cursor:pointer;position:relative;display:block;transition:all .3s ease-out;pointer-events:none;font-size:var(--font-size-body);font-weight:700}button svg path{stroke:#000;stroke-linecap:round;stroke-linejoin:round;stroke-width:3}button:hover bg svg{transform:scale(1)}button:active label,button:active .arrow{transform:scale(.9);opacity:1}button:active bg svg{filter:blur(.5rem)}button:active,button:focus{outline:none}@keyframes buttonBg{0%{transform:rotate(0)}to{transform:rotate(360deg)}}bg{position:absolute;top:0;left:0;width:100%;height:100%;display:block;animation:buttonBg 3s linear infinite;pointer-events:none}bg svg{display:block;width:100%;height:100%;filter:blur(16px);transform:scale(0);transition:opacity .15s ease-out,transform .3s ease-out,filter .3s ease-out;box-shadow:inset 0 0 0 2px #ffffffbf}bg svg .red{fill:#ffb3cc}bg svg .yellow{fill:#fe9}bg svg .blue{fill:#9df}button.primary bg svg{transform:scale(1)}:root{--slide-size-min: 320px;--slide-size-max: 820px;--slide-grid-gap: 2rem}controls>button:last-child svg.arrow{transform:rotate(180deg)}carousel{aspect-ratio:1/1;position:relative;display:block;border-radius:var(--radius-large);overflow:hidden}carousel slides{display:grid;grid-template-columns:100%;grid-template-rows:100%;grid-auto-columns:100%;transition:transform var(--duration-med) ease-out;grid-auto-flow:column}carousel slide{display:block;height:var(--sizeSize);aspect-ratio:1/1;overflow:hidden;background:var(--gray-96);object-fit:cover}carousel slide img,carousel slide codepen,carousel slide .cp_embed_wrapper{display:block;object-fit:cover;width:100%;height:100%;border-radius:0;align-self:center;justify-self:center}carousel slide img iframe,carousel slide codepen iframe,carousel slide .cp_embed_wrapper iframe{width:100%;height:100%}controls{display:grid;padding:var(--m-2) 0;grid-template-columns:auto 1fr auto;justify-content:space-between;align-items:center}controls button{width:48px;height:48px;margin:0}controls button svg.arrow{position:absolute;left:0;top:8px;z-index:2;margin:auto;right:0;transition:all .3s ease-out}controls button svg.arrow path{transition:all .15s ease-out}controls button svg.arrow path.stem{transform-origin:center left}controls button bg svg{filter:blur(8px)}controls button:hover svg .stem{transform:scaleX(1.5) translate(-5px)}controls button:hover svg .cap{transform:translate(-6px)}stepper{display:grid;grid-template-columns:1rem;grid-column-gap:.5rem;grid-auto-flow:column;grid-template-rows:1rem;justify-content:center}stepper step{display:inline-block;width:1rem;height:1rem;border:4px solid var(--color-secondary);border-radius:var(--radius-round);transition:all var(--duration-xfast) ease-in}stepper step.active{background:var(--color-secondary)}stepper step.forward{animation:step-forward var(--duration-med) ease-out}stepper step.backward{animation:step-backward var(--duration-med) ease-out}@keyframes step-forward{0%{transform:translate(0)}50%{transform:translate(.25rem)}to{transform:translate(0)}}@keyframes step-backward{0%{transform:translate(0)}50%{transform:translate(-.25rem)}to{transform:translate(0)}}words{display:block}words button{margin-top:var(--m-2);translate:-1rem 0}words h3{margin-top:var(--m-4)}words p{margin-top:var(--m-4)}words p:first-of-type{margin-top:var(--m-1)}words ul{display:block;margin-top:var(--m-2)}words ul li{font-size:var(--font-size-body);margin-bottom:var(--m-2)}media>img{display:block;width:100%;border-radius:var(--radius-large)}br{display:block;height:var(--m-6)}p{display:block;margin-bottom:var(--m-1)}.animLogo .animLogo-k{animation:rotate3D 6s linear infinite;transform-origin:center;transition:all .4s}.animLogo .animLogo-outline{stroke-dasharray:100 100;stroke-dashoffset:100;animation:dashoutline 6s linear infinite}.animLogo{pointer-events:none}@keyframes rotate3D{0%{transform:rotate3d(0,0,0,360deg)}25%{transform:rotateY(360deg)}50%{transform:rotateY(360deg)}75%{transform:rotate3d(0,0,0,360deg)}to{transform:rotate3d(0,0,0,360deg)}}@keyframes dashoutline{0%{stroke-dashoffset:-100;stroke:#000}25%{stroke-dashoffset:0;stroke:#000}50%{stroke-dashoffset:0;stroke:#000}75%{stroke-dashoffset:100;stroke:#000}to{stroke-dashoffset:100;stroke:#000}}section media{opacity:0;animation:stagger .3s ease-out forwards .3s}@keyframes stagger{0%{transform:translateY(5rem);opacity:0}50%{opacity:1}to{transform:translateY(0);opacity:1}}@media (width <= 1200px){section{grid-template-columns:minmax(40%,320px) 1fr!important}h1{font-size:4rem}hamburger{display:block}site{transform:translate(calc(-1 * var(--nav-width)));grid-template-columns:var(--nav-width) 100vw!important}article{padding-top:var(--m-8)}}@media (width <= 900px){section{grid-template-columns:1fr!important}section media{grid-row:1;padding-top:0!important}section words button{translate:0 0}}@media (width <= 464px){h1{translate:0}article{padding:var(--m-8) var(--m-2)}}
