1<!doctype html> 2<html lang="en" class="dark"> 3 <head> 4 <meta charset="utf-8" /> 5 <!-- Own-traffic exclusion â runs BEFORE GTM so internal visits never load it at all. 6 An IP filter in GA4 can't do this job alone: a home IP is dynamic, and it would 7 still miss local dev and preview deploys. Three rules, any one is enough: 8 1. non-production hosts (localhost, LAN, *.vercel.app preview URLs) 9 2. dev-only routes that no visitor reaches (/lab, /ss, /preview, â¦) 10 3. a sticky per-browser opt-out: visit /?noga=1 once on each device you browse 11 production from. /?noga=0 undoes it. Survives reloads via localStorage. 12 Measurement id is inlined because this must run before gtag exists. --> 13
13<script> 14 (function () { 15 var INTERNAL_PATH = /^\/(lab|ss|preview|codex|variants|stack|tmc-cover|contact-lab|work-stack|ink-ref)(\/|$)/; 16 var host = false, sticky = false; 17 var h = location.hostname; 18 if (h === 'localhost' || h === '127.0.0.1' || h === '[::1]' || 19 /\.local$/.test(h) || /^192\.168\./.test(h) || /\.vercel\.app$/.test(h)) host = true; 20 try { 21 var q = new URLSearchParams(location.search); 22 if (q.get('noga') === '1') localStorage.setItem('ssicevs-noga', '1'); 23 if (q.get('noga') === '0') localStorage.removeItem('ssicevs-noga'); 24 if (localStorage.getItem('ssicevs-noga') === '1') sticky = true; 25 } catch (e) {} 26 27 // This is an SPA. Evaluating the path once at load meant landing on "/" and 28 // then navigating to /lab left GTM running: 998 /lab/review pageviews reached 29 // GA4 and dominated every engagement figure. gtag honours ga-disable at call 30 // time, so re-evaluate on every route change instead. 31 function evaluate() { 32 var internal = host || sticky || INTERNAL_PATH.test(location.pathname); 33 window['ga-disable-G-LWK55DKFSW'] = internal; 34 window['ga-disable-G-04JC61150N'] = internal; 35 window.__ssicevsInternalTraffic = internal; 36 } 37 evaluate(); 38 39 ['pushState', 'replaceState'].forEach(function (m) { 40 var orig = history[m]; 41 history[m] = function () { 42 var r = orig.apply(this, arguments); 43 evaluate(); 44 return r; 45 }; 46 }); 47 window.addEventListener('popstate', evaluate); 48 })(); 49 </script>
49 50 <!-- Google Tag Manager â DEFERRED, not loaded in head. 51 GTM + GA4 is ~301KB of script, more than the largest app chunk, and loading it 52 here put it ahead of the page on the network and the main thread (mobile TBT 53 ~343ms). Nothing about it needs to run before paint. 54 It now loads at whichever comes first: the user's first interaction (a tap, key, 55 wheel or scroll), or browser idle 10s after `load` â so a visitor who clicks a CTA 56 immediately is still tracked. Loading right after `load` (the old rule) still 57 landed its 214ms task inside PageSpeed's mobile trace (2026-09-17); a visitor who 58 reads without touching the page for 10s is the only one who waits. 59 dataLayer is created up front, so trackEvent() pushes that happen before GTM 60 arrives sit in the queue and GTM replays them when it boots. No events lost. --> 61
61<script> 62 (function () { 63 if (window.__ssicevsInternalTraffic) return; 64 window.dataLayer = window.dataLayer || []; 65 // ssych.com (the library) reports to its own GA4 property, G-04JC61150N, through 66 // gtag.js. The GTM container only knows the portfolio property, so the library's 67 // numbers used to land in the portfolio's reports. js + config are queued now so 68 // trackEvent() calls made before the script arrives are replayed in order. 69 var library = /(^|\.)ssych\.com$/.test(location.hostname); 70 if (library) { 71 window.gtag = function () { window.dataLayer.push(arguments); }; 72 window.__ssicevsGaDirect = true; 73 window.gtag('js', new Date()); 74 window.gtag('config', 'G-04JC61150N'); 75 } 76 var loaded = false; 77 function loadGtm() { 78 if (loaded) return; 79 loaded = true; 80 if (!library) window.dataLayer.push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' }); 81 var f = document.getElementsByTagName('script')[0]; 82 var j = document.createElement('script'); 83 j.async = true; 84 j.src = library 85 ? 'https://www.googletagmanager.com/gtag/js?id=G-04JC61150N' 86 : 'https://www.googletagmanager.com/gtm.js?id=GTM-5QKTH5QZ'; 87 f.parentNode.insertBefore(j, f); 88 } 89 function whenIdle() { 90 setTimeout(function () { 91 if (window.requestIdleCallback) requestIdleCallback(loadGtm, { timeout: 4000 }); 92 else loadGtm(); 93 }, 10000); 94 } 95 if (document.readyState === 'complete') whenIdle(); 96 else window.addEventListener('load', whenIdle, { once: true }); 97 // Whichever happens first wins the race. 98 ['pointerdown', 'keydown', 'touchstart', 'wheel', 'scroll'].forEach(function (t) { 99 window.addEventListener(t, loadGtm, { once: true, passive: true }); 100 }); 101 })(); 102 </script>
102 103 <!-- End Google Tag Manager --> 104 <link rel="icon" type="image/svg+xml" href="/favicon.svg?v=8" /> 105 <link rel="icon" type="image/png" href="/favicon.png?v=8" /> 106 <link rel="apple-touch-icon" href="/apple-touch-icon.png?v=8" /> 107 <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 108 <!-- the browser bar takes the colour of the page ground, which differs per theme; 109 src/lib/theme.tsx rewrites these when the toggle changes the theme by class --> 110 <meta name="theme-color" media="(prefers-color-scheme: dark)" content="#000000" /> 111 <meta name="theme-color" media="(prefers-color-scheme: light)" content="#ffffff" /> 112 <!-- Bing Webmaster Tools ownership for the www property (the apex is not the 113 canonical host). Covers Bing and Copilot. ChatGPT search is NOT downstream 114 of this â OpenAI builds its own index via OAI-SearchBot. --> 115 <meta name="msvalidate.01" content="07587936CE08650D05301CE0312298B3" /> 116 <!-- Apply the theme before first paint so a light page never flashes dark. The stored 117 choice wins (light, dark or system); with none, the library follows the system and 118 the portfolio stays dark (src/lib/theme.tsx; the segment list is LIBRARY_SEGMENTS 119 in src/lib/site-hosts.ts). --> 120
120<script> 121 (function () { 122 try { 123 var pref = localStorage.getItem('ssicevs-theme'); 124 if (pref !== 'light' && pref !== 'dark' && pref !== 'system') { 125 var seg = location.pathname.split('/')[1] || ''; 126 var lib = location.hostname.replace(/^www\./, '') === 'ssych.com' || 127 ['library', 'effects', 'preview', 'checkout', 'account', 'affiliates', 'admin', 'sso-callback'].indexOf(seg) >= 0; 128 pref = lib ? 'system' : 'dark'; 129 } 130 var light = pref === 'light' || (pref === 'system' && window.matchMedia && matchMedia('(prefers-color-scheme: light)').matches); 131 if (light) { 132 var el = document.documentElement; 133 el.classList.remove('dark'); 134 el.classList.add('light'); 135 el.style.colorScheme = 'light'; 136 // the body's pre-CSS fallback is black; give a light reload its white ground at once 137 el.style.setProperty('--background', '#ffffff'); 138 } 139 } catch (e) {} 140 })(); 141 </script>
141 142 <!-- Self-hosted Sora (variable 400â700) â @font-face lives in the bundled CSS. Preload 143 the basic-latin file (crossorigin, to match the CORS font fetch) so the hero heading 144 paints in Sora at first paint: no Google round-trip, no fallbackâswap LCP reflow. --> 145 <link rel="preload" as="font" type="font/woff2" href="/fonts/sora-latin.woff2" crossorigin /> 146 <!-- LCP fast-path: the home page's first hero card (Taomarketcap cover) is the LCP 147 element, but as a CSR app that image isn't discovered until React boots. Preload it 148 so it downloads in parallel with the JS. srcset/sizes/?v mirror the ComposedCover 149 built in src/components/work/covers.tsx â keep them in sync (COVER_V). --> 150 <link rel="preload" as="image" fetchpriority="high" href="/projects/taomarketcap-thumbnail.webp?v=25" 151 imagesrcset="/projects/taomarketcap-thumbnail-640.webp?v=25 640w, /projects/taomarketcap-thumbnail-960.webp?v=25 960w, /projects/taomarketcap-thumbnail.webp?v=25 1280w" 152 imagesizes="(min-width: 1024px) 640px, 70vw" /> 153 <title>Pricing · Fixed Prices, No Hourly Billing · Savva Sicevs</title> 154 <meta name="description" content="Fixed prices, no hourly billing. A product review from $1,000, a design project from $3,000, or ongoing support from $5,000 a month. Starts with a free 15-minute call." /> 155 <!-- Defaults for the homepage / client-nav. prerender.ts find-and-replaces og:title/description/url/image 156 and twitter:* per route at build; SEOMeta sets them at runtime for client navigation. --> 157 <meta property="og:title" content="Pricing · Fixed Prices, No Hourly Billing · Savva Sicevs" /> 158 <meta property="og:description" content="Fixed prices, no hourly billing. A product review from $1,000, a design project from $3,000, or ongoing support from $5,000 a month. Starts with a free 15-minute call." /> 159 <meta property="og:type" content="website" /> 160 <meta property="og:url" content="https://ssicevs.com/pricing" /> 161 <meta property="og:image" content="https://ssicevs.com/og.png?v=3" /> 162 <meta property="og:image:width" content="1200" /> 163 <meta property="og:image:height" content="630" /> 164 <meta property="og:image:alt" content="Savva Sicevs · Complex software, made readable" /> 165 <meta name="twitter:card" content="summary_large_image" /> 166 <meta name="twitter:title" content="Pricing · Fixed Prices, No Hourly Billing · Savva Sicevs" /> 167 <meta name="twitter:description" content="Fixed prices, no hourly billing. A product review from $1,000, a design project from $3,000, or ongoing support from $5,000 a month. Starts with a free 15-minute call." /> 168 <meta name="twitter:image" content="https://ssicevs.com/og.png?v=3" /> 169 <link rel="me" href="https://www.linkedin.com/in/savvasicevsdesign/" /> 170
170<script type="application/ld+json"> 171 { 172 "@context": "https://schema.org", 173 "@graph": [ 174 { 175 "@type": "Organization", 176 "@id": "https://ssych.com/#organization", 177 "name": "ssych", 178 "legalName": "Wiserframe O\u00dc", 179 "description": "ssych is the trading name of Wiserframe O\u00dc, an Estonian company designing and building interfaces for AI-heavy and high-stakes products.", 180 "url": "https://ssych.com/", 181 "email": "[email protected]", 182 "logo": "https://ssych.com/touch-icon-library.png", 183 "identifier": { 184 "@type": "PropertyValue", 185 "name": "Estonian registry code", 186 "value": "17497246" 187 }, 188 "foundingDate": "2026-05-04", 189 "address": { 190 "@type": "PostalAddress", 191 "streetAddress": "Narva mnt 5", 192 "addressLocality": "Tallinn", 193 "postalCode": "10117", 194 "addressRegion": "Harju maakond", 195 "addressCountry": "EE" 196 }, 197 "founder": { "@id": "https://ssicevs.com/#person" }, 198 "sameAs": [ 199 "https://www.linkedin.com/in/savvasicevsdesign/", 200 "https://x.com/savvasicevs" 201 ] 202 }, 203 { 204 "@type": "Person", 205 "@id": "https://ssicevs.com/#person", 206 "name": "Savva Sicevs", 207 "alternateName": "ssych", 208 "url": "https://ssicevs.com/", 209 "email": "[email protected]", 210 "jobTitle": "Lead Product Designer", 211 "worksFor": { "@id": "https://ssych.com/#organization" }, 212 "description": "Lead Product Designer for AI-heavy products: agent control surfaces, human-in-the-loop workflows, and dense dashboards operators can read and act on.", 213 "knowsAbout": [ 214 "AI agent interfaces", 215 "Human-in-the-loop workflows", 216 "Dashboard UX", 217 "Design systems", 218 "Information architecture", 219 "Front-end engineering (React, TypeScript)" 220 ], 221 "sameAs": [ 222 "https://github.com/savvasicevs", 223 "https://www.linkedin.com/in/savvasicevsdesign/", 224 "https://x.com/savvasicevs" 225 ] 226 }, 227 { 228 "@type": "Service", 229 "@id": "https://ssicevs.com/#service", 230 "name": "Design for AI agent consoles & data-dense dashboards", 231 "serviceType": "Product design for AI-heavy and high-stakes decision surfaces", 232 "url": "https://ssicevs.com/services", 233 "image": "https://ssicevs.com/og.png?v=3", 234 "description": "Design and front-end for AI-heavy products â agent consoles, human-in-the-loop workflows, and dense, readable dashboards operators can trust and act on.", 235 "provider": { "@id": "https://ssicevs.com/#person" }, 236 "areaServed": "Worldwide", 237 "availableLanguage": "en", 238 "hasOfferCatalog": { 239 "@type": "OfferCatalog", 240 "name": "Design services", 241 "itemListElement": [ 242 { "@type": "Offer", "itemOffered": { "@type": "Service", "name": "Product and readability audit", "url": "https://ssicevs.com/services/readability-audit" } }, 243 { "@type": "Offer", "itemOffered": { "@type": "Service", "name": "Product direction and design sprints", "url": "https://ssicevs.com/services/design-sprint" } }, 244 { "@type": "Offer", "itemOffered": { "@type": "Service", "name": "Dashboards and complex product interfaces", "url": "https://ssicevs.com/services/dashboard-design" } }, 245 { "@type": "Offer", "itemOffered": { "@type": "Service", "name": "Interactive prototyping", "url": "https://ssicevs.com/services/prototyping" } }, 246 { "@type": "Offer", "itemOffered": { "@type": "Service", "name": "UI systems and design systems", "url": "https://ssicevs.com/services/ui-design-system" } }, 247 { "@type": "Offer", "itemOffered": { "@type": "Service", "name": "Developer handoff and design QA", "url": "https://ssicevs.com/services/dev-support-qa" } } 248 ] 249 } 250 }, 251 { 252 "@type": "WebSite", 253 "@id": "https://ssicevs.com/#website", 254 "url": "https://ssicevs.com/", 255 "name": "Savva Sicevs", 256 "publisher": { "@id": "https://ssicevs.com/#person" }, 257 "inLanguage": "en" 258 } 259 ] 260 } 261 </script>
261 262
262<script type="module" fetchpriority="low" crossorigin src="/assets/index-D1yBc__G.js"></script>
262 263 <style data-critical>/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */ 264@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial;--ai-angle:0deg}}}@layer theme{:root,:host{--font-sans:"Sora", sans-serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-md:28rem;--container-xl:36rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--text-5xl:3rem;--text-5xl--line-height:1;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-wide:.025em;--leading-snug:1.375;--leading-relaxed:1.625;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--ease-out:cubic-bezier(0, 0, .2, 1);--blur-md:12px;--blur-xl:24px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-muted:var(--foreground)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-muted:color-mix(in srgb, var(--foreground) 60%, transparent)}}:root,:host{--color-accent-300:#8cc4ff;--font-display:"Sora", sans-serif}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}
264::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}:focus-visible{outline:1px solid var(--foreground)}@supports (color:color-mix(in lab, red, red)){:focus-visible{outline:1px solid color-mix(in srgb, var(--foreground) 40%, transparent)}}:focus-visible{outline-offset:0}}@layer components;@layer utilities{.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:calc(var(--spacing) * 0)}.inset-x-0{inset-inline:calc(var(--spacing) * 0)}.top-0{top:calc(var(--spacing) * 0)}.top-1\/2{top:50%}.top-8{top:calc(var(--spacing) * 8)}.top-\[72\%\]{top:72%}.-right-\[5px\]{right:-5px}.-right-\[6px\]{right:-6px}.bottom-0{bottom:calc(var(--spacing) * 0)}.bottom-4{bottom:calc(var(--spacing) * 4)}.-left-\[5px\]{left:-5px}.left-0{left:calc(var(--spacing) * 0)}.left-1\/2{left:50%}.-z-10{z-index:calc(10 * -1)}.z-10{z-index:10}.z-30{z-index:30}.z-50{z-index:50}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.mx-2{margin-inline:calc(var(--spacing) * 2)}.mx-auto{margin-inline:auto}.-my-3\.5{margin-block:calc(var(--spacing) * -3.5)}.mt-1\.5{margin-top:calc(var(--spacing) * 1.5)}.mt-5{margin-top:calc(var(--spacing) * 5)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-10{margin-top:calc(var(--spacing) * 10)}.mt-16{margin-top:calc(var(--spacing) * 16)}.mt-40{margin-top:calc(var(--spacing) * 40)}.mr-5{margin-right:calc(var(--spacing) * 5)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.aspect-\[16\/10\]{aspect-ratio:16/10}.size-10{width:calc(var(--spacing) * 10);height:calc(var(--spacing) * 10)}.size-\[18px\]{width:18px;height:18px}.h-3\.5{height:calc(var(--spacing) * 3.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-7{height:calc(var(--spacing) * 7)}.h-9{height:calc(var(--spacing) * 9)}.h-\[6px\]{height:6px}.h-\[9px\]{height:9px}.h-\[10px\]{height:10px}.h-\[16px\]{height:16px}.h-\[18px\]{height:18px}.h-\[20px\]{height:20px}.h-\[28\%\]{height:28%}.h-\[34px\]{height:34px}.h-\[72\%\]{height:72%}.h-\[104px\]{height:104px}.h-\[340px\]{height:340px}.min-h-screen{min-height:100vh}.w-3\.5{width:calc(var(--spacing) * 3.5)}.w-4{width:calc(var(--spacing) * 4)}.w-5{width:calc(var(--spacing) * 5)}.w-7{width:calc(var(--spacing) * 7)}.w-\[6px\]{width:6px}.w-\[9px\]{width:9px}.w-\[10px\]{width:10px}.w-\[18px\]{width:18px}.w-\[218px\]{width:218px}.w-\[220px\]{width:220px}.w-\[236px\]{width:236px}.w-\[248px\]{width:248px}.w-\[260px\]{width:260px}.w-auto{width:auto}.w-full{width:100%}.w-max{width:max-content}.max-w-\[16ch\]{max-width:16ch}.max-w-\[220px\]{max-width:220px}.max-w-\[360px\]{max-width:360px}.max-w-\[792px\]{max-width:792px}.max-w-\[1440px\]{max-width:1440px}.max-w-md{max-width:var(--container-md)}.max-w-xl{max-width:var(--container-xl)}.shrink-0{flex-shrink:0}.-translate-x-0\.5{--tw-translate-x:calc(var(--spacing) * -.5);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-2{--tw-translate-x:calc(var(--spacing) * 2);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-y-0\.5{--tw-translate-y:calc(var(--spacing) * .5);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-y-1{--tw-translate-y:calc(var(--spacing) * 1);translate:var(--tw-translate-x) var(--tw-translate-y)}.rotate-180{rotate:180deg}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.cursor-pointer{cursor:pointer}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-rows-\[0fr\]{grid-template-rows:0fr}.grid-rows-\[1fr\]{grid-template-rows:1fr}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:calc(var(--spacing) * 1)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}
264.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-7{gap:calc(var(--spacing) * 7)}.gap-10{gap:calc(var(--spacing) * 10)}.gap-\[2px\]{gap:2px}.gap-\[10px\]{gap:10px}.gap-x-1\.5{column-gap:calc(var(--spacing) * 1.5)}.gap-x-6{column-gap:calc(var(--spacing) * 6)}.gap-y-1{row-gap:calc(var(--spacing) * 1)}.gap-y-8{row-gap:calc(var(--spacing) * 8)}.self-start{align-self:flex-start}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-3xl{border-radius:var(--radius-3xl)}.rounded-\[5px\]{border-radius:5px}.rounded-\[10px\]{border-radius:10px}.rounded-\[12px\]{border-radius:12px}.rounded-\[14px\]{border-radius:14px}.rounded-full{border-radius:3.40282e38px}.rounded-xl{border-radius:var(--radius-xl)}.rounded-l-\[4px\]{border-top-left-radius:4px;border-bottom-left-radius:4px}.rounded-l-\[6px\]{border-top-left-radius:6px;border-bottom-left-radius:6px}.border{border-style:var(--tw-border-style);border-width:1px}.border-r-0{border-right-style:var(--tw-border-style);border-right-width:0}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\[rgba\(10\,20\,40\,0\.45\)\]{border-color:#0a142873}.border-white\/10{border-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.border-white\/10{border-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.border-white\/90{border-color:#ffffffe6}@supports (color:color-mix(in lab, red, red)){.border-white\/90{border-color:color-mix(in oklab, var(--color-white) 90%, transparent)}}.border-white\/\[0\.06\]{border-color:#ffffff0f}@supports (color:color-mix(in lab, red, red)){.border-white\/\[0\.06\]{border-color:color-mix(in oklab, var(--color-white) 6%, transparent)}}.border-white\/\[0\.08\]{border-color:#ffffff14}@supports (color:color-mix(in lab, red, red)){.border-white\/\[0\.08\]{border-color:color-mix(in oklab, var(--color-white) 8%, transparent)}}.bg-accent-300{background-color:var(--color-accent-300)}.bg-black{background-color:var(--color-black)}.bg-black\/60{background-color:#0009}@supports (color:color-mix(in lab, red, red)){.bg-black\/60{background-color:color-mix(in oklab, var(--color-black) 60%, transparent)}}.bg-\[linear-gradient\(to_top\,\#e2e4ec_0px\,\#e9ebf1_3px\,\#f3f4f8_7px\,\#fafbfc_12px\,\#ffffff_20px\)\]{background-image:linear-gradient(0deg,#e2e4ec 0,#e9ebf1 3px,#f3f4f8 7px,#fafbfc 12px,#fff 20px)}.bg-\[linear-gradient\(to_top\,rgba\(0\,0\,0\,0\.17\)_0px\,rgba\(0\,0\,0\,0\.12\)_5px\,rgba\(0\,0\,0\,0\.07\)_11px\,rgba\(0\,0\,0\,0\.03\)_19px\,rgba\(0\,0\,0\,0\.01\)_27px\,rgba\(0\,0\,0\,0\)_34px\)\]{background-image:linear-gradient(0deg,#0000002b 0,#0000001f 5px,#00000012 11px,#00000008 19px,#00000003 27px,#0000 34px)}.bg-\[linear-gradient\(to_top\,rgba\(255\,255\,255\,0\.95\)_0px\,rgba\(255\,255\,255\,0\.4\)_2px\,rgba\(255\,255\,255\,0\.1\)_6px\,rgba\(255\,255\,255\,0\)_16px\)\]{background-image:linear-gradient(0deg,#fffffff2 0,#fff6 2px,#ffffff1a 6px,#fff0 16px)}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-3{padding:calc(var(--spacing) * 3)}.px-1{padding-inline:calc(var(--spacing) * 1)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3\.5{padding-inline:calc(var(--spacing) * 3.5)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.px-7{padding-inline:calc(var(--spacing) * 7)}.py-1{padding-block:calc(var(--spacing) * 1)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-3\.5{padding-block:calc(var(--spacing) * 3.5)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-5{padding-block:calc(var(--spacing) * 5)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-\[2px\]{padding-block:2px}.pt-2\.5{padding-top:calc(var(--spacing) * 2.5)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pt-24{padding-top:calc(var(--spacing) * 24)}.pt-32{padding-top:calc(var(--spacing) * 32)}.pr-3{padding-right:calc(var(--spacing) * 3)}.pb-0\.5{padding-bottom:calc(var(--spacing) * .5)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pb-6{padding-bottom:calc(var(--spacing) * 6)}.pb-8{padding-bottom:calc(var(--spacing) * 8)}.pb-12{padding-bottom:calc(var(--spacing) * 12)}.pb-14{padding-bottom:calc(var(--spacing) * 14)}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-\[2px\]{padding-left:2px}.text-center{text-align:center}.text-left{text-align:left}.font-display{font-family:var(--font-display)}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-\[10px\]{font-size:10px}.text-\[11\.5px\]{font-size:11.5px}.text-\[11px\]{font-size:11px}.text-\[12\.5px\]{font-size:12.5px}.text-\[12px\]{font-size:12px}.text-\[13\.5px\]{font-size:13.5px}.text-\[13px\]{font-size:13px}.text-\[15px\]{font-size:15px}.text-\[16px\]{font-size:16px}.text-\[26px\]{font-size:26px}.text-\[72px\]{font-size:72px}.leading-\[1\.4\]{--tw-leading:1.4;line-height:1.4}.leading-\[1\.5\]{--tw-leading:1.5;line-height:1.5}.leading-\[1\.45\]{--tw-leading:1.45;line-height:1.45}.leading-\[1\.55\]{--tw-leading:1.55;line-height:1.55}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-\[-1px\]{--tw-tracking:-1px;letter-spacing:-1px}.tracking-\[0\.02em\]{--tw-tracking:.02em;letter-spacing:.02em}.tracking-\[0\.03em\]{--tw-tracking:.03em;letter-spacing:.03em}.tracking-\[0\.09em\]{--tw-tracking:.09em;letter-spacing:.09em}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-pretty{text-wrap:pretty}.whitespace-nowrap{white-space:nowrap}.text-\[\#08203c\]{color:#08203c}.text-background{color:var(--background)}.text-foreground,.text-foreground\/25{color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/25{color:color-mix(in oklab, var(--foreground) 25%, transparent)}}.text-foreground\/45{color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/45{color:color-mix(in oklab, var(--foreground) 45%, transparent)}}.text-foreground\/50{color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/50{color:color-mix(in oklab, var(--foreground) 50%, transparent)}}.text-foreground\/55{color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/55{color:color-mix(in oklab, var(--foreground) 55%, transparent)}}.text-foreground\/60{color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/60{color:color-mix(in oklab, var(--foreground) 60%, transparent)}}.text-foreground\/85{color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/85{color:color-mix(in oklab, var(--foreground) 85%, transparent)}}.text-muted{color:var(--color-muted)}.text-muted-foreground{color:var(--muted-foreground)}.text-white{color:var(--color-white)}.text-white\/40{color:#fff6}@supports (color:color-mix(in lab, red, red)){.text-white\/40{color:color-mix(in oklab, var(--color-white) 40%, transparent)}}.text-white\/50{color:#ffffff80}@supports (color:color-mix(in lab, red, red)){.text-white\/50{color:color-mix(in oklab, var(--color-white) 50%, transparent)}}.text-white\/55{color:#ffffff8c}@supports (color:color-mix(in lab, red, red)){.text-white\/55{color:color-mix(in oklab, var(--color-white) 55%, transparent)}}.text-white\/90{color:#ffffffe6}@supports (color:color-mix(in lab, red, red)){.text-white\/90{color:color-mix(in oklab, var(--color-white) 90%, transparent)}}.uppercase{text-transform:uppercase}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.opacity-0{opacity:0}
264.opacity-60{opacity:.6}.opacity-100{opacity:1}.shadow-\[-1px_3px_4px_rgba\(0\,0\,0\,0\.24\)\]{--tw-shadow:-1px 3px 4px var(--tw-shadow-color,#0000003d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[inset_-2px_0\.5px_0_color-mix\(in_srgb\,var\(--foreground\)_18\%\,transparent\)\]{--tw-shadow:inset -2px .5px 0 var(--tw-shadow-color,var(--foreground))}@supports (color:color-mix(in lab, red, red)){.shadow-\[inset_-2px_0\.5px_0_color-mix\(in_srgb\,var\(--foreground\)_18\%\,transparent\)\]{--tw-shadow:inset -2px .5px 0 var(--tw-shadow-color,color-mix(in srgb,var(--foreground) 18%,transparent))}}.shadow-\[inset_-2px_0\.5px_0_color-mix\(in_srgb\,var\(--foreground\)_18\%\,transparent\)\]{box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-sha
264dow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.backdrop-blur-md{--tw-backdrop-blur:blur(var(--blur-md));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.backdrop-blur-xl{--tw-backdrop-blur:blur(var(--blur-xl));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[background-color\,border-color\,box-shadow\,filter\]{transition-property:background-color,border-color,box-shadow,filter;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[opacity\,transform\]{transition-property:opacity,transform;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[opacity\,translate\]{transition-property:opacity,translate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-\(--duration-fast\){--tw-duration:var(--duration-fast);transition-duration:var(--duration-fast)}.duration-150{--tw-duration:.15s;transition-duration:.15s}.duration-300{--tw-duration:.3s;transition-duration:.3s}.ease-\(--ease-smooth-out\){--tw-ease:var(--ease-smooth-out);transition-timing-function:var(--ease-smooth-out)}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.will-change-transform{will-change:transform}.select-none{-webkit-user-select:none;user-select:none}.\[--veil-end\:62\%\]{--veil-end:62%}@media (hover:hover){.group-hover\:translate-x-0\.5:is(:where(.group):hover *){--tw-translate-x:calc(var(--spacing) * .5);translate:var(--tw-translate-x) var(--tw-translate-y)}.group-hover\:translate-y-0:is(:where(.group):hover *){--tw-translate-y:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.group-hover\:border-white:is(:where(.group):hover *){border-color:var(--color-white)}.group-hover\:text-foreground\/60:is(:where(.group):hover *){color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.group-hover\:text-foreground\/60:is(:where(.group):hover *){color:color-mix(in oklab, var(--foreground) 60%, transparent)}}.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}.group-hover\/all\:translate-x-0\.5:is(:where(.group\/all):hover *){--tw-translate-x:calc(var(--spacing) * .5);translate:var(--tw-translate-x) var(--tw-translate-y)}.group-hover\/box\:translate-x-0:is(:where(.group\/box):hover *){--tw-translate-x:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.group-hover\/box\:translate-y-0:is(:where(.group\/box):hover *){--tw-translate-y:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.group-hover\/box\:border-white\/\[0\.14\]:is(:where(.group\/box):hover *){border-color:#ffffff24}@supports (color:color-mix(in lab, red, red)){.group-hover\/box\:border-white\/\[0\.14\]:is(:where(.group\/box):hover *){border-color:color-mix(in oklab, var(--color-white) 14.0%, transparent)}}.group-hover\/box\:text-white:is(:where(.group\/box):hover *){color:var(--color-white)}.group-hover\/box\:opacity-70:is(:where(.group\/box):hover *){opacity:.7}.group-hover\/cta\:translate-x-0:is(:where(.group\/cta):hover *){--tw-translate-x:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.group-hover\/cta\:opacity-100:is(:where(.group\/cta):hover *){opacity:1}.hover\:border-white\/20:hover{border-color:#fff3}@supports (color:color-mix(in lab, red, red)){.hover\:border-white\/20:hover{border-color:color-mix(in oklab, var(--color-white) 20%, transparent)}}.hover\:bg-white\/\[0\.03\]:hover{background-color:#ffffff08}@supports (color:color-mix(in lab, red, red)){.hover\:bg-white\/\[0\.03\]:hover{background-color:color-mix(in oklab, var(--color-white) 3%, transparent)}}.hover\:bg-white\/\[0\.05\]:hover{background-color:#ffffff0d}@supports (color:color-mix(in lab, red, red)){.hover\:bg-white\/\[0\.05\]:hover{background-color:color-mix(in oklab, var(--color-white) 5%, transparent)}}.hover\:text-foreground:hover,.hover\:text-foreground\/75:hover{color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.hover\:text-foreground\/75:hover{color:color-mix(in oklab, var(--foreground) 75%, transparent)}}.hover\:text-white:hover{color:var(--color-white)}.hover\:opacity-80:hover{opacity:.8}}.focus-visible\:text-foreground:focus-visible{color:var(--foreground)}.focus-visible\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-sha
264dow)}.focus-visible\:ring-white:focus-visible{--tw-ring-color:var(--color-white)}.focus-visible\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.focus-visible\:ring-offset-black:focus-visible{--tw-ring-offset-color:var(--color-black)}.focus-visible\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}@media (min-width:40rem){.sm\:col-span-2{grid-column:span 2/span 2}.sm\:flex{display:flex}.sm\:h-9{height:calc(var(--spacing) * 9)}.sm\:h-\[180px\]{height:180px}.sm\:w-9{width:calc(var(--spacing) * 9)}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:gap-6{gap:calc(var(--spacing) * 6)}.sm\:px-12{padding-inline:calc(var(--spacing) * 12)}.sm\:py-7{padding-block:calc(var(--spacing) * 7)}.sm\:text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.sm\:text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.sm\:\[--veil-end\:100\%\]{--veil-end:100%}}@media (min-width:48rem){.md\:mt-20{margin-top:calc(var(--spacing) * 20)}.md\:mt-52{margin-top:calc(var(--spacing) * 52)}.md\:pt-28{padding-top:calc(var(--spacing) * 28)}.md\:pt-40{padding-top:calc(var(--spacing) * 40)}.md\:pb-12{padding-bottom:calc(var(--spacing) * 12)}.md\:pb-20{padding-bottom:calc(var(--spacing) * 20)}.md\:text-\[58px\]{font-size:58px}.md\:leading-\[1\.04\]{--tw-leading:1.04;line-height:1.04}}@media (min-width:64rem){.lg\:col-span-2{grid-column:span 2/span 2}.lg\:col-span-3{grid-column:span 3/span 3}.lg\:col-span-7{grid-column:span 7/span 7}.lg\:block{display:block}.lg\:flex{display:flex}.lg\:hidden{display:none}.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.lg\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.lg\:gap-8{gap:calc(var(--spacing) * 8)}}@media (pointer:fine){.pointer-fine\:backdrop-blur-\[9px\]{--tw-backdrop-blur:blur(9px);-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}}.light\:border-white\/45:where(.light,.light *){border-color:#ffffff73}@supports (color:color-mix(in lab, red, red)){.light\:border-white\/45:where(.light,.light *){border-color:color-mix(in oklab, var(--color-white) 45%, transparent)}}.light\:bg-\[linear-gradient\(to_top\,\#0e0e14_0px\,\#13131a_3px\,\#1a1a21_7px\,\#1f1f26_12px\,\#232329_20px\)\]:where(.light,.light *){background-image:linear-gradient(0deg,#0e0e14 0,#13131a 3px,#1a1a21 7px,#1f1f26 12px,#232329 20px)}.light\:bg-\[linear-gradient\(to_top\,rgba\(0\,0\,0\,0\.5\)_0px\,rgba\(0\,0\,0\,0\.34\)_5px\,rgba\(0\,0\,0\,0\.19\)_11px\,rgba\(0\,0\,0\,0\.08\)_19px\,rgba\(0\,0\,0\,0\.02\)_27px\,rgba\(0\,0\,0\,0\)_34px\)\]:where(.light,.light *){background-image:linear-gradient(0deg,#00000080 0,#00000057 5px,#00000030 11px,#00000014 19px,#00000005 27px,#0000 34px)}.light\:bg-\[linear-gradient\(to_top\,rgba\(255\,255\,255\,0\.42\)_0px\,rgba\(255\,255\,255\,0\.18\)_2px\,rgba\(255\,255\,255\,0\.04\)_6px\,rgba\(255\,255\,255\,0\)_16px\)\]:where(.light,.light *){background-image:linear-gradient(0deg,#ffffff6b 0,#ffffff2e 2px,#ffffff0a 6px,#fff0 16px)}@media (hover:hover){.light\:group-hover\:border-white\/80:where(.light,.light *):is(:where(.group):hover *){border-color:#fffc}@supports (color:color-mix(in lab, red, red)){.light\:group-hover\:border-white\/80:where(.light,.light *):is(:where(.group):hover *){border-color:color-mix(in oklab, var(--color-white) 80%, transparent)}}}@media (hover:none){.\[\@media\(hover\:none\)\]\:translate-y-0{--tw-translate-y:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.\[\@media\(hover\:none\)\]\:opacity-100{opacity:1}}}@font-face{font-family:Sora;font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/sora-latin.woff2)format("woff2");
264unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Sora;font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/sora-latin-ext.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}:root{color-scheme:dark;--background:#000;--foreground:#fff;--card:#0b0b0b;--card-foreground:#fff;--secondary:#ffffff0f;--secondary-foreground:#fff;--muted-foreground:#8b8b8b;--border:#ffffff0d;--surface:#0e0e0e;--surface-soft:#0a0a0a;--panel:#121212;--card-raised:#141414;--card-shadow:#000c;--card-face:#ffffff03;--chart-1:#489ffa;--chart-2:#4dbe95;--chart-3:#c27c58;--chart-4:#e9ec89;--chart-5:#c88fcf;--chart-up:#34c28a;--chart-down:#e06a6a;--chart-amber:#e8b45a;--on-accent:#0e0e0e;--on-danger:#0e0e0e;--coin-1:#1d2634;--coin-2:#24202f;--coin-3:#1e2b26;--coin-4:#2b2420;--hero-grad-from:#d6e2f8d1;--hero-grad-to:#f7f7f7;--hero-shadow:0 4px 24px #00000073;--hero-fill:linear-gradient(to top, #00000038 0%, #0000 62%), linear-gradient(to top, #6e6e6e 0, #9a9a9a .21em, #c4c4c4 .39em, #e4e4e4 .52em, #fff 1em);--hero-outline:linear-gradient(#fff, #fff);--hero-outline-w:.03em;--chrome-face:linear-gradient(to top, #00000038 0%, #0000 62%), linear-gradient(to top, #5c5c5c 0, #a0a0a0 .14em, #c4c4c4 .39em, #e4e4e4 .52em, #fff 1em);--chrome-face-section:linear-gradient(to top, #0000001a 0%, #0000 62%), linear-gradient(to top, #c8c8c8 0, #dcdcdc .28em, #ebebeb .52em, #f6f6f6 .66em, #fff 1em);--chrome-rim:linear-gradient(#fff, #fff);--chrome-rim-w:2px;--heading-fade:55%;--plate-from:#131315;--plate-to:#0b0b0d;--plate-dark-from:#0b0b0c;--plate-dark-to:#060607;--field-from:#121213;--dock-from:#131315b8;--dock-to:#0b0b0db8;--dock-tip:#0c0c0ef2;--dock-shadow-1:#0006;--dock-shadow-2:#0000004d;--dock-shadow-inner:#0003;--tile-bg:#060607;--ticket-from:#1b1b1f;--ticket-to:#101013;--ticket-sheen:#ffffff12;--ticket-sheen-2:#ffffff05;--price-ink:var(--foreground)}@supports (color:color-mix(in lab, red, red)){:root{--price-ink:color-mix(in srgb, var(--foreground) 9%, transparent)}}:root{--price-emboss:0 -1px 0 #0000008c, 0 1px 0 #ffffff12;--punch-ink:#0000009e;--punch-lip:#ffffff1c}.library-shell{--background:#000}.light .library-shell{--background:#fff}.library-shell.dark{--background:#000}.light{color-scheme:light;--background:#fff;--foreground:#0e0e0e;--card:#fff;--card-foreground:#0e0e0e;--secondary:#0000000d;--secondary-foreground:#0e0e0e;--muted-foreground:#616161;--border:#00000014;--surface:#fafafa;--surface-soft:#fdfdfd;--panel:#fff;--card-raised:#fff;--card-shadow:#0000001a;--card-face:#fff;--chart-1:#1652f0;--chart-2:#0ea472;--chart-3:#c4561f;--chart-4:#a3a800;--chart-5:#7132f5;--chart-up:#0e9f61;--chart-down:#e0245e;--chart-amber:#d48a06;--on-accent:#0e0e0e;--on-danger:#fff;--coin-1:#ddeaf8;--coin-2:#efe5f1;--coin-3:#e2f1eb;--coin-4:#f3e9e4;--hero-grad-from:#0e0e0ed1;--hero-grad-to:#0e0e0e;--hero-shadow:none;--hero-fill:linear-gradient(to top, #fff3 0%, #fff0 62%), linear-gradient(to top, #0e0e0ed1 0, #0e0e0e 1em);--hero-outline:none;--hero-outline-w:0px;--chrome-face:linear-gradient(to top, #fff3 0%, #fff0 62%), linear-gradient(to top, var(--foreground) 0, var(--foreground) 1em)}@supports (color:color-mix(in lab, red, red)){.light{--chrome-face:linear-gradient(to top, #fff3 0%, #fff0 62%), linear-gradient(to top, color-mix(in srgb, var(--foreground) var(--heading-fade), transparent) 0, var(--foreground) 1em)}}.light{--chrome-rim:none;--chrome-rim-w:0px;--chrome-face-section:var(--chrome-face);--heading-fade:82%;--plate-from:#fff;--plate-to:#fff;--plate-dark-from:#fbfbfb;--plate-dark-to:#f3f3f4;--field-from:#f7f7f8;--dock-from:#ffffffd1;--dock-to:#f6f6f7d1;--dock-tip:#fffffff7;--dock-shadow-1:#0f172a1f;--dock-shadow-2:#0f172a14;--dock-shadow-inner:#0f172a0a;--tile-bg:#060607;--ticket-from:#fff;--ticket-to:#f1f1f3;--ticket-sheen:#ffffffe6;--ticket-sheen-2:#0f172a06;--price-ink:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.light{--price-ink:color-mix(in srgb, var(--foreground) 8%, transparent)}}.light{--price-emboss:0 -1px 0 #0f172a29, 0 1px 0 #fffffff2;--punch-ink:#0f172a6b;--punch-lip:#fffffff2}.light .hero-stage{--background:#111}.dark{color-scheme:dark;--ticket-from:#1b1b1f;--ticket-to:#101013;--ticket-sheen:#ffffff12;--ticket-sheen-2:#ffffff05;--price-ink:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark{--price-ink:color-mix(in srgb, var(--foreground) 9%, transparent)}}.dark{--price-emboss:0 -1px 0 #0000008c, 0 1px 0 #ffffff12;--punch-ink:#0000009e;--punch-lip:#ffffff1c;color:var(--foreground);--background:#000;--foreground:#fff;--card:#0b0b0b;--card-foreground:#fff;--secondary:#ffffff0f;--secondary-foreground:#fff;--muted-foreground:#8b8b8b;--border:#ffffff0d;--surface:#0e0e0e;--surface-soft:#0a0a0a;--panel:#121212;--card-raised:#141414;--card-shadow:#000c;--card-face:#ffffff03;--chart-1:#489ffa;--chart-2:#4dbe95;--chart-3:#c27c58;--chart-4:#e9ec89;--chart-5:#c88fcf;--chart-up:#34c28a;--chart-down:#e06a6a;--chart-amber:#e8b45a;--on-accent:#0e0e0e;--on-danger:#0e0e0e;--coin-1:#1d2634;--coin-2:#24202f;--coin-3:#1e2b26;--coin-4:#2b2420;--hero-grad-from:#d6e2f8d1;--hero-grad-to:#f7f7f7;--hero-shadow:0 4px 24px #00000073;--hero-fill:linear-gradient(to top, #00000038 0%, #0000 62%), linear-gradient(to top, #6e6e6e 0, #9a9a9a .21em, #c4c4c4 .39em, #e4e4e4 .52em, #fff 1em);--hero-outline:linear-gradient(#fff, #fff);--hero-outline-w:.03em;--chrome-face:linear-gradient(to top, #00000038 0%, #0000 62%), linear-gradient(to top, #5c5c5c 0, #a0a0a0 .14em, #c4c4c4 .39em, #e4e4e4 .52em, #fff 1em);--chrome-face-section:linear-gradient(to top, #0000001a 0%, #0000 62%), linear-gradient(to top, #c8c8c8 0, #dcdcdc .28em, #ebebeb .52em, #f6f6f6 .66em, #fff 1em);--chrome-rim:linear-gradient(#fff, #fff);--chrome-rim-w:2px;--heading-fade:55%;--color-ink:var(--background);--color-ink-soft:var(--surface-soft);--color-line:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark{--color-line:color-mix(in srgb, var(--foreground) 8%, transparent)}}.dark{--color-line-strong:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark{--color-line-strong:color-mix(in srgb, var(--foreground) 14%, transparent)}}.dark{--color-grid:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark{--color-grid:color-mix(in srgb, var(--foreground) 3.5%, transparent)}}.dark{--color-muted:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark{--color-muted:color-mix(in srgb, var(--foreground) 60%, transparent)}}.dark{--color-faint:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark{--color-faint:color-mix(in srgb, var(--foreground) 50%, transparent)}}
264.dark{--color-dot:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark{--color-dot:color-mix(in srgb, var(--foreground) 16%, var(--background))}}@media (max-width:639px){:root:not(.light),.dark{--chrome-rim-w:1.25px}}*{scrollbar-width:thin;scrollbar-color:var(--foreground) transparent}@supports (color:color-mix(in lab, red, red)){*{scrollbar-color:color-mix(in srgb, var(--foreground) 12%, transparent) transparent}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--foreground)}@supports (color:color-mix(in lab, red, red)){::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--foreground) 10%, transparent)}}::-webkit-scrollbar-thumb{border-radius:9999px}::-webkit-scrollbar-thumb:hover{background:var(--foreground)}@supports (color:color-mix(in lab, red, red)){::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb, var(--foreground) 22%, transparent)}}.hover-scroll{scrollbar-color:transparent transparent}.hover-scroll::-webkit-scrollbar-thumb{background:0 0}.hover-scroll:hover{scrollbar-color:var(--foreground) transparent}@supports (color:color-mix(in lab, red, red)){.hover-scroll:hover{scrollbar-color:color-mix(in srgb, var(--foreground) 12%, transparent) transparent}}.hover-scroll:hover::-webkit-scrollbar-thumb{background:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.hover-scroll:hover::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--foreground) 10%, transparent)}}.faint-scroll{scrollbar-width:none}.faint-scroll::-webkit-scrollbar{width:0;height:0;display:none}:root{--board-col:920px;--library-nav:272px}@media (min-width:1024px){.board-centered{margin-inline-end:min(var(--library-nav), max(0px, 100% - var(--board-col) - 2.5rem))}}.embed-scroll{scrollbar-width:thin;scrollbar-color:var(--foreground) var(--embed-ground,transparent)}@supports (color:color-mix(in lab, red, red)){.embed-scroll{scrollbar-color:color-mix(in srgb, var(--foreground) 22%, transparent) var(--embed-ground,transparent)}}.embed-scroll::-webkit-scrollbar{width:6px;height:6px}.embed-scroll::-webkit-scrollbar-track{background:var(--embed-ground,transparent)}.embed-scroll::-webkit-scrollbar-thumb{background:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.embed-scroll::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--foreground) 22%, transparent)}}.embed-scroll::-webkit-scrollbar-thumb{border-radius:9999px}.scroll-stable{scrollbar-gutter:stable}.lab-page,.lab-vars{--lab-bg:var(--background);--lab-panel:var(--surface);--lab-stage:var(--card);--lab-text:var(--foreground);--lab-muted:var(--muted-foreground);
264--lab-accent:var(--chart-1);--lab-line:var(--border)}.lab-page{background:var(--lab-bg);color:var(--lab-text);font-feature-settings:"ss01" 1, "ss02" 1}.lab-topbar{border-bottom:1px solid var(--lab-line)}.lab-demo-card{border:1px solid var(--lab-line)}@supports (color:color-mix(in lab, red, red)){.lab-demo-card{border:1px solid color-mix(in srgb, var(--lab-line) 55%, transparent)}}.lab-demo-card{background:var(--lab-bg);border-radius:12px}.lab-demo-header{background:0 0}.lab-demo-stage{background-color:#0000}.lab-page :focus-visible{outline-offset:2px;outline-color:#489ffacc}.quiet-focus :focus-visible,.quiet-focus:focus-visible{outline:1px solid var(--foreground)}@supports (color:color-mix(in lab, red, red)){.quiet-focus :focus-visible,.quiet-focus:focus-visible{outline:1px solid color-mix(in srgb, var(--foreground) 28%, transparent)}}.quiet-focus :focus-visible,.quiet-focus:focus-visible{outline-offset:0}.quiet-focus input:focus-visible,.quiet-focus textarea:focus-visible{outline:1px solid var(--foreground)}@supports (color:color-mix(in lab, red, red)){.quiet-focus input:focus-visible,.quiet-focus textarea:focus-visible{outline:1px solid color-mix(in srgb, var(--foreground) 24%, transparent)}}.quiet-focus input:focus-visible,.quiet-focus textarea:focus-visible{outline-offset:0}.quiet-focus label[class*=rounded]:has(>input:focus-visible),.quiet-focus label[class*=rounded]:has(>textarea:focus-visible){outline:1px solid var(--foreground)}@supports (color:color-mix(in lab, red, red)){.quiet-focus label[class*=rounded]:has(>input:focus-visible),.quiet-focus label[class*=rounded]:has(>textarea:focus-visible){outline:1px solid color-mix(in srgb, var(--foreground) 24%, transparent)}}.quiet-focus label[class*=rounded]:has(>input:focus-visible),.quiet-focus label[class*=rounded]:has(>textarea:focus-visible){outline-offset:0}.quiet-focus label[class*=rounded]:has(>input:focus-visible)>input,.quiet-focus label[class*=rounded]:has(>textarea:focus-visible)>textarea{outline:none}.no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.no-scrollbar::-webkit-scrollbar{display:none}.hover-scroll,.faint-scroll,.no-scrollbar{overscroll-behavior-y:none}.lab-page .lab-no-ring:focus-visible,.lab-vars .lab-no-ring:focus-visible,.no-focus-ring:focus-visible,.quiet-focus .no-focus-ring:focus-visible{outline:none}html{scroll-behavior:smooth;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;overscroll-behavior-y:none}body{overscroll-behavior-y:none}@media (pointer:coarse){input,textarea,select{font-size:16px}}html,body{color:var(--foreground);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;max-width:100%;overflow-x:clip}body{background:var(--background);margin:0;overflow-x:clip}::selection{background:var(--foreground);color:var(--background)}.display{font-family:var(--font-display);letter-spacing:-.0133em;font-weight:500;line-height:.75}.title-etched{background-image:linear-gradient(to top, var(--foreground) 0%, var(--foreground) 100%)}@supports (color:color-mix(in lab, red, red)){.title-etched{background-image:linear-gradient(to top, var(--foreground) 0%, color-mix(in srgb, var(--foreground) 80%, transparent) 100%)}}.title-etched{-webkit-text-fill-color:transparent;-webkit-text-stroke:.5px var(--foreground);-webkit-background-clip:text;background-clip:text}@supports (color:color-mix(in lab, red, red)){.title-etched{-webkit-text-stroke:.5px color-mix(in srgb, var(--foreground) 42%, transparent)}}.title-etched{text-shadow:0 4px 24px #000000e6}.display-mid{font-family:var(--font-display);letter-spacing:normal;font-weight:500;line-height:1}.label{font-family:var(--font-display);letter-spacing:.0667em;font-size:.75rem;font-weight:500;line-height:.9375rem}.liquid-glass{background-blend-mode:luminosity;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff03;position:relative;overflow:hidden;box-shadow:inset 0 1px 1px #ffffff1a}.liquid-glass:before{content:"";border-radius:inherit;-webkit-mask-composite:xor;pointer-events:none;-webkit-mask-composite:xor;-webkit-mask-source-type:auto,auto;background:linear-gradient(#ffffff73 0%,#ffffff26 20%,#fff0 40% 60%,#ffffff26 80%,#ffffff73 100%);padding:1.4px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}@keyframes marquee-left{0%{transform:translate(0)}to{transform:translate(-50%)}}@keyframes marquee-right{0%{transform:translate(-50%)}to{transform:translate(0)}}.animate-marquee-left{animation:22s linear infinite marquee-left}.animate-marquee-right{animation:26s linear infinite marquee-right}.hover-3d{perspective:75rem;--transform:0, 0;--shine:100% 100%;--shadow:0rem 0rem 0rem;--ease:linear(0, .931 13.8%, 1.196 21.4%, 1.343 29.8%, 1.378 36%, 1.365 43.2%, 1.059 78%, 1);filter:drop-shadow(var(--shadow) .1rem #00000003) drop-shadow(var(--shadow) .2rem #00000003) drop-shadow(var(--shadow) .3rem #00000003) drop-shadow(var(--shadow) .4rem #00000003);transition:filter .4s ease-out;display:inline-grid}.hover-3d>:nth-child(n+2){isolation:isolate;z-index:1;scale:1.2}.hover-3d>:first-child{transform:rotate3d(var(--transform), 0, 10deg);transition:transform var(--ease) .5s, scale var(--ease) .5s, outline-color ease-out .5s;outline-offset:-1px;outline:.5px solid #0000;grid-area:1/1/4/4}.hover-3d>:first-child:before{content:"";pointer-events:none;z-index:1;opacity:0;filter:blur(.75rem);width:33.3333%;height:33.3333%;scale:5;translate:var(--shine);background-image:radial-gradient(circle,#fff3 10%,#0000 50%);transition:translate .4s ease-out,opacity .4s ease-out;position:absolute}.hover-3d:hover{--ease:linear(0, .708 15.2%, .927 23.6%, 1.067 33%, 1.12 41%, 1.13 50.2%, 1.019 83.2%, 1)}.hover-3d:hover>:first-child{outline-color:#fff1;scale:1.05}.hover-3d:hover>:first-child:before{opacity:1}.hover-3d>:nth-child(2){grid-area:1/1/2/2}.hover-3d>:nth-child(3){grid-area:1/2/2/3}.hover-3d>:nth-child(4){grid-area:1/3/2/4}.hover-3d>:nth-child(5){grid-area:2/1/3/2}.hover-3d>:nth-child(6){grid-area:2/3/3/4}.hover-3d>:nth-child(7){grid-area:3/1/4/2}.hover-3d>:nth-child(8){grid-area:3/2/4/3}.hover-3d>:nth-child(9){grid-area:3/3/4/4}.hover-3d:has(>:nth-child(2):hover){--transform:-1, 1;--shine:0% 0%;--shadow:-.5rem -.5rem}.hover-3d:has(>:nth-child(3):hover){--transform:-1, 0;
264--shine:100% 0%;--shadow:0rem -.5rem}.hover-3d:has(>:nth-child(4):hover){--transform:-1, -1;--shine:200% 0%;--shadow:.5rem -.5rem}.hover-3d:has(>:nth-child(5):hover){--transform:0, 1;--shine:0% 100%;--shadow:-.5rem 0rem}.hover-3d:has(>:nth-child(6):hover){--transform:0, -1;--shine:200% 100%;--shadow:.5rem 0rem}.hover-3d:has(>:nth-child(7):hover){--transform:1, 1;--shine:0% 200%;--shadow:-.5rem .5rem}.hover-3d:has(>:nth-child(8):hover){--transform:1, 0;--shine:100% 200%;--shadow:0rem .5rem}.hover-3d:has(>:nth-child(9):hover){--transform:1, -1;--shine:200% 200%;--shadow:.5rem .5rem}@keyframes pl-iris{0%{r:0;opacity:1}60%,85%{r:420px;opacity:1}to{r:420px;opacity:0}}.cta-glass{-webkit-backdrop-filter:blur(20px)saturate(140%);background:#ffffff0f;border:1px solid #ffffff1a;box-shadow:inset 0 1px #ffffff14,0 10px 30px #00000040}@keyframes fade-rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.animate-fade-rise{animation:.8s ease-out both fade-rise}.animate-fade-rise-delay{animation:.8s ease-out .25s both fade-rise}.animate-fade-rise-delay-2{animation:.8s ease-out .5s both fade-rise}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{scrollbar-width:none}@media (prefers-reduced-motion:reduce){.animate-fade-rise,.animate-fade-rise-delay,.animate-fade-rise-delay-2{animation:none}}@keyframes cta-mark-tilt{0%{transform:rotate3d(.22,1,0,-8deg)}50%{transform:rotate3d(.22,1,0,8deg)}to{transform:rotate3d(.22,1,0,-8deg)}}@keyframes cta-mark-light{0%{opacity:.35;background-position:130% 0}25%{opacity:.7}50%{opacity:.35;background-position:-30% 0}75%{opacity:.7}to{opacity:.35;background-position:130% 0}}.cta-mark-3d{transform-style:preserve-3d;will-change:transform;animation:8s ease-in-out infinite cta-mark-tilt}.cta-mark-3d>span{transform-style:preserve-3d}.section-chrome{--chrome-face:var(--chrome-face-section)}.cta-mark-sheen,.section-mark-shade{pointer-events:none;-webkit-mask-image:var(--mark-mask,url(/assets/icon-mark.svg));-webkit-mask-image:var(--mark-mask,url(/assets/icon-mark.svg));mask-image:var(--mark-mask,url(/assets/icon-mark.svg));-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-image:var(--mark-mask,url(/assets/icon-mark.svg));-webkit-mask-position:50%;-webkit-mask-size:contain;-webkit-mask-repeat:no-repeat}.cta-mark-sheen{background:linear-gradient(100deg,#0000 32%,#ffffffd9 50%,#0000 68%) 0 0/220% 100% no-repeat;animation:8s ease-in-out infinite cta-mark-light}@media (prefers-reduced-motion:reduce){.cta-mark-3d{animation:none}.cta-mark-sheen{display:none}}.lm-pill-shader canvas{display:block;width:100%!important;height:100%!important}.thing-spin{animation:thing-spin var(--spin-dur,24s) linear infinite}@keyframes thing-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.thing-spin{animation:none}}html.edit-armed,html.drag-moving *{cursor:grabbing!important}html.edit-armed *{cursor:crosshair!important}html.panel-open #root{padding-left:var(--panel-left-w,0px);padding-right:var(--panel-w,300px)}html.panel-open #root,html.panel-open #root *{scrollbar-gutter:stable}:root{--duration-stagger:40ms;--duration-micro:80ms;--duration-quick:.15s;--duration-fast:.25s;--duration-medium:.35s;--duration-slow:.4s;--duration-very-slow:.5s;--ease-smooth-out:cubic-bezier(.22, 1, .36, 1);--ease-in-out:ease-in-out;--ease-out:ease-out;--ease-linear:linear;--ease-bounce:cubic-bezier(.34, 1.36, .64, 1);--ease-bounce-strong:cubic-bezier(.34, 3.85, .64, 1);--distance-micro:4px;--distance-small:6px;--distance-base:8px;--distance-medium:12px;--distance-large:30px;--scale-large:.96;--scale-medium:.97;--scale-small:.98;--scale-tiny:.99;--blur-small:2px;--blur-medium:3px;--blur-large:8px;--stagger-dur:.5s;--stagger-distance:12px;--stagger-stagger:40ms;--stagger-blur:3px;--stagger-ease:cubic-bezier(.22, 1, .36, 1);--learn-shift:2px;--learn-spread:8deg;--learn-in:.35s;--learn-out:.35s;--learn-ease:cubic-bezier(.22, 1, .36, 1);--tabs-dur:var(--duration-fast);--tabs-ease:var(--ease-smooth-out)}.t-tabs-pill{width:0;transition:transform var(--tabs-dur) var(--tabs-ease), width var(--tabs-dur) var(--tabs-ease);will-change:transform, width;z-index:0;pointer-events:none;border-radius:9999px;position:absolute;top:4px;bottom:4px;left:0;transform:translate(0)}.t-tab{z-index:1;transition:color var(--tabs-dur) var(--tabs-ease), transform var(--duration-quick) var(--ease-smooth-out);position:relative}.t-tab:active{transform:scale(var(--scale-large))}@media (prefers-reduced-motion:reduce){.t-tabs-pill,.t-tab{transition:none!important}.t-tab:active{transform:none}}.t-stagger-line{opacity:0;transform:translateY(var(--stagger-distance));filter:blur(var(--stagger-blur));transition:opacity var(--stagger-dur) var(--stagger-ease), transform var(--stagger-dur) var(--stagger-ease), filter var(--stagger-dur) var(--stagger-ease);will-change:transform, opacity, filter;display:block}.t-stagger-line--2{transition-delay:var(--stagger-stagger)}.t-stagger-line--3{transition-delay:calc(var(--stagger-stagger) * 2)}.t-stagger.is-shown .t-stagger-line{opacity:1;filter:blur();transform:translateY(0)}.t-stagger.is-hiding .t-stagger-line{opacity:0;filter:blur();transition:opacity .2s,transform linear,filter linear;transform:translateY(0)}@media (prefers-reduced-motion:reduce){.t-stagger-line{transition:none!important}}:root{--tilt-perspective:1000px;--tilt-return:1s;--tilt-return-ease:cubic-bezier(.22, 1, .36, 1);--tilt-follow:.4s;--tilt-follow-ease:cubic-bezier(.22, 1, .36, 1);--tilt-glare-opacity:.32;--tilt-glare-fade:.3s;--tilt-glare-ease:cubic-bezier(.22, 1, .36, 1)}.t-tilt{touch-action:none}.t-tilt-card{transform:perspective(var(--tilt-perspective)) rotateX(var(--tilt-rx,0deg)) rotateY(var(--tilt-ry,0deg));transform-style:preserve-3d;transition:transform var(--tilt-return) var(--tilt-return-ease);will-change:transform;border-radius:12px;position:relative;overflow:hidden}.t-tilt-card.is-tilting{transition:transform var(--tilt-follow) var(--tilt-follow-ease)}.t-tilt-glare{pointer-events:none;opacity:0;mix-blend-mode:screen;background:radial-gradient(circle 95px at var(--tilt-gx,50%) var(--tilt-gy,50%), #ffffff7a, #ffffff0f 52%, #fff0 84%), radial-gradient(circle 200px at var(--tilt-gx,50%) var(--tilt-gy,50%), #ffffff38, #ffffff0a 58%, #fff0 78%), radial-gradient(circle 360
264px at var(--tilt-gx,50%) var(--tilt-gy,50%), #ffffff1a, #fff0 88%);transition:opacity var(--tilt-glare-fade) var(--tilt-glare-ease);position:absolute;inset:0}.t-tilt.is-hover .t-tilt-glare{opacity:var(--tilt-glare-opacity)}@media (prefers-reduced-motion:reduce){.t-tilt-card{transition:none!important;transform:none!important}}.section-mark{--tilt-perspective:260px;--mark-w:48px}@media (min-width:40rem){.section-mark{--mark-w:56px}}@media (min-width:64rem){.section-mark{--mark-w:64px}}.section-mark .t-tilt{touch-action:auto}.section-mark .t-tilt-card{transform:perspective(var(--tilt-perspective)) rotateX(var(--tilt-rx,0deg)) rotateY(calc(var(--tilt-ry,0deg) + var(--flip,0deg)));border-radius:0;overflow:visible}.section-mark .t-tilt-card.is-flipping{transition:none}.section-mark .t-tilt-card.is-flipping .cta-mark-3d{animation-play-state:paused}.section-mark .t-tilt.is-flippable{cursor:pointer;touch-action:pan-y;-webkit-user-select:none;user-select:none}.section-mark-tile{--d:0px;transform:translateZ(calc(var(--mark-w) * var(--z))) var(--m) translateZ(calc(var(--d) * -1));overflow:hidden}.section-mark-shade{background:radial-gradient(circle,#0000 42%,#00000029 100%)}.section-mark-sheen{transition:opacity var(--tilt-glare-fade) var(--tilt-glare-ease)}.section-mark .t-tilt.is-hover .section-mark-sheen{opacity:0}.section-mark .t-tilt.is-hover .cta-mark-3d{animation-play-state:paused}.t-learn-chevron{transition:transform var(--learn-out) var(--learn-ease);display:inline-flex;transform:translate(0)}.t-learn-arm{transform-box:view-box;transform-origin:10px 8px;vector-effect:non-scaling-stroke;transition:transform var(--learn-out) var(--learn-ease)}@media (hover:hover) and (pointer:fine){.t-learn:hover .t-learn-chevron{transform:translateX(var(--learn-shift));transition-duration:var(--learn-in)}.t-learn:hover .t-learn-arm{transition-duration:var(--learn-in)}.t-learn:hover .t-learn-arm-top{transform:rotate(var(--learn-spread))}.t-learn:hover .t-learn-arm-bot{transform:rotate(calc(var(--learn-spread) * -1))}}@media (prefers-reduced-motion:reduce){.t-learn-chevron,.t-learn-arm{transition:none!important}}.t-project-row{transition:translate var(--duration-fast) var(--ease-smooth-out), scale var(--duration-quick) var(--ease-smooth-out)}@media (hover:hover) and (pointer:fine){.t-project-row:hover{translate:0 -2px}}.t-project-row:active{translate:0;scale:var(--scale-tiny)}.t-project-row .t-project-plate{transition:box-shadow var(--duration-fast) var(--ease-smooth-out)}@media (hover:hover) and (pointer:fine){.t-project-row:hover .t-project-plate{box-shadow:inset 0 0 0 1px var(--foreground), inset 0 1px 0 0 var(--foreground)!important}@supports (color:color-mix(in lab, red, red)){.t-project-row:hover .t-project-plate{box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--foreground) 9%, transparent), inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 6%, transparent)!important}}.t-project-row [class*="group-hover/cutout:scale"]{transition-duration:var(--duration-slow)!important;transition-timing-function:var(--ease-smooth-out)!important}.t-project-row:hover [class*="group-hover/cutout:scale"]{scale:1.03!important}}.t-project-row .t-project-ridge{transition:translate var(--duration-very-slow) var(--ease-smooth-out)}@media (hover:hover) and (pointer:fine){.t-project-row:hover .t-project-ridge{translate:-8px}}@media (prefers-reduced-motion:reduce){.t-project-row,.t-project-row .t-project-plate,.t-project-row .t-project-ridge,.t-project-row [class*="group-hover/cutout:scale"]{transition:none!important}.t-project-row:hover,.t-project-row:active{translate:none;scale:none}.t-project-row:hover [class*="group-hover/cutout:scale"]{scale:1!important}.t-project-row:hover .t-project-ridge{translate:none}}@keyframes t-ticker-run{0%{transform:translate(0)}to{transform:translate(-50%)}}.t-ticker-tape{animation:60s linear infinite t-ticker-run}
264.t-ticker-tape--reverse{animation-direction:reverse}@media (prefers-reduced-motion:reduce){.t-ticker-tape{animation:none!important}}.t-work-tile{transition:translate var(--duration-fast) var(--ease-smooth-out), scale var(--duration-quick) var(--ease-smooth-out), box-shadow var(--duration-fast) var(--ease-smooth-out)}@media (hover:hover) and (pointer:fine){.t-work-tile:hover{box-shadow:0 0 0 1px var(--foreground), 0 18px 40px -26px #000000d9;translate:0 -2px}@supports (color:color-mix(in lab, red, red)){.t-work-tile:hover{box-shadow:0 0 0 1px color-mix(in srgb, var(--foreground) 9%, transparent), 0 18px 40px -26px #000000d9}}}.t-work-tile:active{translate:0;scale:var(--scale-tiny)}.t-work-tile .t-work-cover{transition:scale var(--duration-slow) var(--ease-smooth-out)}@media (hover:hover) and (pointer:fine){.t-work-tile:hover .t-work-cover{scale:1.03}}.t-work-tile .t-work-ridge{transition:translate var(--duration-very-slow) var(--ease-smooth-out)}@media (hover:hover) and (pointer:fine){.t-work-tile:hover .t-work-ridge{translate:-8px}}.t-work-caption{opacity:0;transition:opacity var(--duration-fast) var(--ease-smooth-out)}.t-work-caption-text{translate:0 var(--distance-base,8px);transition:translate var(--duration-fast) var(--ease-smooth-out)}@media (hover:hover) and (pointer:fine){.t-work-tile:hover .t-work-caption{opacity:1}.t-work-tile:hover .t-work-caption-text{translate:0}}.t-work-tile:focus-visible .t-work-caption{opacity:1}.t-work-tile:focus-visible .t-work-caption-text{translate:0}.t-work-read{opacity:0;translate:0 var(--distance-micro,4px);transition:opacity var(--duration-fast) var(--ease-smooth-out), translate var(--duration-fast) var(--ease-smooth-out)}@media (hover:hover) and (pointer:fine){.t-work-tile:hover .t-work-read,.t-project-row:hover .t-work-read{opacity:1;translate:0}}.t-work-tile:focus-within .t-work-read,.t-project-row:focus-visible .t-work-read{opacity:1;translate:0}@media (hover:none){.t-work-read{opacity:1;translate:0}}@media (prefers-reduced-motion:reduce){.t-work-tile,.t-work-tile .t-work-cover,.t-work-tile .t-work-ridge,.t-work-caption,.t-work-caption-text,.t-work-read{transition:none!important}.t-work-tile:hover,.t-work-tile:active{translate:none;scale:none}.t-work-tile:hover .t-work-cover{scale:1}.t-work-tile:hover .t-work-ridge,.t-work-caption-text,.t-work-read{translate:none}}.light .section-mark .t-tilt-card,.light .section-mark canvas{filter:brightness(.44)contrast(7.5)}html,body{overflow-x:clip}:root{--avatar-lift:-4px;--avatar-dur:.32s;--avatar-scale:1.05;--avatar-falloff:.45;--avatar-ease-in:cubic-bezier(.22, 1, .36, 1);--avatar-ease-out:cubic-bezier(.34, 3.85, .64, 1);--tt-in-dur:.15s;--tt-out-dur:50ms;--tt-scale:.98;--tt-delay:80ms;--tt-in-ease:ease-out;--tt-out-ease:ease-out}.t-avatar{transform-origin:50%;transform:translateY(var(--shift,0px)) scale(var(--scale-active,1));transition:transform var(--avatar-dur) var(--avatar-ease-in);will-change:transform}@media (prefers-reduced-motion:reduce){.t-avatar{transition:none!important;transform:none!important}}.t-hint{transform:translate(-50%, var(--distance-micro));filter:blur(var(--blur-small));white-space:nowrap;opacity:0;pointer-events:none;transition:opacity var(--duration-quick) var(--ease-out), transform var(--duration-quick) var(--ease-out), filter var(--duration-quick) var(--ease-out);will-change:transform, opacity, filter;position:absolute;top:calc(100% + 6px);left:50%}[data-hint-wrap]:hover .t-hint,[data-hint-wrap]:focus-within .t-hint{opacity:1;filter:blur();transition-duration:var(--duration-fast);transition-timing-function:var(--ease-smooth-out);transition-delay:var(--tt-delay);transform:translate(-50%)}@media (prefers-reduced-motion:reduce){.t-hint{transition:none!important}}@media (hover:none){[data-hero-layer=rail] .t-hint{display:none}}html.drag-moving [data-ed-dragging]{opacity:.6;transition:none!important}html.drag-moving,html.drag-moving *{-webkit-user-select:none!important;user-select:none!important}@keyframes scroll-hint-nod{0%,to{transform:translateY(0)}50%{transform:translateY(3px)}}.scroll-hint-arrow{animation:1.4s ease-in-out infinite scroll-hint-nod}@media (prefers-reduced-motion:reduce){.scroll-hint-arrow{animation:none}}@keyframes library-select-open{0%{opacity:0;transform:translateY(-4px)scale(.98)}to{opacity:1;transform:none}}.library-select-list{transform-origin:0 0;animation:.16s cubic-bezier(.22,1,.36,1) library-select-open}@media (prefers-reduced-motion:reduce){.library-select-list{animation:none}}:root,.dark,.light{--control-fill:var(--foreground)}@supports (color:color-mix(in lab, red, red)){:root,.dark,.light{--control-fill:color-mix(in oklab, var(--foreground) 8%, transparent)}}:root,.dark,.light{--control-fill-hover:var(--foreground)}@supports (color:color-mix(in lab, red, red)){:root,.dark,.light{--control-fill-hover:color-mix(in oklab, var(--foreground) 12%, transparent)}}:root,.dark,.light{--control-shadow:inset 0 1px 0 0 var(--foreground)}@supports (color:color-mix(in lab, red, red)){:root,.dark,.light{--control-shadow:inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 6%, transparent)}}:root,.dark,.light{--field-fill:var(--foreground)}@supports (color:color-mix(in lab, red, red)){:root,.dark,.light{--field-fill:color-mix(in oklab, var(--foreground) 3%, transparent)}}:root,.dark,.light{--field-fill-hover:var(--foreground)}@supports (color:color-mix(in lab, red, red)){:root,.dark,.light{--field-fill-hover:color-mix(in oklab, var(--foreground) 5%, transparent)}}:root,.dark,.light{--field-shadow:inset 0 1px 0 0 var(--foreground)}@supports (color:color-mix(in lab, red, red)){:root,.dark,.light{--field-shadow:inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 4%, transparent)}}.light,:root:not(.dark){--card-ground:#fff;--light-outline:#e7e6e9}.dark{--card-ground:initial}.light,:root:not(.dark){--control-fill:#fff;--control-fill-hover:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.light,:root:not(.dark){--control-fill-hover:color-mix(in srgb, var(--foreground) 4%, #fff)}}.light,:root:not(.dark){--control-shadow:0 0 0 1px var(--light-outline), 0 1px 2px #0000000a;--field-fill:#fff;--field-fill-hover:#fff;--field-shadow:0 0 0 1px var(--light-outline)}.light .raised,:root:not(.dark) .raised{--control-fill:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.light .raised,:root:not(.dark) .raised{--control-fill:color-mix(in srgb, var(--foreground) 4.5%, #fff)}}.light .raised,:root:not(.dark) .raised{--control-fill-hover:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.light .raised,:root:not(.dark) .raised{--control-fill-hover:color-mix(in srgb, var(--foreground) 8%, #fff)}}.light .raised,:root:not(.dark) .raised{--control-shadow:none;--field-fill:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.light .raised,:root:not(.dark) .raised{--field-fill:color-mix(in srgb, var(--foreground) 4%, #fff)}}.light .raised,:root:not(.dark) .raised{--field-fill-hover:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.light .raised,:root:not(.dark) .raised{--field-fill-hover:color-mix(in srgb, var(--foreground) 6%, #fff)}}.light .raised,:root:not(.dark) .raised{--field-shadow:0 0 0 1px var(--light-outline)}:root,.dark,.light{--tip-fill:var(--foreground)}@supports (color:color-mix(in lab, red, red)){:root,.dark,.light{--tip-fill:color-mix(in srgb, var(--foreground) 6%, var(--background))}}.light,:root:not(.dark){--tip-fill:#fff}.dark{--tip-fill:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark{--tip-fill:color-mix(in srgb, var(--foreground) 6%, var(--background))}}:root,.dark,.light{--topnav-fill:var(--control-fill);--topnav-shadow:var(--control-shadow)}.light,:root:not(.dark){--topnav-fill:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.light,:root:not(.dark){--topnav-fill:color-mix(in srgb, var(--foreground) 7%, #fff)}}.light,:root:not(.dark){--topnav-shadow:none}.dark{--topnav-fill:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark{--topnav-fill:color-mix(in oklab, var(--foreground) 8%, transparent)}}.dark{--topnav-shadow:inset 0 1px 0 0 var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark{--topnav-shadow:inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 6%, transparent)}}.light .raised.bg-background,:root:not(.dark) .raised.bg-background{box-shadow:0 0 0 1px var(--light-outline)}.dark .raised{--control-fill:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark .raised{--control-fill:color-mix(in oklab, var(--foreground) 8%, transparent)}}.dark .raised{--control-fill-hover:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark .raised{--control-fill-hover:color-mix(in oklab, var(--foreground) 12%, transparent)}}.dark .raised{--control-shadow:inset 0 1px 0 0 var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark .raised{--control-shadow:inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 6%, transparent)}}.dark .raised{--field-fill:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark .raised{--field-fill:color-mix(in oklab, var(--foreground) 3%, transparent)}}.dark .raised{--field-fill-hover:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark .raised{--field-fill-hover:color-mix(in oklab, var(--foreground) 5%, transparent)}}.dark .raised{--field-shadow:inset 0 1px 0 0 var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark .raised{--field-shadow:inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 4%, transparent)}}:root,.dark{--shadow-k:1}.light{--shadow-k:.35}@property --ai-angle{syntax:"<angle>";inherits:false;initial-value:0deg}.ai-rim{background:conic-gradient(from var(--ai-angle), #8a6878, #6f6890, #5c6d8a, #557466, #84775a, #8a6878);animation:4s linear infinite ai-rim-turn}@keyframes ai-rim-turn{to{--ai-angle:360deg}}@media (prefers-reduced-motion:reduce){.ai-rim{animation:none}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}</style> 265 <link rel="preload" as="style" crossorigin href="/assets/index-C_AozMT0.css" onload="this.onload=null;this.rel='stylesheet'"> 266 <noscript><link rel="stylesheet" crossorigin href="/assets/index-C_AozMT0.css"></noscript> 267 <link rel="canonical" href="https://ssicevs.com/pricing" /> 268
268<script type="application/ld+json"> 269{ 270 "@context": "https://schema.org", 271 "@type": "FAQPage", 272 "mainEntity": [ 273 { 274 "@type": "Question", 275 "name": "Where should I start?", 276 "acceptedAnswer": { 277 "@type": "Answer", 278 "text": "If youâre not sure what needs fixing, start with a product review. If the problem is already clear, we can go straight into a design project. If you need regular help, ongoing support makes more sense." 279 } 280 }, 281 { 282 "@type": "Question", 283 "name": "Whatâs included, and what isnât?", 284 "acceptedAnswer": { 285 "@type": "Answer", 286 "text": "I lead the design and can build an interactive front-end prototype. Your engineers own the production build. We agree which flows, revisions and implementation reviews are included before starting." 287 } 288 }, 289 { 290 "@type": "Question", 291 "name": "Can a project include a design sprint?", 292 "acceptedAnswer": { 293 "@type": "Answer", 294 "text": "Yes. If the direction is still unclear, we can use the first week or two to work through it before moving into interface design and prototyping." 295 } 296 }, 297 { 298 "@type": "Question", 299 "name": "How long does a project take?", 300 "acceptedAnswer": { 301 "@type": "Answer", 302 "text": "Most design projects take 2â6 weeks. A product review or sprint takes 1â2 weeks, while a larger UI or design system can take 3â6 weeks. I will give you an exact timeline before we start." 303 } 304 }, 305 { 306 "@type": "Question", 307 "name": "How does payment work?", 308 "acceptedAnswer": { 309 "@type": "Answer", 310 "text": "Fixed price, agreed on the call before any work starts. Half up front to book you in, the rest on delivery. Ongoing support is billed monthly." 311 } 312 }, 313 { 314 "@type": "Question", 315 "name": "What happens after the call?", 316 "acceptedAnswer": { 317 "@type": "Answer", 318 "text": "You get one price and a start date. If the work changes later, we agree on a new price together before I continue." 319 } 320 }, 321 { 322 "@type": "Question", 323 "name": "When can you start?", 324 "acceptedAnswer": { 325 "@type": "Answer", 326 "text": "Usually within a week or two, depending on whatâs already in flight. Iâll confirm the exact dates on the call." 327 } 328 }, 329 { 330 "@type": "Question", 331 "name": "Whoâs it for?", 332 "acceptedAnswer": { 333 "@type": "Answer", 334 "text": "Founders with a live trading, fintech or data-heavy product and an engineering team, who need someone to take care of the product design." 335 } 336 }, 337 { 338 "@type": "Question", 339 "name": "What if weâre not the right fit?", 340 "acceptedAnswer": { 341 "@type": "Answer", 342 "text": "Iâll tell you straight on the call. Better we both find that out in fifteen minutes than three weeks and an invoice later." 343 } 344 } 345 ] 346} 347 </script>
347 348
348<script type="application/ld+json"> 349{ 350 "@context": "https://schema.org", 351 "@type": "BreadcrumbList", 352 "itemListElement": [ 353 { 354 "@type": "ListItem", 355 "position": 1, 356 "name": "Home", 357 "item": "https://ssicevs.com/" 358 }, 359 { 360 "@type": "ListItem", 361 "position": 2, 362 "name": "Pricing", 363 "item": "https://ssicevs.com/pricing" 364 } 365 ] 366} 367 </script>
367 368</head> 369 <!-- theme-aware ground: the token once CSS is in (white in light), black until then so a 370 dark load never flashes white. A hard #000 here painted light mode black. --> 371 <body style="background:var(--background,#000)"> 372 <!-- Google Tag Manager (noscript) -->
vendor: 72 bytes, lines 372-373
372 373 <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=
373GTM-5QKTH5QZ
vendor: 91 bytes, lines 373-375
373" 374 height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> 375
375<!-- End Google Tag Manager (noscript) --> 376 <div id="root"><div class="relative min-h-screen"><div class="relative z-10"><div aria-hidden="true" class="pointer-events-none fixed inset-x-0 top-0 z-30 h-[104px] sm:h-[180px] transition-transform duration-300 ease-out "><div class="absolute inset-0 pointer-fine:backdrop-blur-[9px]" style="mask-image: linear-gradient(rgb(0, 0, 0) 0%, rgb(0, 0, 0) 38%, transparent 100%);"></div><div class="absolute inset-0 [--veil-end:62%] sm:[--veil-end:100%]" style="background: linear-gradient(to bottom, var(--background) 0%, var(--background) calc(var(--veil-end) * 0.1), color-mix(in oklab, var(--background) 82%, transparent) calc(var(--veil-end) * 0.4), color-mix(in oklab, var(--background) 45%, transparent) calc(var(--veil-end) * 0.68), transparent var(--veil-end));"></div></div><header id="nav" class="fixed inset-x-0 top-0 z-50 mx-auto flex max-w-[1440px] items-center justify-between px-5 py-4 sm:px-12 sm:py-7 transition-transform duration-300 ease-out "><div class="flex items-center gap-6"><a aria-label="ssych â home" class="shrink-0 transition-opacity hover:opacity-80" href="/" data-discover="true"><svg viewBox="0 0 160.708 138.796" fill="none" xmlns="http://www.w3.org/2000/svg" class="h-7 w-7 text-foreground sm:h-9 sm:w-9" aria-hidden="true"><path d="M115.056 43.7627H159.975L159.702 49.7383C159.048 64.0018 147.293 75.231 133.015 75.2314H132.283C132.035 75.2314 131.806 75.3619 131.68 75.5752C131.554 75.7884 131.55 76.0526 131.669 76.2695L142.834 96.5244C144.826 100.138 144.93 104.496 143.113 108.2L137.594 119.449C131.996 130.86 120.395 138.092 107.686 138.093L38.5439 138.095L60.5947 102.973H96.9062C99.0883 102.972 100.461 100.622 99.3926 98.7207L86.6006 75.9639L103.391 50.0986C105.955 46.1478 110.345 43.7627 115.056 43.7627ZM100.107 35.8242H63.7959C61.6139 35.8249 60.2416 38.1747 61.3105 40.0762L74.1045 62.8359L57.3193 88.6973C54.7546 92.6482 50.3628 95.0332 45.6523 95.0332H0.733398L1.00781 89.0566C1.66199 74.7932 13.4159 63.5657 27.6943 63.5654H28.4199C28.6676 63.5654 28.8965 63.434 29.0225 63.2207C29.1485 63.0074 29.1528 62.7434 29.0332 62.5264L17.8682 42.2715C15.8764 38.6581 15.7728 34.3001 17.5898 30.5957L17.5889 30.5947L23.1084 19.3477V19.3467C28.7061 7.93632 40.3082 0.703744 53.0176 0.703125L122.157 0.700195L100.107 35.8242Z" fill="currentColor"></path></svg></a><nav aria-label="Primary" class="hidden items-center gap-7 lg:flex"><div class="flex items-center"><a class="-my-3.5 py-3.5 font-display text-[15px] font-medium transition-colors text-foreground/55 hover:text-foreground" href="/" data-discover="true">Home</a></div><button type="button" aria-expanded="false" aria-haspopup="menu" class="flex cursor-pointer items-center gap-1.5 -my-3.5 py-3.5 font-display text-[15px] font-medium transition-colors text-foreground/55 hover:text-foreground ">About<svg viewBox="0 0 10 6" fill="none" aria-hidden="true" class="h-[9px] w-[9px] opacity-60 transition-transform duration-300 "><path d="M1 1l4 4 4-4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path></svg></button><button type="button" aria-expanded="false" aria-haspopup="menu" class="flex cursor-pointer items-center gap-1.5 -my-3.5 py-3.5 font-display text-[15px] font-medium transition-colors text-foreground/55 hover:text-foreground ">Projects<svg viewBox="0 0 10 6" fill="none" aria-hidden="true" class="h-[9px] w-[9px] opacity-60 transition-transform duration-300 "><path d="M1 1l4 4 4-4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path></svg></button><button type="button" aria-expanded="false" aria-haspopup="menu" class="flex cursor-pointer items-center gap-1.5 -my-3.5 py-3.5 font-display text-[15px] font-medium transition-colors text-foreground/55 hover:text-foreground ">Services<svg viewBox="0 0 10 6" fill="none" aria-hidden="true" class="h-[9px] w-[9px] opacity-60 transition-transform duration-300 "><path d="M1 1l4 4 4-4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path></svg></button><button type="button" aria-expanded="false" aria-haspopup="menu" class="flex cursor-pointer items-center gap-1.5 -my-3.5 py-3.5 font-display text-[15px] font-medium transition-colors text-foreground
376/55 hover:text-foreground ">UI Library<svg viewBox="0 0 10 6" fill="none" aria-hidden="true" class="h-[9px] w-[9px] opacity-60 transition-transform duration-300 "><path d="M1 1l4 4 4-4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path></svg></button></nav><div aria-hidden="true" class="fixed inset-0 -z-10 hidden bg-black/60 backdrop-blur-md lg:block pointer-events-none" style="opacity: 0; transition: opacity 0.15s cubic-bezier(0.4, 0, 0.2, 1);"></div><div class="dark fixed left-0 z-10 hidden overflow-hidden rounded-3xl border border-white/10 bg-black/60 backdrop-blur-xl lg:block pointer-events-none" style="top: 74px; width: 0px; height: 0px; transform: translateX(0px); opacity: 0; scale: 0.97; transform-origin: center top; transition: opacity 0.35s cubic-bezier(0.22, 1, 0.36, 1), scale 0.35s cubic-bezier(0.22, 1, 0.36, 1); will-change: width, height, transform;"><div class="absolute top-0 left-0 w-max" style="opacity: 0; pointer-events: none; transition: opacity 0.16s;"><div class="flex w-max flex-col p-3"><a class="flex w-[260px] flex-col gap-0.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/about" data-discover="true"><span class="font-display text-[13.5px] font-medium text-white">About</span><span class="text-[11.5px] text-white/40">Who I am and how I work</span></a><a class="flex w-[260px] flex-col gap-0.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/blog" data-discover="true"><span class="font-display text-[13.5px] font-medium text-white">Blog</span><span class="text-[11.5px] text-white/40">Essays on dashboards and AI products</span></a></div></div><div class="absolute top-0 left-0 w-max" style="opacity: 0; pointer-events: none; transition: opacity 0.16s;"><div class="flex w-max flex-col p-3"><div class="grid grid-cols-2 gap-x-1.5 gap-y-1"><a class="flex w-[220px] items-center gap-2.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/work/taomarketcap" data-discover="true"><img alt="" width="18" height="18" class="h-[18px] w-[18px] shrink-0 rounded-[5px]" src="/projects/icons/taomarketcap.webp"><span class="truncate font-display text-[13.5px] font-medium text-white">Taomarketcap</span></a><a class="flex w-[220px] items-center gap-2.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/work/celium" data-discover="true"><img alt="" width="18" height="18" class="h-[18px] w-[18px] shrink-0 rounded-[5px]" src="/projects/icons/celium.webp"><span class="truncate font-display text-[13.5px] font-medium text-white">Celium</span></a><a class="flex w-[220px] items-center gap-2.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/work/metanova" data-discover="true"><img alt="" width="18" height="18" class="h-[18px] w-[18px] shrink-0 rounded-[5px]" src="/projects/icons/metanova.webp"><span class="truncate font-display text-[13.5px] font-medium text-white">Metanova</span></a><a class="flex w-[220px] items-center gap-2.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/work/datura" data-discover="true"><img alt="" width="18" height="18" class="h-[18px] w-[18px] shrink-0 rounded-[5px]" src="/projects/icons/datura.webp"><span class="truncate font-display text-[13.5px] font-medium text-white">Datura AI</span></a><a class="flex w-[220px] items-center gap-2.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/work/rizzy" data-discover="true"><img alt="" width="18" height="18" class="h-[18px] w-[18px] shrink-0 rounded-[5px]" src="/projects/icons/rizzy.webp"><span class="truncate font-display text-[13.5px] font-medium text-white">Rizzy</span></a><a class="flex w-[220px] items-center gap-2.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/work/desearch" data-discover="true"><img alt="" width="18" height="18" class="h-[18px] w-[18px] shrink-0 rounded-[5px]" src="/projects/icons/desearch.webp"><span class="truncate font-display text-[13.5px] font-medium text-white">Desearch</span></a><a class="flex w-[220px] items-center gap-2.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/work
376/drippler" data-discover="true"><img alt="" width="18" height="18" class="h-[18px] w-[18px] shrink-0 rounded-[5px]" src="/projects/icons/drippler.webp"><span class="truncate font-display text-[13.5px] font-medium text-white">Drippler</span></a></div><a class="group/all mt-1.5 flex items-center gap-1.5 rounded-xl px-4 py-2.5 text-[12.5px] text-white/50 transition-colors hover:bg-white/[0.05] hover:text-white" href="/projects" data-discover="true">All projects<span aria-hidden="true" class="transition-transform duration-300 group-hover/all:translate-x-0.5">â</span></a></div></div><div class="absolute top-0 left-0 w-max" style="opacity: 0; pointer-events: none; transition: opacity 0.16s;"><div class="flex w-max flex-col p-3"><div class="grid grid-cols-2 gap-x-1.5 gap-y-1"><a class="flex w-[218px] flex-col gap-0.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/services/ux-audit-services" data-discover="true"><span class="font-display text-[13.5px] font-medium text-white">Product UX review</span><span class="text-[11.5px] text-white/40">Understand</span></a><a class="flex w-[218px] flex-col gap-0.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/services/design-sprint" data-discover="true"><span class="font-display text-[13.5px] font-medium text-white">Design sprints</span><span class="text-[11.5px] text-white/40">Decide</span></a><a class="flex w-[218px] flex-col gap-0.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/services/dashboard-design" data-discover="true"><span class="font-display text-[13.5px] font-medium text-white">Dashboard design</span><span class="text-[11.5px] text-white/40">Design</span></a><a class="flex w-[218px] flex-col gap-0.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/services/prototyping" data-discover="true"><span class="font-display text-[13.5px] font-medium text-white">Prototyping</span><span class="text-[11.5px] text-white/40">Validate</span></a><a class="flex w-[218px] flex-col gap-0.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/services/ui-design-system" data-discover="true"><span class="font-display text-[13.5px] font-medium text-white">Design systems</span><span class="text-[11.5px] text-white/40">Scale</span></a><a class="flex w-[218px] flex-col gap-0.5 rounded-xl px-4 py-3 transition-colors hover:bg-white/[0.05]" href="/services/dev-support-qa" data-discover="true"><span class="font-display text-[13.5px] font-medium text-white">Handoff & design QA</span><span class="text-[11.5px] text-white/40">Ship</span></a></div><a class="group/all mt-1.5 flex items-center gap-1.5 rounded-xl px-4 py-2.5 text-[12.5px] text-white/50 transition-colors hover:bg-white/[0.05] hover:text-white" href="/services" data-discover="true">All services<span aria-hidden="true" class="transition-transform duration-300 group-hover/all:translate-x-0.5">â</span></a><a class="group/all flex items-center gap-1.5 rounded-xl px-4 py-2.5 text-[12.5px] text-white/50 transition-colors hover:bg-white/[0.05] hover:text-white" href="/pricing" data-discover="true">Pricing<span aria-hidden="true" class="transition-transform duration-300 group-hover/all:translate-x-0.5">â</span></a></div></div><div class="absolute top-0 left-0 w-max" style="opacity: 0; pointer-events: none; transition: opacity 0.16s;"><div class="flex w-max flex-col p-3"><div class="flex items-end justify-between gap-10 px-2.5 pt-2.5 pb-4"><div class="flex flex-col gap-2.5"><svg viewBox="0 0 658.914 168.812" width="658.914" height="168.812" fill="none" xmlns="http://www.w3.org/2000/svg" class="h-[20px] w-auto shrink-0 self-start text-white" preserveAspectRatio="xMidYMid meet" role="img" aria-label="ssych ui"><g transform="translate(0 11.000) scale(0.28314)"><path d="M354.084 0C374.63 8.50833 392.5 23.8578 403.922 44.9326C418.809 72.4024 419.569 103.739 408.683 130.599C372.855 219 258.635 211.309 206.626 211.71C145.919 212.178 96.2825 259.131 91.5504 318.731C95.9969 371.278 140.054 412.539 193.751 412.539C250.399 412.539 296.322 366.615 296.322 309.967C296.322 285.118 287.485 262.333 272.784 244.583C323.926 247.005 407.022 268.509 437.287 366.686C413.233 460.456 328.149 529.763 226.877 529.764C175.525 529.764 128.335 511.943 91.1539 482.149C67.7037 480.784 45.3008 488.644 28.0719 502.979C-6.1077 470.701 -9.49672 415.736 20.2223 379.638C12.3178 355.271 9.66566 330.28 9.66566 304.795C9.6658 186.402 110.21 87.5845 226.877 87.584C253.145 87.584 278.167 88.1909 302.354 75.083C331.715 59.1705 349.967 30.7466 354.084 0Z" fill="currentColor"></path></g><g transform="translate(167.121 8)"><path d="M325.39 125.15V0H341.848V74.7472H337.734C337.734 65.7181 338.877 57.9462 341.162 51.4316C343.562 44.8026 347.22 39.7166 352.134 36.1735C357.049 32.6305 363.335 30.8589 370.993 30.8589H371.678C382.651 30.8589 390.937 34.5163 396.537 41.831C402.137 49.0314 404.938 59.3749 404.938 72.8614V125.15H388.479V69.4326C388.479 62.0036 386.365 56.2318 382.136 52.1173C378.022 48.0028 372.65 45.9455 366.021 45.9455C358.706 45.9455 352.82 48.4028 348.363 53.3174C344.02 58.1177 341.848 64.4609 341.848 72.3471V125.15H325.39Z" fill="currentColor"></path><path d="M276.835 128.238C268.948 128.238 262.091 126.867 256.262 124.124C250.547 121.381 245.804 117.723 242.033 113.152C238.261 108.466 235.404 103.323 233.461 97.7222C231.632 92.1219 230.718 86.5216 230.718 80.9213V77.8354C230.718 72.0065 231.632 66.2918 233.461 60.6915C235.404 55.0912 238.261 50.0623 242.033 45.6049C245.919 41.0332 250.719 37.3759 256.433 34.6329C262.148 31.8898 268.834 30.5183 276.492 30.5183C284.149 30.5183 291.007 31.947 297.064 34.8043C303.236 37.6616 308.151 41.719 311.808 46.9764C315.58 52.1196 317.694 58.2342 318.151 65.3204H302.379C301.579 59.6057 298.95 54.8626 294.493 51.091C290.035 47.205 284.035 45.262 276.492 45.262C269.977 45.262 264.548 46.7478 260.205 49.7194C255.862 52.691 252.605 56.7484 250.433 61.8916C248.262 67.0347 247.176 72.8637 247.176 79.3783C247.176 85.6644 248.262 91.4362 250.433 96.6936C252.605 101.837 255.862 105.951 260.205 109.037C264.663 112.009 270.206 113.495 276.835 113.495C281.978 113.495 286.435 112.58 290.207 110.752C293.979 108.923 297.
376007 106.466 299.293 103.38C301.579 100.294 302.95 96.8079 303.408 92.922H319.18C318.837 100.122 316.723 106.351 312.837 111.609C309.065 116.866 304.036 120.981 297.75 123.952C291.578 126.81 284.607 128.238 276.835 128.238Z" fill="currentColor"></path><path d="M157.184 160.812V146.068H170.385C174.271 146.068 177.528 145.554 180.157 144.525C182.9 143.611 185.129 142.011 186.843 139.725C188.672 137.439 190.158 134.41 191.301 130.638L220.102 33.6043H236.218L205.702 134.924C203.873 140.982 201.301 145.897 197.987 149.668C194.672 153.554 190.615 156.354 185.815 158.069C181.129 159.897 175.643 160.812 169.357 160.812H157.184ZM185.129 123.095V109.38H205.016V123.095H185.129ZM183.415 123.095L150.67 33.6043H167.471L198.844 123.095H183.415Z" fill="currentColor"></path><path d="M117.05 127.893C105.049 127.893 95.7345 125.322 89.1055 120.179C82.5908 115.036 79.2192 108.007 78.9906 99.0918H94.4201C94.6487 102.635 96.4202 106.007 99.7347 109.207C103.163 112.293 108.935 113.836 117.05 113.836C124.365 113.836 129.965 112.407 133.851 109.55C137.737 106.578 139.68 102.978 139.68 98.7489C139.68 94.9773 138.251 92.0628 135.394 90.0056C132.537 87.834 127.908 86.4054 121.507 85.7196L111.564 84.691C102.878 83.7766 95.7916 81.205 90.3056 76.9762C84.8195 72.6331 82.0765 66.5756 82.0765 58.8037C82.0765 52.9748 83.5623 48.0031 86.5339 43.8886C89.5055 39.6598 93.6201 36.4596 98.8775 34.288C104.135 32.0022 110.192 30.8593 117.05 30.8593C127.336 30.8593 135.68 33.1451 142.08 37.7168C148.48 42.2885 151.795 49.0889 152.023 58.118H136.594C136.48 54.4606 134.765 51.3748 131.451 48.8603C128.251 46.2316 123.45 44.9172 117.05 44.9172C110.65 44.9172 105.792 46.2316 102.478 48.8603C99.1632 51.489 97.506 54.8035 97.506 58.8037C97.506 62.2325 98.6489 64.9755 100.935 67.0328C103.335 69.0901 107.221 70.4044 112.593 70.9759L122.536 72.0045C132.365 73.0332 140.251 75.7762 146.195 80.2336C152.138 84.5767 155.109 90.7485 155.109 98.7489C155.109 104.464 153.452 109.55 150.138 114.007C146.937 118.35 142.48 121.779 136.765 124.293C131.051 126.693 124.479 127.893 117.05 127.893Z" fill="currentColor"></path><path d="M38.0594 127.893C26.0587 127.893 16.7438 125.322 10.1149 120.179C3.60021 115.036 0.228585 108.007 0 99.0918H15.4295C15.6581 102.635 17.4296 106.007 20.7441 109.207C24.1728 112.293 29.9446 113.836 38.0594 113.836C45.3741 113.836 50.9744 112.407 54.8603 109.55C58.7463 106.578 60.6892 102.978 60.6892 98.7489C60.6892 94.9773 59.2606 92.0628 56.4033 90.0056C53.546 87.834 48.9171 86.4054 42.5168 85.7196L32.5733 84.691C23.8871 83.7766 16.801 81.205 11.3149 76.9762C5.82891 72.6331 3.08589 66.5756 3.08589 58.8037C3.08589 52.9748 4.57169 48.0031 7.54329 43.8886C10.5149 39.6598 14.6294 36.4596 19.8869 34.288C25.1443 32.0022 31.2018 30.8593 38.0594 30.8593C48.3457 30.8593 56.689 33.1451 63.0894 37.7168C69.4897 42.2885 72.8042 49.0889 73.0328 58.118H57.6033C57.489 54.4606 55.7747 51.3748 52.4602 48.8603C49.26 46.2316 44.4597 44.9172 38.0594 44.9172C31.659 44.9172 26.8016 46.2316 23.4871 48.8603C20.1726 51.489 18.5154 54.8035 18.5154 58.8037C18.5154 62.2325 19.6583 64.9755 21.9441 67.0328C24.3443 69.0901 28.2302 70.4044 33.602 70.9759L43.5454 72.0045C53.3745 73.0332 61.2607 75.7762 67.2039 80.2336C73.1471 84.5767 76.1187 90.7485 76.1187 98.7489C76.1187 104.464 74.4615 109.55 71.147 114.007C67.9468 118.35 63.4894 121.779 57.7748 124.293C52.0602 126.693 45.4884 127.893 38.0594 127.893Z" fill="currentColor"></path></g><text x="587.914" y="50" fill="currentColor" font-family="Sora, sans-serif" font-weight="700" font-size="65" letter-spacing="-1.95">UI</text></svg><p class="max-w-[360px] text-[12.5px] leading-[1.5] text-white/55">Expressive landing components + data-dense dashboard primitives, one click from your project.</p></div><a href="https://ui.ssych.com/library/installation" target="_blank" rel="noreferrer" class="group/all inline-flex h-9 shrink-0 items-center gap-1.5 rounded-[12px] border border-white/[0.08] px-3.5 text-[13px] font-medium text-white/90 transition-colors hover:border-white/20 hover:text-white">Open the library<span aria-hidden="true" class="transition-transform duration-300 group-hover/all:translate-x-0.5">â</span></a></div><div class="flex gap-1"><a href="https://ui.ssych.com/library/components" target="_blank" rel="noreferrer" class="group/box flex w-[236px] flex-col gap-2.5 rounded-[14px] p-1.5 transition-colors hover:bg-white/[0.03]" style="transition-duration: var(--duration-slow, 400ms);"><div class="relative aspect-[16/10] w-full overflow-hidden rounded-[10px] bg-black transition-colors border border-white/[0.06] group-hover/box:border-white/[0.14]" style="transition-duration: var(--duration-slow, 400ms);"></div><span class="flex items-center justify-between px-1 pb-0.5 font-display text-[13.5px] font-medium text-white/90 transition-colors group-hover/box:text-white">Components<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 256 256" aria-hidden="true" class="h-3.5 w-3.5 -translate-x-0.5 translate-y-0.5 opacity-0 transition-[opacity,translate] group-hover/box:translate-x-0 group-hover/box:translate-y-0 group-hover/box:opacity-70" style="transition-duration: var(--duration-slow, 400ms); transition-timing-function: var(--ease-smooth-out, cubic-bezier(0.22, 1, 0.36, 1));">
376<path d="M204,64V168a12,12,0,0,1-24,0V93L72.49,200.49a12,12,0,0,1-17-17L163,76H88a12,12,0,0,1,0-24H192A12,12,0,0,1,204,64Z"></path></svg></span></a><a href="https://ui.ssych.com/library/dashboards" target="_blank" rel="noreferrer" class="group/box flex w-[236px] flex-col gap-2.5 rounded-[14px] p-1.5 transition-colors hover:bg-white/[0.03]" style="transition-duration: var(--duration-slow, 400ms);"><div class="relative aspect-[16/10] w-full overflow-hidden rounded-[10px] bg-black transition-colors border border-white/[0.06] group-hover/box:border-white/[0.14]" style="transition-duration: var(--duration-slow, 400ms);"></div><span class="flex items-center justify-between px-1 pb-0.5 font-display text-[13.5px] font-medium text-white/90 transition-colors group-hover/box:text-white">Dashboards<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 256 256" aria-hidden="true" class="h-3.5 w-3.5 -translate-x-0.5 translate-y-0.5 opacity-0 transition-[opacity,translate] group-hover/box:translate-x-0 group-hover/box:translate-y-0 group-hover/box:opacity-70" style="transition-duration: var(--duration-slow, 400ms); transition-timing-function: var(--ease-smooth-out, cubic-bezier(0.22, 1, 0.36, 1));"><path d="M204,64V168a12,12,0,0,1-24,0V93L72.49,200.49a12,12,0,0,1-17-17L163,76H88a12,12,0,0,1,0-24H192A12,12,0,0,1,204,64Z"></path></svg></span></a><a href="https://ui.ssych.com/library/landing-pages" target="_blank" rel="noreferrer" class="group/box flex w-[236px] flex-col gap-2.5 rounded-[14px] p-1.5 transition-colors hover:bg-white/[0.03]" style="transition-duration: var(--duration-slow, 400ms);"><div class="relative aspect-[16/10] w-full overflow-hidden rounded-[10px] bg-black transition-colors border border-white/[0.06] group-hover/box:border-white/[0.14]" style="transition-duration: var(--duration-slow, 400ms);"></div><span class="flex items-center justify-between px-1 pb-0.5 font-display text-[13.5px] font-medium text-white/90 transition-colors group-hover/box:text-white">Landing pages<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 256 256" aria-hidden="true" class="h-3.5 w-3.5 -translate-x-0.5 translate-y-0.5 opacity-0 transition-[opacity,translate] group-hover/box:translate-x-0 group-hover/box:translate-y-0 group-hover/box:opacity-70" style="transition-duration: var(--duration-slow, 400ms); transition-timing-function: var(--ease-smooth-out, cubic-bezier(0.22, 1, 0.36, 1));"><path d="M204,64V168a12,12,0,0,1-24,0V93L72.49,200.49a12,12,0,0,1-17-17L163,76H88a12,12,0,0,1,0-24H192A12,12,0,0,1,204,64Z"></path></svg></span></a></div></div></div></div></div><div class="flex items-center gap-5 sm:gap-6"><div class="group/cta hidden items-center lg:flex"><div class="pointer-events-none mr-5 translate-x-2 whitespace-nowrap opacity-0 transition-[opacity,transform] duration-(--duration-fast) ease-(--ease-smooth-out) group-hover/cta:translate-x-0 group-hover/cta:opacity-100"><span class="hidden items-center gap-2 font-display text-sm font-medium text-foreground sm:flex"><span class="tabular-nums">11:56 AM</span><span class="text-muted-foreground">/ My time</span></span></div><a aria-label="Book a 15-min call" class="group relative overflow-hidden inline-flex items-center gap-2 rounded-full px-5 py-2.5 text-[15px] font-semibold transition-[background-color,border-color,box-shadow,filter] duration-300 text-background bg-[linear-gradient(to_top,#e2e4ec_0px,#e9ebf1_3px,#f3f4f8_7px,#fafbfc_12px,#ffffff_20px)] light:bg-[linear-gradient(to_top,#0e0e14_0px,#13131a_3px,#1a1a21_7px,#1f1f26_12px,#232329_20px)] " href="/contact" data-discover="true"><span aria-hidden="true" class="pointer-events-none absolute inset-x-0 bottom-0 h-[34px] opacity-0 transition-opacity duration-300 group-hover:opacity-100 bg-[linear-gradient(to_top,rgba(0,0,0,0.17)_0px,rgba(0,0,0,0.12)_5px,rgba(0,0,0,0.07)_11px,rgba(0,0,0,0.03)_19px,rgba(0,0,0,0.01)_27px,rgba(0,0,0,0)_34px)] light:bg-[linear-gradient(to_top,rgba(0,0,0,0.5)_0px,rgba(0,0,0,0.34)_5px,rgba(0,0,0,0.19)_11px,rgba(0,0,0,0.08)_19px,rgba(0,0,0,0.02)_27px,rgba(0,0,0,0)_34px)]"></span><span aria-hidden="true" class="pointer-events-none absolute inset-x-0 bottom-0 h-[16px] bg-[linear-gradient(to_top,rgba(255,255,255,0.95)_0px,rgba(255,255,255,0.4)_2px,rgba(255,255,255,0.1)_6px,rgba(255,255,255,0)_16px)] light:bg-[linear-gradient(to_top,rgba(255,255,255,0.42)_0px,rgba(255,255,255,0.18)_2px,rgba(255,255,255,0.04)_6px,rgba(255,255,255,0)_16px)]"></span><span aria-hidden="true" class="pointer-events-none absolute inset-0 rounded-full border-b border-white/90 transition-colors duration-300 group-hover:border-white light:border-white/45 light:group-hover:border-white/80"></span>Book a 15-min call<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 256 256" class="h-4 w-4 transition-transform duration-300 group-hover:translate-x-0.5"><path d="M224.49,136.49l-72,72a12,12,0,0,1-17-17L187,140H40a12,12,0,0,1,0-24H187L135.51,64.48a12,12,0,0,1,17-17l72,72A12,12,0,0,1,224.49,136.49Z"></path></svg></a></div><button aria-label="Switch to light mode" class="hidden lg:flex cursor-pointer items-center text-foreground
376/55 transition-colors hover:text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 256 256" class="h-5 w-5"><path d="M120,40V16a8,8,0,0,1,16,0V40a8,8,0,0,1-16,0Zm72,88a64,64,0,1,1-64-64A64.07,64.07,0,0,1,192,128Zm-16,0a48,48,0,1,0-48,48A48.05,48.05,0,0,0,176,128ZM58.34,69.66A8,8,0,0,0,69.66,58.34l-16-16A8,8,0,0,0,42.34,53.66Zm0,116.68-16,16a8,8,0,0,0,11.32,11.32l16-16a8,8,0,0,0-11.32-11.32ZM192,72a8,8,0,0,0,5.66-2.34l16-16a8,8,0,0,0-11.32-11.32l-16,16A8,8,0,0,0,192,72Zm5.66,114.34a8,8,0,0,0-11.32,11.32l16,16a8,8,0,0,0,11.32-11.32ZM48,128a8,8,0,0,0-8-8H16a8,8,0,0,0,0,16H40A8,8,0,0,0,48,128Zm80,80a8,8,0,0,0-8,8v24a8,8,0,0,0,16,0V216A8,8,0,0,0,128,208Zm112-88H216a8,8,0,0,0,0,16h24a8,8,0,0,0,0-16Z"></path></svg></button><button aria-label="Open menu" class="relative z-50 flex items-center gap-2 font-display text-lg font-medium tracking-wide text-foreground lg:hidden"><svg width="21" height="21" viewBox="0 0 24 24" fill="none"><path d="M4 5.5h16M4 12h16M4 18.5h16" stroke="currentColor" stroke-width="2" stroke-linecap="round"></path></svg>Menu</button></div></header><main class="mx-auto max-w-[1440px] px-5 pt-32 sm:px-12 md:pt-40"><div class="text-center" style="opacity: 1; transform: none;"><h1 class="display-mid mx-auto max-w-[16ch] text-4xl sm:text-5xl md:text-[58px] md:leading-[1.04]" style="text-shadow: var(--hero-shadow);"><span class="relative block" style="display: flow-root;"><span aria-hidden="true" class="pointer-events-none absolute inset-x-0 top-0 select-none" style="bottom: -0.12em; background-image: var(--chrome-rim); background-clip: text; -webkit-text-fill-color: transparent; color: transparent; -webkit-text-stroke: var(--chrome-rim-w) transparent;">Three ways to work with me.</span><span class="relative block" style="background-image: var(--chrome-face); background-clip: text; -webkit-text-fill-color: transparent; color: transparent; padding-bottom: 0.12em; margin-bottom: -0.12em;">Three ways to work with me.</span></span></h1><p class="mx-auto mt-6 max-w-xl text-lg leading-[1.45] font-medium text-muted">We agree on the scope, price and timing before I start.</p></div><div class="mt-16 flex flex-wrap items-start justify-center gap-6 md:mt-20"><a class="group relative block w-[248px] pb-12" aria-label="Product review: book a call about this plan" href="/contact?plan=audit" data-discover="true" style="perspective: 1000px;"><div class="relative transition-transform duration-150 ease-out will-change-transform"><div class="absolute -right-[6px] top-8 z-10 flex flex-col items-end"><div class="rounded-l-[6px] py-[2px] pl-[2px] shadow-[-1px_3px_4px_rgba(0,0,0,0.24)] bg-accent-300"><div class="rounded-l-[4px] border border-r-0 border-dashed border-[rgba(10,20,40,0.45)] py-1 pl-2 pr-3 shadow-[inset_-2px_0.5px_0_color-mix(in_srgb,var(--foreground)_18%,transparent)]"><span class="font-display text-[11px] font-bold tracking-[0.02em] text-[#08203c]">1â2 WEEKS</span></div></div><span aria-hidden="true" class="h-[6px] w-[6px]" style="clip-path: polygon(0px 0px, 100% 0p
376x, 0px 100%); background: rgb(29, 68, 112);"></span></div><div class="relative flex h-[340px] flex-col items-center overflow-hidden py-6" style="border-radius: 36px; background-image: linear-gradient(118deg, var(--ticket-sheen) 0%, transparent 34%), linear-gradient(300deg, var(--ticket-sheen-2) 0%, transparent 40%), linear-gradient(158deg, var(--ticket-from) 6%, var(--ticket-to) 98%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 4.5%, transparent), inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 3.5%, transparent);"><div class="relative flex h-[72%] flex-col items-center justify-center gap-5 px-7 pt-6"><div class="flex items-start justify-center gap-[2px]" style="color: var(--price-ink); text-shadow: var(--price-emboss);"><span class="font-display text-[26px] font-bold tracking-[-1px]">$</span><span class="font-display text-[72px] font-semibold leading-none">1k</span></div><div class="flex flex-col items-center gap-1.5"><span class="font-display text-[13px] font-semibold text-foreground/85">Product review</span><p class="text-center text-[12px] leading-[1.4] text-foreground/45 transition-colors duration-300 group-hover:text-foreground/60">Find whatâs making the product hard to use and what to fix first.</p></div></div><div class="absolute inset-x-0 top-[72%]"><div class="relative mx-2"><div class="h-[6px]" style="background-image: repeating-linear-gradient(90deg, var(--punch-lip) 0 6px, transparent 6px 12px), repeating-linear-gradient(90deg, var(--punch-ink) 0 6px, transparent 6px 12px); background-position: 0px 3.5px, 0px 1.5px; background-size: 12px 1px, 12px 3px; background-repeat: repeat-x, repeat-x;"></div></div><span class="absolute top-1/2 -left-[5px] h-[10px] w-[10px] -translate-y-1/2 rounded-full" style="background: var(--ticket-page, var(--background));"></span><span class="absolute top-1/2 -right-[5px] h-[10px] w-[10px] -translate-y-1/2 rounded-full" style="background: var(--ticket-page, var(--background));"></span></div><div class="relative flex h-[28%] w-full items-end justify-center pb-3"><div class="flex items-center gap-1.5"><span class="text-[10px] font-medium uppercase tracking-[0.09em] text-foreground/45">from</span><span class="font-display text-[15px] font-semibold tabular-nums text-foreground">$1,000</span></div></div></div></div><span class="absolute bottom-4 left-1/2 flex -translate-x-1/2 items-center gap-1.5 whitespace-nowrap font-display text-[13px] font-semibold transition-all duration-300 ease-out translate-y-1 text-foreground opacity-0 group-hover:translate-y-0 group-hover:opacity-100 hover:text-foreground/75 [@media(hover:none)]:translate-y-0 [@media(hover:none)]:opacity-100">Book a call<span aria-hidden="true" class="transition-transform duration-300 group-hover:translate-x-0.5">â</span></span></a><a class="group relative block w-[248px] pb-12" aria-label="Design project: book a call about this plan" href="/contact?plan=engagement" data-discover="true" style="perspective: 1000px;"><div class="relative transition-transform duration-150 ease-out will-change-transform"><div class="absolute -right-[6px] top-8 z-10 flex flex-col items-end"><div class="rounded-l-[6px] py-[2px] pl-[2px] shadow-[-1px_3px_4px_rgba(0,0,0,0.24)] bg-accent-300"><div class="rounded-l-[4px] border border-r-0 border-dashed border-[rgba(10,20,40,0.45)] py-1 pl-2 pr-3 shadow-[inset_-2px_0.5px_0_color-mix(in_srgb,var(--foreground)_18%,transparent)]"><span class="font-display text-[11px] font-bold tracking-[0.02em] text-[#08203c]">2â6 WEEKS</span></div></div><span aria-hidden="true" class="h-[6px] w-[6px]" style="clip-path: polygon(0px 0px, 100% 0p
376x, 0px 100%); background: rgb(29, 68, 112);"></span></div><div class="relative flex h-[340px] flex-col items-center overflow-hidden py-6" style="border-radius: 36px; background-image: linear-gradient(118deg, var(--ticket-sheen) 0%, transparent 34%), linear-gradient(300deg, var(--ticket-sheen-2) 0%, transparent 40%), linear-gradient(158deg, var(--ticket-from) 6%, var(--ticket-to) 98%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 4.5%, transparent), inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 3.5%, transparent);"><div class="relative flex h-[72%] flex-col items-center justify-center gap-5 px-7 pt-6"><div class="flex items-start justify-center gap-[2px]" style="color: var(--price-ink); text-shadow: var(--price-emboss);"><span class="font-display text-[26px] font-bold tracking-[-1px]">$</span><span class="font-display text-[72px] font-semibold leading-none">3k</span></div><div class="flex flex-col items-center gap-1.5"><span class="font-display text-[13px] font-semibold text-foreground/85">Design project</span><p class="text-center text-[12px] leading-[1.4] text-foreground/45 transition-colors duration-300 group-hover:text-foreground/60">Redesign one important workflow, with a prototype and support through handoff.</p></div></div><div class="absolute inset-x-0 top-[72%]"><div class="relative mx-2"><div class="h-[6px]" style="background-image: repeating-linear-gradient(90deg, var(--punch-lip) 0 6px, transparent 6px 12px), repeating-linear-gradient(90deg, var(--punch-ink) 0 6px, transparent 6px 12px); background-position: 0px 3.5px, 0px 1.5px; background-size: 12px 1px, 12px 3px; background-repeat: repeat-x, repeat-x;"></div></div><span class="absolute top-1/2 -left-[5px] h-[10px] w-[10px] -translate-y-1/2 rounded-full" style="background: var(--ticket-page, var(--background));"></span><span class="absolute top-1/2 -right-[5px] h-[10px] w-[10px] -translate-y-1/2 rounded-full" style="background: var(--ticket-page, var(--background));"></span></div><div class="relative flex h-[28%] w-full items-end justify-center pb-3"><div class="flex items-center gap-1.5"><span class="text-[10px] font-medium uppercase tracking-[0.09em] text-foreground/45">from</span><span class="font-display text-[15px] font-semibold tabular-nums text-foreground">$3,000</span></div></div></div></div><span class="absolute bottom-4 left-1/2 flex -translate-x-1/2 items-center gap-1.5 whitespace-nowrap font-display text-[13px] font-semibold transition-all duration-300 ease-out translate-y-1 text-foreground opacity-0 group-hover:translate-y-0 group-hover:opacity-100 hover:text-foreground/75 [@media(hover:none)]:translate-y-0 [@media(hover:none)]:opacity-100">Book a call<span aria-hidden="true" class="transition-transform duration-300 group-hover:translate-x-0.5">â</span></span></a><a class="group relative block w-[248px] pb-12" aria-label="Ongoing support: book a call about this plan" href="/contact?plan=partner" data-discover="true" style="perspective: 1000px;"><div class="relative transition-transform duration-150 ease-out will-change-transform"><div class="absolute -right-[6px] top-8 z-10 flex flex-col items-end"><div class="rounded-l-[6px] py-[2px] pl-[2px] shadow-[-1px_3px_4px_rgba(0,0,0,0.24)] bg-accent-300"><div class="rounded-l-[4px] border border-r-0 border-dashed border-[rgba(10,20,40,0.45)] py-1 pl-2 pr-3 shadow-[inset_-2px_0.5px_0_color-mix(in_srgb,var(--foreground)_18%,transparent)]"><span class="font-display text-[11px] font-bold tracking-[0.02em] text-[#08203c]">
376MONTHLY</span></div></div><span aria-hidden="true" class="h-[6px] w-[6px]" style="clip-path: polygon(0px 0px, 100% 0px, 0px 100%); background: rgb(29, 68, 112);"></span></div><div class="relative flex h-[340px] flex-col items-center overflow-hidden py-6" style="border-radius: 36px; background-image: linear-gradient(118deg, var(--ticket-sheen) 0%, transparent 34%), linear-gradient(300deg, var(--ticket-sheen-2) 0%, transparent 40%), linear-gradient(158deg, var(--ticket-from) 6%, var(--ticket-to) 98%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 4.5%, transparent), inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 3.5%, transparent);"><div class="relative flex h-[72%] flex-col items-center justify-center gap-5 px-7 pt-6"><div class="flex items-start justify-center gap-[2px]" style="color: var(--price-ink); text-shadow: var(--price-emboss);"><span class="font-display text-[26px] font-bold tracking-[-1px]">$</span><span class="font-display text-[72px] font-semibold leading-none">5k</span></div><div class="flex flex-col items-center gap-1.5"><span class="font-display text-[13px] font-semibold text-foreground/85">Ongoing support</span><p class="text-center text-[12px] leading-[1.4] text-foreground/45 transition-colors duration-300 group-hover:text-foreground/60">Work with me on the productâs design as your team keeps shipping.</p></div></div><div class="absolute inset-x-0 top-[72%]"><div class="relative mx-2"><div class="h-[6px]" style="background-image: repeating-linear-gradient(90deg, var(--punch-lip) 0 6px, transparent 6px 12px), repeating-linear-gradient(90deg, var(--punch-ink) 0 6px, transparent 6px 12px); background-position: 0px 3.5px, 0px 1.5px; background-size: 12px 1px, 12px 3px; background-repeat: repeat-x, repeat-x;"></div></div><span class="absolute top-1/2 -left-[5px] h-[10px] w-[10px] -translate-y-1/2 rounded-full" style="background: var(--ticket-page, var(--background));"></span><span class="absolute top-1/2 -right-[5px] h-[10px] w-[10px] -translate-y-1/2 rounded-full" style="background: var(--ticket-page, var(--background));"></span></div><div class="relative flex h-[28%] w-full items-end justify-center pb-3"><div class="flex items-center gap-1.5"><span class="text-[10px] font-medium uppercase tracking-[0.09em] text-foreground/45">from</span><span class="font-display text-[15px] font-semibold tabular-nums text-foreground">$5,000 / month</span></div></div></div></div><span class="absolute bottom-4 left-1/2 flex -translate-x-1/2 items-center gap-1.5 whitespace-nowrap font-display text-[13px] font-semibold transition-all duration-300 ease-out translate-y-1 text-foreground opacity-0 group-hover:translate-y-0 group-hover:opacity-100 hover:text-foreground/75 [@media(hover:none)]:translate-y-0 [@media(hover:none)]:opacity-100">Book a call<span aria-hidden="true" class="transition-transform duration-300 group-hover:translate-x-0.5">â</span></span></a></div><div class="mt-40 pb-8 md:mt-52 md:pb-12"><section class="mx-auto w-full max-w-[792px]"><div class="text-center"><h2 class="display-mid text-3xl text-foreground sm:text-4xl" style="text-shadow: var(--hero-shadow);"><span class="relative block" style="display: flow-root;"><span aria-hidden="true" class="pointer-events-none absolute inset-x-0 top-0 select-none" style="bottom: -0.12em; background-image: var(--chrome-rim); background-clip: text; -webkit-text-fill-color: transparent; color: transparent; -webkit-text-stroke: var(--chrome-rim-w) transparent;">Before you book</span><span class="relative block" style="background-image: var(--chrome-face); background-clip: text; -webkit-text-fill-color: transparent; color: transparent; padding-bottom: 0.12em; margin-bottom: -0.12em;">Before you book</span></span></h2><p class="mx-auto mt-5 max-w-md text-[15px] leading-[1.5] font-medium text-foreground/55">The stuff the call would cover anyway, in case you want it up front.</p></div><div class="mt-10 flex flex-col gap-3"><div class="overflow-hidden rounded-2xl" style="background-image: linear-gradient(158deg, var(--plate-from, #131315) 6%, var(--plate-to, #0b0b0d) 98%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 4.5%, transparent), inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 3.5%, transparent);"><button type="button" aria-expanded="true" class="flex w-full items-center justify-between gap-5 px-6 py-5 text-left"><span class="font-display text-[16px] font-semibold text-foreground">Where should I start?</span><svg width="18" height="18" viewBox="0 0 24 24" class="shrink-0 text-foreground
376/50 transition-transform duration-300 rotate-180" aria-hidden="true"><path d="M6 9l6 6 6-6" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><div class="grid transition-all duration-300 ease-out grid-rows-[1fr] opacity-100"><div class="overflow-hidden"><p class="px-6 pb-6 text-[15px] leading-[1.55] font-medium text-foreground/55">If youâre not sure what needs fixing, start with a product review. If the problem is already clear, we can go straight into a design project. If you need regular help, ongoing support makes more sense.</p></div></div></div><div class="overflow-hidden rounded-2xl" style="background-image: linear-gradient(158deg, var(--plate-from, #131315) 6%, var(--plate-to, #0b0b0d) 98%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 4.5%, transparent), inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 3.5%, transparent);"><button type="button" aria-expanded="false" class="flex w-full items-center justify-between gap-5 px-6 py-5 text-left"><span class="font-display text-[16px] font-semibold text-foreground">Whatâs included, and what isnât?</span><svg width="18" height="18" viewBox="0 0 24 24" class="shrink-0 text-foreground/50 transition-transform duration-300 " aria-hidden="true"><path d="M6 9l6 6 6-6" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><div class="grid transition-all duration-300 ease-out grid-rows-[0fr] opacity-0"><div class="overflow-hidden"><p class="px-6 pb-6 text-[15px] leading-[1.55] font-medium text-foreground/55">I lead the design and can build an interactive front-end prototype. Your engineers own the production build. We agree which flows, revisions and implementation reviews are included before starting.</p></div></div></div><div class="overflow-hidden rounded-2xl" style="background-image: linear-gradient(158deg, var(--plate-from, #131315) 6%, var(--plate-to, #0b0b0d) 98%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 4.5%, transparent), inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 3.5%, transparent);"><button type="button" aria-expanded="false" class="flex w-full items-center justify-between gap-5 px-6 py-5 text-left"><span class="font-display text-[16px] font-semibold text-foreground">Can a project include a design sprint?</span><svg width="18" height="18" viewBox="0 0 24 24" class="shrink-0 text-foreground/50 transition-transform duration-300 " aria-hidden="true"><path d="M6 9l6 6 6-6" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><div class="grid transition-all duration-300 ease-out grid-rows-[0fr] opacity-0"><div class="overflow-hidden"><p class="px-6 pb-6 text-[15px] leading-[1.55] font-medium text-foreground/55">Yes. If the direction is still unclear, we can use the first week or two to work through it before moving into interface design and prototyping.</p></div></div></div><div class="overflow-hidden rounded-2xl" style="background-image: linear-gradient(158deg, var(--plate-from, #131315) 6%, var(--plate-to, #0b0b0d) 98%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 4.5%, transparent), inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 3.5%, transparent);"><button type="button" aria-expanded="false" class="flex w-full items-center justify-between gap-5 px-6 py-5 text-left"><span class="font-display text-[16px] font-semibold text-foreground">How long does a project take?</span><svg width="18" height="18" viewBox="0 0 24 24" class="shrink-0 text-foreground/50 transition-transform duration-300 " aria-hidden="true"><path d="M6 9l6 6 6-6" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><div class="grid transition-all duration-300 ease-out grid-rows-[0fr] opacity-0"><div class="overflow-hidden"><p class="px-6 pb-6 text-[15px] leading-[1.55] font-medium text-foreground/55">Most design projects take 2â6 weeks. A product review or sprint takes 1â2 weeks, while a larger UI or design system can take 3â6 weeks. I will give you an exact timeline before we start.</p></div></div></div><div class="overflow-hidden rounded-2xl" style="background-image: linear-gradient(158deg, var(--plate-from, #131315) 6%, var(--plate-to, #0b0b0d) 98%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 4.5%, transparent), inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 3.5%, transparent);"><button type="button" aria-expanded="false" class="flex w-full items-center justify-between gap-5 px-6 py-5 text-left"><span class="font-display text-[16px] font-semibold text-foreground">
376How does payment work?</span><svg width="18" height="18" viewBox="0 0 24 24" class="shrink-0 text-foreground/50 transition-transform duration-300 " aria-hidden="true"><path d="M6 9l6 6 6-6" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><div class="grid transition-all duration-300 ease-out grid-rows-[0fr] opacity-0"><div class="overflow-hidden"><p class="px-6 pb-6 text-[15px] leading-[1.55] font-medium text-foreground/55">Fixed price, agreed on the call before any work starts. Half up front to book you in, the rest on delivery. Ongoing support is billed monthly.</p></div></div></div><div class="overflow-hidden rounded-2xl" style="background-image: linear-gradient(158deg, var(--plate-from, #131315) 6%, var(--plate-to, #0b0b0d) 98%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 4.5%, transparent), inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 3.5%, transparent);"><button type="button" aria-expanded="false" class="flex w-full items-center justify-between gap-5 px-6 py-5 text-left"><span class="font-display text-[16px] font-semibold text-foreground">What happens after the call?</span><svg width="18" height="18" viewBox="0 0 24 24" class="shrink-0 text-foreground/50 transition-transform duration-300 " aria-hidden="true"><path d="M6 9l6 6 6-6" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><div class="grid transition-all duration-300 ease-out grid-rows-[0fr] opacity-0"><div class="overflow-hidden"><p class="px-6 pb-6 text-[15px] leading-[1.55] font-medium text-foreground/55">You get one price and a start date. If the work changes later, we agree on a new price together before I continue.</p></div></div></div><div class="overflow-hidden rounded-2xl" style="background-image: linear-gradient(158deg, var(--plate-from, #131315) 6%, var(--plate-to, #0b0b0d) 98%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 4.5%, transparent), inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 3.5%, transparent);"><button type="button" aria-expanded="false" class="flex w-full items-center justify-between gap-5 px-6 py-5 text-left"><span class="font-display text-[16px] font-semibold text-foreground">When can you start?</span><svg width="18" height="18" viewBox="0 0 24 24" class="shrink-0 text-foreground/50 transition-transform duration-300 " aria-hidden="true"><path d="M6 9l6 6 6-6" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><div class="grid transition-all duration-300 ease-out grid-rows-[0fr] opacity-0"><div class="overflow-hidden"><p class="px-6 pb-6 text-[15px] leading-[1.55] font-medium text-foreground/55">Usually within a week or two, depending on whatâs already in flight. Iâll confirm the exact dates on the call.</p></div></div></div><div class="overflow-hidden rounded-2xl" style="background-image: linear-gradient(158deg, var(--plate-from, #131315) 6%, var(--plate-to, #0b0b0d) 98%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 4.5%, transparent), inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 3.5%, transparent);"><button type="button" aria-expanded="false" class="flex w-full items-center justify-between gap-5 px-6 py-5 text-left"><span class="font-display text-[16px] font-semibold text-foreground">Whoâs it for?</span><svg width="18" height="18" viewBox="0 0 24 24" class="shrink-0 text-foreground/50 transition-transform duration-300 " aria-hidden="true"><path d="M6 9l6 6 6-6" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><div class="grid transition-all duration-300 ease-out grid-rows-[0fr] opacity-0"><div class="overflow-hidden"><p class="px-6 pb-6 text-[15px] leading-[1.55] font-medium text-foreground/55">Founders with a live trading, fintech or data-heavy product and an engineering team, who need someone to take care of the product design.</p></div></div></div><div class="overflow-hidden rounded-2xl" style="background-image: linear-gradient(158deg, var(--plate-from, #131315) 6%, var(--plate-to, #0b0b0d) 98%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 4.5%, transparent), inset 0 1px 0 0 color-mix(in srgb, var(--foreground) 3.5%, transparent);"><button type="button" aria-expanded="false" class="flex w-full items-center justify-between gap-5 px-6 py-5 text-left"><span class="font-display text-[16px] font-semibold text-foreground">What if weâre not the right fit?</span><svg width="18" height="18" viewBox="0 0 24 24" class="shrink-0 text-foreground
376/50 transition-transform duration-300 " aria-hidden="true"><path d="M6 9l6 6 6-6" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><div class="grid transition-all duration-300 ease-out grid-rows-[0fr] opacity-0"><div class="overflow-hidden"><p class="px-6 pb-6 text-[15px] leading-[1.55] font-medium text-foreground/55">Iâll tell you straight on the call. Better we both find that out in fifteen minutes than three weeks and an invoice later.</p></div></div></div></div></section></div></main><footer class="relative w-full overflow-hidden" aria-label="Site footer"><div class="relative z-10 mx-auto w-full max-w-[1440px] px-5 sm:px-12"><div class="grid grid-cols-1 gap-10 pb-14 sm:grid-cols-2 md:pb-20 lg:grid-cols-12 lg:gap-8 pt-24 md:pt-28"><div class="flex flex-col gap-5 sm:col-span-2 lg:col-span-3" style="opacity: 0; filter: blur(4px); transform: translateY(18px);"><svg viewBox="0 0 610.938 160.807" width="610.938" height="160.807" fill="none" xmlns="http://www.w3.org/2000/svg" class="h-9 w-auto select-none self-start text-foreground" preserveAspectRatio="xMidYMid meet" role="img" aria-label="ssych"><g transform="translate(0.000 10.090)"><path d="M161.64 50.1549C160.964 64.9054 148.808 76.5175 134.042 76.5179H133.304L144.556 96.9292C146.674 100.772 146.785 105.407 144.852 109.347L139.29 120.682C133.531 132.423 121.594 139.865 108.517 139.865L37.5662 139.868L60.6728 103.062H97.6544C99.3133 103.061 100.358 101.275 99.5446 99.8286L86.4403 76.5165H86.4499L103.597 50.1011C106.311 45.9191 110.958 43.3952 115.944 43.3952H161.949L161.64 50.1549Z" fill="currentColor"></path><path d="M161.64 50.1549C160.964 64.9054 148.808 76.5175 134.042 76.5179H133.304L144.556 96.9292C146.674 100.772 146.785 105.407 144.852 109.347L139.29 120.682C133.531 132.423 121.594 139.865 108.517 139.865L37.5662 139.868L60.6728 103.062H97.6544C99.3133 103.061 100.358 101.275 99.5446 99.8286L86.4403 76.5165H86.4499L103.597 50.1011C106.311 45.9191 110.958 43.3952 115.944 43.3952H161.949L161.64 50.1549Z" fill="currentColor"></path><path d="M124.377 0L101.271 36.8065H64.2891C62.6302 36.8068 61.5859 38.5934 62.3989 40.0395L75.5032 63.3516H75.4991L58.3539 89.767C55.6392 93.949 50.9909 96.4729 46.0051 96.4729H0L0.310202 89.7119C0.986726 74.9613 13.1425 63.3502 27.9085 63.3502H28.6392L17.3879 42.9389C15.2695 39.0959 15.1589 34.4609 17.0915 30.5211L22.653 19.1857C28.4125 7.44524 40.3495 0.00339438 53.4265 0.00275735L124.377 0Z" fill="currentColor"></path><path d="M124.377 0L101.271 36.8065H64.2891C62.6302 36.8068 61.5859 38.5934 62.3989 40.0395L75.5032 63.3516H75.4991L58.3539 89.767C55.6392 93.949 50.9909 96.4729 46.0051 96.4729H0L0.310202 89.7119C0.986726 74.9613 13.1425 63.3502 27.9085 63.3502H28.6392L17.3879 42.9389C15.2695 39.0959 15.1589 34.4609 17.0915 30.5211L22.653 19.1857C28.4125 7.44524 40.3495 0.00339438 53.4265 0.00275735L124.377 0Z" fill="currentColor"></path></g><g transform="translate(531.390 0.000)"><path d="M0 125.15V0H16.4581V74.7472H12.3436C12.3436 65.7181 13.4865 57.9462 15.7723 51.4316C18.1725 44.8026 21.8298 39.7166 26.7444 36.1735C31.659 32.6305 37.9451 30.8589 45.6026 30.8589H46.2884C57.2605 30.8589 65.5467 34.5163 71.147 41.831C76.7473 49.0314 79.5475 59.3749 79.5475 72.8614V125.15H63.0894V69.4326C63.0894 62.0036 60.975 56.2318 56.7462 52.1173C52.6316 48.0028 47.2599 45.9455 40.631 45.9455C33.3162 45.9455 27.4302 48.4028 22.9728 53.3174C18.6297 58.1177 16.4581 64.4609 16.4581 72.3471V125.15H0Z" fill="currentColor"></path></g><g transform="translate(437.720 30.520)"><path d="M46.117 97.72C38.2308 97.72 31.3732 96.3485 25.5443 93.6055C19.8297 90.8624 15.0866 87.2051 11.3149 82.6334C7.54329 77.9474 4.68598 72.8042 2.74301 67.2039C0.914331 61.6036 0 56.0033 0 50.4029V47.317C0 41.4881 0.914331 35.7735 2.74301 30.1732C4.68598 24.5729 7.54329 19.544 11.3149 15.0866C15.2009 10.5149 20.0012 6.85755 25.7158 4.11453C31.4304 1.37151 38.1165 0 45.7741 0C53.4317 0 60.2892 1.42866 66.3467 4.28597C72.5185 7.14328 77.4331 11.2007 81.0904 16.4581C84.8621 21.6013 86.9765 27.7159 87.4337 34.802H71.6613C70.8613 29.0874 68.2326 24.3443 63.7752 20.5726C59.3177 16.6867 53.3174 14.7437 45.7741 14.7437C39.2594 14.7437 33.8305 16.2295 29.4874 19.2011C25.1443 22.1727 21.887 26.2301 19.7154 31.3733C17.5439 36.5164 16.4581 42.3453 16.4581 48.86C16.4581 55.1461 17.5439 60.9178 19.7154 66.1753C21.887 71.3184 25.1443 75.433 29.4874 78.5189C33.9448 81.4905 39.488 82.9763 46.117 82.9763C51.2601 82.9763 55.7175 82.0619 59.4892 80.2332C63.2608 78.4046 66.2896 75.9473 68.5754 72.8614C70.8613 69.7755 72.2328 66.2896 72.6899 62.4036H88.4623C88.1194 69.6041 86.005 75.833 82.1191 81.0904C78.3474 86.3479 73.3185 90.4624 67.0325 93.434C60.8607 96.2913 53.8889 97.72 46.117 97.72Z" fill="currentColor"></path></g><g transform="translate(363.190 33.600)"><path d="M0 127.207V112.464H13.2008C17.0867 112.464 20.3441 111.949 22.9728 110.921C25.7158 110.006 27.9445 108.406 29.6589 106.12C31.4875 103.835 32.9734 100.806 34.1163 97.0342L62.9179 0H79.0332L48.5171 101.32C46.6884 107.378 44.1168 112.292 40.8024 116.064C37.4879 119.95 33.4305 122.75 28.6302 124.464C23.9443 126.293 18.4582 127.207 12.1721 127.207H0Z" fill="currentColor"></path></g><g transform="translate(391.130 109.380)"><path d="M0 13.7151V0H19.8869V13.7151H0Z" fill="currentColor"></path></g><g transform="translate(356.670 33.600)"><path d="M32.7448 89.4909L0 0H16.801L48.1742 89.4909H32.7448Z" fill="currentColor"></path></g><g transform="translate(284.990 30.860)"><path d="M38.0593 97.0342C26.0586 97.0342 16.7438 94.4626 10.1149 89.3195C3.60021 84.1763 0.228585 77.1473 0 68.2325H15.4295C15.6581 71.7756 17.4296 75.1472 20.7441 78.3474C24.1728 81.4333 29.9446 82.9762 38.0593 82.9762C45.3741 82.9762 50.9744 81.5476 54.8603 78.6903C58.7463 75.7187 60.6892 72.1185 60.6892 67.8897C60.6892 64.118 59.2606 61.2036 56.4033 59.1463C53.546 56.9747 48.9171 55.5461 42.5167 54.8603L32.5733 53.8317C23.8871 52.9174 16.801 50.3458 11.3149 46.117C5.8289 41.7739 3.08589 35.7164 3.08589 27.9445C3.08589 22.1156 4.57169 17.1439 7.54329 13.0293C10.5149 8.80051 14.6294 5.60032 19.8869 3.42877C25.1443 1.14292 31.2018 0 38.0593 0C48.3457 0 56.689 2.28584 63.0894 6.85753C69.4897 11.4292 72.8042 18.2296 73.0328 27.2587H57.6033C57.489 23.6014 55.7747 20.5155 52.4602 18.001C49.26 15.3723 44.4597 14.058 38.0593 14.058C31.659 14.058 26.8015 15.3723 23.4871 18.001C20.1726 20.6298 18.5154 23.9442 18.5154 27.9445C18.5154 31.3733 19.6583 34.1163 21.9441 36.1735C24.3443 38.2308 28.2302 39.5452 33.6019 40.1166L43.5454 41.1453C53.3745 42.1739 61.2607 44.9169 67.2039 49.3743C73.1471 53.7174 76.1187 59.8892 76.1187 67.8897C76.1187 73.6043 74.4615 78.6903 71.147 83.1477C67.9468 87.4908 63.4894 90.9196 57.7748 93.434C52.0602 95.8342 45.4883 97.0342 38.0593 97.0342Z" fill="currentColor"></path></g>
376<g transform="translate(206.000 30.860)"><path d="M38.0594 97.0342C26.0587 97.0342 16.7438 94.4626 10.1149 89.3195C3.60021 84.1763 0.228585 77.1473 0 68.2325H15.4295C15.6581 71.7756 17.4296 75.1472 20.7441 78.3474C24.1728 81.4333 29.9446 82.9762 38.0594 82.9762C45.3741 82.9762 50.9744 81.5476 54.8603 78.6903C58.7463 75.7187 60.6892 72.1185 60.6892 67.8897C60.6892 64.118 59.2606 61.2036 56.4033 59.1463C53.546 56.9747 48.9171 55.5461 42.5168 54.8603L32.5733 53.8317C23.8871 52.9174 16.801 50.3458 11.3149 46.117C5.82891 41.7739 3.08589 35.7164 3.08589 27.9445C3.08589 22.1156 4.57169 17.1439 7.54329 13.0293C10.5149 8.80051 14.6294 5.60032 19.8869 3.42877C25.1443 1.14292 31.2018 0 38.0594 0C48.3457 0 56.689 2.28584 63.0894 6.85753C69.4897 11.4292 72.8042 18.2296 73.0328 27.2587H57.6033C57.489 23.6014 55.7747 20.5155 52.4602 18.001C49.26 15.3723 44.4597 14.058 38.0594 14.058C31.659 14.058 26.8016 15.3723 23.4871 18.001C20.1726 20.6298 18.5154 23.9442 18.5154 27.9445C18.5154 31.3733 19.6583 34.1163 21.9441 36.1735C24.3443 38.2308 28.2302 39.5452 33.602 40.1166L43.5454 41.1453C53.3745 42.1739 61.2607 44.9169 67.2039 49.3743C73.1471 53.7174 76.1187 59.8892 76.1187 67.8897C76.1187 73.6043 74.4615 78.6903 71.147 83.1477C67.9468 87.4908 63.4894 90.9196 57.7748 93.434C52.0602 95.8342 45.4884 97.0342 38.0594 97.0342Z" fill="currentColor"></path></g></svg><div class="flex flex-col gap-2.5"><p class="max-w-[220px] text-[13px] leading-relaxed text-pretty text-foreground/60">Lead product designer, Riga</p><div class="flex items-center gap-2.5 font-display text-[11px] font-medium leading-none tracking-[0.03em] text-foreground/60"><span>©2026 ssych</span><span aria-hidden="true" class="text-foreground/25">·</span><button class="cursor-pointer transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none">Back to top</button></div></div></div><nav aria-label="Footer navigation" class="grid grid-cols-2 gap-x-6 gap-y-8 sm:grid-cols-3 lg:col-span-7 lg:grid-cols-5"><div class="flex flex-col gap-4" style="opacity: 0; filter: blur(4px); transform: translateY(18px);"><h2 class="label text-foreground">Pages</h2><ul class="flex flex-col gap-[10px]"><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/" data-discover="true">Home</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/about" data-discover="true">About</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/blog" data-discover="true">Blog</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/projects" data-discover="true">Projects</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/services" data-discover="true">Services</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/pricing" data-discover="true">Pricing</a></li></ul></div><div class="flex flex-col gap-4" style="opacity: 0; filter: blur(4px); transform: translateY(18px);"><h2 class="label text-foreground">Services</h2><ul class="flex flex-col gap-[10px]"><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);">
376<a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/services/ux-audit-services" data-discover="true">Product UX review</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/services/design-sprint" data-discover="true">Design sprints</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/services/dashboard-design" data-discover="true">Dashboard design</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/services/prototyping" data-discover="true">Prototyping</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/services/ui-design-system" data-discover="true">Design systems</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/services/dev-support-qa" data-discover="true">Handoff & design QA</a></li></ul></div><div class="flex flex-col gap-4" style="opacity: 0; filter: blur(4px); transform: translateY(18px);"><h2 class="label text-foreground">Projects</h2><ul class="flex flex-col gap-[10px]"><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/work/taomarketcap" data-discover="true">Taomarketcap</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/work/celium" data-discover="true">Celium</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/work/metanova" data-discover="true">Metanova</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/work/datura" data-discover="true">Datura AI</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/work/rizzy" data-discover="true">Rizzy</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/work/desearch" data-discover="true">Desearch</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/work
376/drippler" data-discover="true">Drippler</a></li></ul></div><div class="flex flex-col gap-4" style="opacity: 0; filter: blur(4px); transform: translateY(18px);"><h2 class="label text-foreground">Library</h2><ul class="flex flex-col gap-[10px]"><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/library/installation" data-discover="true">Get Started</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/library/card-stack" data-discover="true">Components</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/library/dashboards" data-discover="true">Dashboards</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/library/changelog" data-discover="true">Changelog</a></li></ul></div><div class="flex flex-col gap-4" style="opacity: 0; filter: blur(4px); transform: translateY(18px);"><h2 class="label text-foreground">Legal</h2><ul class="flex flex-col gap-[10px]"><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/imprint" data-discover="true">Imprint</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/privacy" data-discover="true">Privacy Policy</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/terms" data-discover="true">Terms & Conditions</a></li><li style="opacity: 0; filter: blur(4px); transform: translateX(-8px);"><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/accessibility" data-discover="true">Accessibility Statement</a></li></ul></div></nav><div class="flex flex-col gap-4 lg:col-span-2" style="opacity: 0; filter: blur(4px); transform: translateY(18px);"><h2 class="label text-foreground">Contact</h2><ul class="flex flex-col gap-[10px]"><li><a class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none" href="/contact" data-discover="true">Book a 15-min call</a></li><li><a href="mailto:[email protected]" class="inline-block text-[13px] leading-snug text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:text-foreground focus-visible:outline-none">[email protected]</a></li></ul><div class="flex items-center gap-2"><a href="https://www.linkedin.com/in/savvasicevsdesign/" aria-label="LinkedIn" target="_blank" rel="noreferrer" class="flex size-10 items-center justify-center rounded-full text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-offset-2 focus-visible:ring-offset-black focus-visible:outline-none" tabindex="0"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 256 256" class="size-[18px]"><path d="M216,24H40A16,16,0,0,0,24,40V216a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V40A16,16,0,0,0,216,24Zm0,192H40V40H216V216ZM96,112v64a8,8,0,0,1-16,0V112a8,8,0,0,1,16,0Zm88,28v36a8,8,0,0,1-16,0V140a20,20,0,0,0-40,0v36a8,8,0,0,1-16,0V112a8,8,0,0,1,15.79-1.78A36,36,0,0,1,184,140ZM100,84A12,12,0,1,1,88,72,12,12,0,0,1,100,84Z"></path></svg></a><a href="https://x.com/savvasicevs" aria-label="X / Twitter" target="_blank" rel="noreferrer" class="flex size-10 items-center justify-center rounded-full text-foreground
376/60 transition-colors duration-150 hover:text-foreground focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-offset-2 focus-visible:ring-offset-black focus-visible:outline-none" tabindex="0"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 256 256" class="size-[18px]"><path d="M214.75,211.71l-62.6-98.38,61.77-67.95a8,8,0,0,0-11.84-10.76L143.24,99.34,102.75,35.71A8,8,0,0,0,96,32H48a8,8,0,0,0-6.75,12.3l62.6,98.37-61.77,68a8,8,0,1,0,11.84,10.76l58.84-64.72,40.49,63.63A8,8,0,0,0,160,224h48a8,8,0,0,0,6.75-12.29ZM164.39,208,62.57,48h29L193.43,208Z"></path></svg></a><a href="https://github.com/savvasicevs" aria-label="GitHub" target="_blank" rel="noreferrer" class="flex size-10 items-center justify-center rounded-full text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-offset-2 focus-visible:ring-offset-black focus-visible:outline-none" tabindex="0"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 256 256" class="size-[18px]"><path d="M208.31,75.68A59.78,59.78,0,0,0,202.93,28,8,8,0,0,0,196,24a59.75,59.75,0,0,0-48,24H124A59.75,59.75,0,0,0,76,24a8,8,0,0,0-6.93,4,59.78,59.78,0,0,0-5.38,47.68A58.14,58.14,0,0,0,56,104v8a56.06,56.06,0,0,0,48.44,55.47A39.8,39.8,0,0,0,96,192v8H72a24,24,0,0,1-24-24A40,40,0,0,0,8,136a8,8,0,0,0,0,16,24,24,0,0,1,24,24,40,40,0,0,0,40,40H96v16a8,8,0,0,0,16,0V192a24,24,0,0,1,48,0v40a8,8,0,0,0,16,0V192a39.8,39.8,0,0,0-8.44-24.53A56.06,56.06,0,0,0,216,112v-8A58.14,58.14,0,0,0,208.31,75.68ZM200,112a40,40,0,0,1-40,40H112a40,40,0,0,1-40-40v-8a41.74,41.74,0,0,1,6.9-22.48A8,8,0,0,0,80,73.83a43.81,43.81,0,0,1,.79-33.58,43.88,43.88,0,0,1,32.32,20.06A8,8,0,0,0,119.82,64h32.35a8,8,0,0,0,6.74-3.69,43.87,43.87,0,0,1,32.32-20.06A43.81,43.81,0,0,1,192,73.83a8.09,8.09,0,0,0,1,7.65A41.72,41.72,0,0,1,200,104Z"></path></svg></a><a href="mailto:[email protected]" aria-label="Email" class="flex size-10 items-center justify-center rounded-full text-foreground/60 transition-colors duration-150 hover:text-foreground focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-offset-2 focus-visible:ring-offset-black focus-visible:outline-none" tabindex="0"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 256 256" class="size-[18px]"><path d="M224,48H32a8,8,0,0,0-8,8V192a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V56A8,8,0,0,0,224,48ZM203.43,64,128,133.15,52.57,64ZM216,192H40V74.19l82.59,75.71a8,8,0,0,0,10.82,0L216,74.19V192Z"></path></svg></a></div></div></div></div></footer></div></div></div> 377 </body> 378</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.