html{scroll-behavior:smooth;scroll-padding-top:24px}html.lenis.lenis-smooth{scroll-behavior:auto!important}#main .hero.hero--portrait{padding-top:56px}.relix-loader{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;background:#fbf7f3;pointer-events:none;animation:relix-loader-exit .85s ease both}.relix-loader__logo{position:relative;width:76px;height:76px}.relix-loader__logo>img,.relix-loader__motion{position:absolute;inset:0;width:100%;height:100%}.relix-loader.has-lottie .relix-loader__logo>img{visibility:hidden}.relix-loader__logo:after{content:"";position:absolute;left:18%;right:18%;bottom:-22px;height:2px;background:#ff5b2d;transform-origin:left;animation:relix-loader-line .65s cubic-bezier(.2,.7,.2,1) both}.relix-return-visit .relix-loader{animation-duration:.38s}@keyframes relix-loader-exit{0%,65%{opacity:1;visibility:visible}to{opacity:0;visibility:hidden}}@keyframes relix-loader-line{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.motion-waiting{opacity:0}.motion-waiting:focus-within{opacity:1}#main .portrait-hero__hello{font-size:46px;line-height:1.25}body:has(.hero--portrait){position:relative;isolation:isolate}.hero-page-backdrop{position:absolute;top:0;right:0;z-index:-1;pointer-events:none;background:#edf3f2;display:none}@media(min-width:801px){.hero-backdrop-ready .hero-page-backdrop{display:block}.hero-backdrop-ready .portrait-hero__panel{background:none;box-shadow:none}}.hero-scene{position:relative;isolation:isolate}.hero-scene__canvas{position:relative;aspect-ratio:1}.hero-scene__motion{position:absolute;inset:0;pointer-events:none;opacity:0}.hero-scene__motion>svg{overflow:visible!important}.hero-scene.is-animated .hero-scene__canvas>.hero-scene__fallback{opacity:0}.hero-scene.is-animated .hero-scene__canvas>.hero-scene__motion{opacity:1}.hero-tool{position:absolute;z-index:2;display:block;border:0;background:transparent;border-radius:22px;cursor:pointer;padding:0;color:#241c18;-webkit-tap-highlight-color:transparent}.hero-tool:after{content:"";position:absolute;inset:-5px;border:2px dashed #ff5b2d;border-radius:22px;opacity:0;transition:opacity .2s}.hero-tool:hover:after,.hero-tool:focus-visible:after,.hero-tool[aria-expanded=true]:after{opacity:.75}.hero-tool:focus-visible{outline:2px solid #241c18;outline-offset:8px}.hero-tool--code{left:18%;top:8%;width:21%;height:19%;transform:rotate(-17deg)}.hero-tool--layout{left:49%;top:5%;width:33%;height:26%;transform:rotate(14deg)}.hero-tool--palette{left:78%;top:27%;width:20%;height:17%;transform:rotate(-10deg)}.hero-tool-preview{position:absolute;z-index:4;left:3%;top:28%;width:min(320px,76%);padding:22px;background:#fff;border:1px solid #eadfd6;border-radius:16px;box-shadow:0 16px 48px #241c1820;transform:rotate(-2deg);animation:relix-preview-in .28s cubic-bezier(.2,.8,.2,1) both}.hero-tool-preview[hidden],.hero-tool-preview [hidden]{display:none!important}.hero-tool-preview>button{position:absolute;right:10px;top:10px;width:30px;height:30px;display:grid;place-items:center;background:#fbf7f3;border:1px solid #eadfd6;border-radius:50%;cursor:pointer;color:#241c18}.hero-tool-preview>button svg{width:14px;height:14px}.hero-tool-preview .preview-label{display:block;color:#756960;font:600 10px/1.4 var(--body);letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px;padding-right:18px}.hero-tool-preview strong{display:block;font:600 18px/1.3 var(--display);letter-spacing:-.025em;color:#241c18}#main .hero-tool-preview p{font:400 13px/1.65 var(--body);color:#756960;margin:10px 0 0}.hero-tool-preview pre{font:400 12px/1.85 Consolas,monospace;color:#241c18;white-space:pre-wrap;margin:0;overflow-wrap:anywhere}.hero-tool-preview pre span{color:#ff5b2d}.hero-preview-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:7px;margin-bottom:12px}.hero-preview-layout i{height:34px;border-radius:4px;background:#edf3f2;animation:relix-layout-reveal .5s ease backwards}.hero-preview-layout i:first-child{grid-column:1/-1;height:8px;background:#241c18;animation-delay:.05s}.hero-preview-layout i:nth-child(2){background:#ff5b2d;animation-delay:.13s}.hero-preview-layout i:nth-child(3){animation-delay:.2s}.hero-preview-colors{display:flex;gap:7px;margin-bottom:14px}.hero-preview-colors i{width:38px;height:44px;border-radius:7px;background:var(--swatch);animation:relix-layout-reveal .45s ease backwards;animation-delay:var(--delay)}.hero-motion-toggle{padding:6px;border:1px solid #eadfd6;border-radius:50%;color:#241c18;background:#fff;cursor:pointer}.hero-motion-toggle svg{display:block;width:20px;height:20px}.hero-motion-toggle--quiet{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;bottom:0;left:0}.hero-motion-toggle--quiet:focus-visible{width:40px;height:40px;clip-path:none;overflow:visible}.hero-motion-toggle:focus-visible{outline:2px solid #ff5b2d;outline-offset:4px}@media(max-width:800px){#main .hero.hero--portrait{padding-top:40px}.portrait-hero__visual{display:grid;grid-template-columns:1fr;height:auto;min-height:470px;padding-top:64px;padding-bottom:76px}.portrait-hero__illustration{justify-self:center}}@keyframes relix-preview-in{0%{opacity:0;transform:translateY(10px) rotate(-2deg) scale(.96)}to{opacity:1;transform:translateY(0) rotate(-2deg) scale(1)}}@keyframes relix-layout-reveal{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.site-motion-paused .hero-tool-preview,.site-motion-paused .hero-preview-layout i,.site-motion-paused .hero-preview-colors i{animation:none}@media(max-width:480px){#main .portrait-hero__hello{font-size:40px}#main .hero.hero--portrait{padding-top:32px}.hero-tool-preview{padding:18px;top:27%;left:0;width:76%}.hero-tool-preview pre{font-size:11px}.hero-tool-preview strong{font-size:16px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.relix-loader{animation:relix-loader-exit .12s both!important}.relix-loader__logo:after{animation:none!important}.motion-waiting{opacity:1}.hero-motion-toggle{display:none}.hero-tool-preview,.hero-preview-layout i,.hero-preview-colors i{animation:none}.hero-scene.is-animated .hero-scene__canvas>.hero-scene__fallback{opacity:1}.hero-scene.is-animated .hero-scene__canvas>.hero-scene__motion{opacity:0}}html.lenis,html.lenis body{height:auto}.lenis:not(.lenis-autoToggle).lenis-stopped{overflow:clip}.lenis [data-lenis-prevent],.lenis [data-lenis-prevent-wheel],.lenis [data-lenis-prevent-touch],.lenis [data-lenis-prevent-vertical],.lenis [data-lenis-prevent-horizontal]{overscroll-behavior:contain}.lenis.lenis-smooth iframe{pointer-events:none}.lenis.lenis-autoToggle{transition-property:overflow;transition-duration:1ms;transition-behavior:allow-discrete}
