@import "https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap";.cta-button{--cta-duration:.35s;--cta-ease:ease;margin-top:var(--space-1_5);margin-bottom:var(--space-1_5);padding:calc(var(--space-1_5) / 2 - 1px) var(--space-1_5);line-height:var(--space-1_5);color:var(--color-foreground);font-weight:var(--font-weight-bold);border:1px solid var(--color-foreground);transition:color var(--cta-duration) var(--cta-ease), background-color var(--cta-duration) var(--cta-ease), transform var(--cta-duration) var(--cta-ease);background-color:#0000;border-radius:99rem;text-decoration:none;display:inline-block;&:hover,&:focus-visible{color:var(--color-background);background-color:var(--color-foreground);transform:translateY(0)scale(1.1)}&:active{transform:translateY(0)scale(.97)}&:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px}@media (prefers-reduced-motion:reduce){transition:none;&:hover,&:focus-visible,&:active{transform:none}}}.magnetic-lines[data-astro-cid-akf7psqq]{pointer-events:none;width:100%;height:100%;color:var(--color-accent);position:absolute;inset:0}:root{--color-foreground:#0c171d;--color-background:#f7fbfc;--color-accent:#24536b;--color-text-muted:#435660;--color-line:#435660;--font-body:"Fira Sans", system-ui, -apple-system, "Segoe UI", sans-serif;--font-weight-normal:400;--font-weight-bold:700;--text-size-small:.875rem;--text-size-0:1rem;--text-size-1:1.125rem;--text-size-3:1.5rem;--text-size-4:2.25rem;--text-size-5:3rem;--space-0_5:.5rem;--space-1:1rem;--space-1_5:1.5rem;--space-2:2rem;--space-3:3rem;--text-width:35rem;--wide-width:60rem;--gutter:var(--space-1_5);--color-border:1px solid var(--color-line);--glow-a:color-mix(in srgb, var(--color-accent) 50%, transparent);--glow-b:color-mix(in srgb, var(--color-foreground) 50%, transparent)}*,:before,:after{box-sizing:border-box}html{font-size:100%}body{min-height:100vh;font:var(--text-size-0) / var(--space-1_5) var(--font-body);color:var(--color-foreground);background:var(--color-background);flex-direction:column;margin:0;display:flex}main{flex:1}a{color:inherit}h1,h2,h3,p,ul,ol,pre,blockquote,figure{margin:0 0 var(--space-1_5)}h1,h2,h3{font-weight:var(--font-weight-bold)}h1{font-size:var(--text-size-5);line-height:var(--space-3)}h2{font-size:var(--text-size-4);line-height:var(--space-1_5)}h3{font-size:var(--text-size-1);line-height:var(--space-1_5)}h2{margin-top:var(--space-3)}*+h3{margin-top:var(--space-1_5)}img{max-width:100%;height:auto;display:block}.landing-header-block{margin-top:9rem;margin-bottom:6rem}.wrap{max-width:calc(var(--text-width) + 2 * var(--gutter));padding:var(--space-3) var(--gutter);margin:0 auto}.wide,.prose img{--wide:min(var(--wide-width), 100vw - 2 * var(--gutter));width:var(--wide);max-width:none;margin-left:calc(50% - var(--wide) / 2)}figcaption{margin-top:var(--space-0_5);font-size:var(--text-size-small);line-height:var(--space-1);color:var(--color-text-muted)}.case-nav{z-index:10;background:color-mix(in srgb, var(--color-background) 82%, transparent);border-bottom:var(--color-border);font-size:var(--text-size-small);color:var(--color-text-muted);font-family:monospace;font-weight:var(--font-weight-bold);transition:box-shadow .2s;position:sticky;top:0;&--stuck{box-shadow:0 1px 4px color-mix(in srgb, var(--color-foreground) 12%, transparent)}& a{text-decoration:none;&:hover,&:focus-visible{text-underline-offset:.25em;text-decoration:underline}}& .case-nav__links a+a{margin-left:var(--space-1)}& .wrap{justify-content:space-between;align-items:center;gap:var(--space-1_5);padding-block:calc(var(--space-1_5) / 2) calc(var(--space-1_5) / 2 - 1px);display:flex}}.site-footer{border-top:var(--color-border);color:var(--color-text-muted);font-size:var(--text-size-small);position:relative;& .wrap{padding:var(--space-2);position:relative}}.project-list{& h3,& p{margin:0}& .project-list-link{margin-inline:calc(-1 * var(--space-1));padding:var(--space-0_5) var(--space-3) var(--space-0_5) var(--space-1);border-top:1px solid var(--color-line);text-decoration:none;display:block;position:relative;&:last-child{border-bottom:1px solid var(--color-line)}&:hover,&:focus-visible{background:color-mix(in srgb, var(--color-accent) 10%, transparent);& .project-list-play{stroke:var(--color-line);animation:.8s ease-in-out infinite alternate play-pulse}}}& .project-list-play{top:50%;right:var(--space-1);width:var(--space-1_5);height:var(--space-1_5);fill:#0000;stroke:#0000;stroke-width:1px;position:absolute;transform:translateY(-50%)}}@keyframes play-pulse{0%{scale:1}to{scale:1.1}}dl{font-size:var(--font-size-small);line-height:var(--space-1);border-top:1px solid var(--color-line);border-bottom:1px solid var(--color-line);flex-wrap:wrap;display:flex;& dt,& dd{padding-top:var(--space-0_5);padding-bottom:var(--space-0_5);box-sizing:border-box;margin:0;& span{color:var(--color-text-muted)}}& dt{padding-right:var(--space-0_5);text-align:right;width:40%;&:first-of-type{padding-top:var(--space-0_5)}}& dd{padding-left:var(--space-0_5);width:60%;font-weight:var(--font-weight-bold);&:last-of-type{padding-bottom:var(--space-0_5)}}}.text-muted{color:var(--color-text-muted)}.text-center{text-align:center}.text-style-italic{font-style:italic}body{&:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(40% 80% at 20% 30%, var(--glow-a), transparent 70%), radial-gradient(35% 65% at 80% 20%, var(--glow-b), transparent 70%), radial-gradient(45% 90% at 60% 85%, var(--glow-a), transparent 70%);-webkit-mask-composite:source-in;--drift-duration:16s;--ease-sine:cubic-bezier(.37, 0, .63, 1);--phase:calc(var(--clock,0s) * -1);animation:bg-drift-x calc(var(--drift-duration) / 2) var(--ease-sine) calc(var(--drift-duration) / -4 + var(--phase)) infinite alternate, bg-drift-y calc(var(--drift-duration) / 4) var(--ease-sine) calc(var(--drift-duration) / -8 + var(--phase)) infinite alternate, bg-sway 160s ease-in-out var(--phase) infinite alternate, bg-breathe 8s ease-in-out var(--phase) infinite alternate;will-change:transform, translate, rotate, scale;position:fixed;inset:-42%;mask-image:linear-gradient(90deg,#0000,#000 20% 80%,#0000),linear-gradient(#0000,#000 20% 80%,#0000);mask-composite:intersect}@media (prefers-reduced-motion:reduce){&:before{animation:none}}@media print{&:before{display:none}}}@keyframes bg-drift-x{0%{translate:-16%}to{translate:8%}}@keyframes bg-drift-y{0%{transform:translateY(-4%)}to{transform:translateY(4%)}}@keyframes bg-sway{0%{rotate:-24deg}to{rotate:12deg}}@keyframes bg-breathe{0%{scale:1}to{scale:1.4}}
