:root{--bg:#10121b;--surface:#171a26;--surface-2:#1d2130;--line:#2a3043;--text:#f1f3fb;--muted:#9aa2b8;--accent:#a6adff;--font:Arial,Helvetica,sans-serif;--mono:"Courier New",monospace;--accent-blue:#3b5bdb;--accent-violet:#7c3aed;--accent-gradient:linear-gradient(115deg,var(--accent-blue),var(--accent-violet));--accent-text-gradient:linear-gradient(110deg,#8fb7ff,#c3a0ff)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:108px}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.6}
body:has(dialog[open]),body.menu-open{overflow:hidden}
button,a,input,summary{-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
button{font:inherit;cursor:pointer}
a{color:inherit;text-decoration:none}
button{color:inherit}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:6px;border-radius:4px}
img{display:block;max-width:100%;height:auto}
svg{flex-shrink:0}
::selection{background:var(--accent);color:var(--bg)}
[hidden]{display:none!important}
.container{width:min(1280px,calc(100% - 96px));margin-inline:auto}
.icon{width:22px;height:22px;vertical-align:middle}
.section{padding-block:112px}
.eyebrow{font-family:var(--mono);font-size:11px;font-weight:400;letter-spacing:1.2px;line-height:1.6;display:inline-flex;align-items:center;gap:10px;color:#b2b2bc}
.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent-gradient);box-shadow:0 0 12px #736dff40;flex-shrink:0}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.5px;color:var(--muted)}
.muted{color:var(--muted)}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-weight:500}
h2{font-size:clamp(34px,4vw,54px);letter-spacing:-2.2px;line-height:1.13}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:50px;margin-bottom:48px}
.section-head .eyebrow{margin-bottom:24px}
.section-head>p{color:var(--muted);max-width:350px;font-size:15px;line-height:1.8;padding-bottom:4px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:26px;min-height:54px;padding:14px 23px;font-size:14px;font-weight:600;border:1px solid transparent;border-radius:5px;transition:background-position .25s,transform .2s,border-color .2s,box-shadow .25s}
.button .icon{width:19px;height:19px}
.button:hover{transform:translateY(-2px)}
.button-primary{background:var(--accent-gradient);color:#ffffff;box-shadow:0 7px 24px #5a53df26;background-size:150% 100%;background-position:0% 50%}
.button-primary:hover{background:var(--accent-gradient);background-size:150% 100%;background-position:100% 50%;box-shadow:0 9px 30px #7556ee40}
.button-outline{border-color:#3c3d4b;background:transparent}
.button-outline:hover{background:var(--surface-2);border-color:var(--accent)}
.text-link{display:inline-flex;align-items:center;gap:14px;font-size:14px}
.text-link .icon{width:18px}
.text-link:hover{color:var(--accent)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:10px;left:20px;z-index:100;padding:10px 18px;background:var(--accent-gradient);color:#ffffff;transform:translateY(-200%)}
.skip-link:focus{transform:translateY(0)}
.header{height:88px;position:sticky;top:0;z-index:40;border-bottom:1px solid #ffffff0b;background:#10121be8;backdrop-filter:blur(20px)}
.header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand{display:inline-flex;align-items:center;gap:12px;line-height:1;white-space:nowrap}
.brand>span:last-child{font-size:25px;font-weight:700;letter-spacing:-1px}
.brand-studio{margin-left:6px;font-size:14px;font-weight:400;color:var(--muted);letter-spacing:-.2px}
.brand-symbol{display:grid;grid-template-columns:repeat(2,9px);gap:3px;width:21px;transform:rotate(-10deg)}
.brand-symbol i{width:9px;height:9px;background:var(--accent-gradient);border-radius:2px}
.brand-symbol i:nth-child(2){opacity:.55;transform:translateY(-3px)}
.brand-symbol i:nth-child(3){opacity:.75}
.desktop-nav{display:flex;gap:30px;font-size:13px;color:#b0b0b8}
.desktop-nav a{transition:color .2s}
.desktop-nav a:hover,.desktop-nav a.current{color:var(--accent)}
.header-contact{display:inline-flex;gap:16px;align-items:center;font-size:12px;padding:10px 15px;border:1px solid #373743;border-radius:5px}
.header-contact .icon{width:16px;height:16px;color:var(--accent)}
.header-contact:hover{border-color:var(--accent)}
.menu-toggle{display:none;background:none;border:1px solid var(--line);padding:10px;border-radius:5px}
.mobile-nav{padding-block:20px 30px;background:var(--bg)}
.browser-dots{display:flex;gap:5px;align-items:center}
.browser-dots i{height:6px;width:6px;border-radius:50%;background:#525260}
.browser-dots i:first-child{background:#6f7085}
.browser-dots i:nth-child(2){background:#58596d}
.tags{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.tags>span{display:inline-flex;border:1px solid #343543;border-radius:4px;padding:4px 9px;color:#a9aabd;font-size:10px;line-height:1.4}
.projects-section{padding-bottom:100px}





.projects-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.project-card{border:1px solid #2d2d36;border-radius:9px;overflow:hidden;min-width:0;transition:border-color .3s,transform .3s;background:#141419}
.project-card:hover{border-color:#4d4e78;transform:translateY(-4px)}
.project-link{display:block;height:100%}
.project-media{position:relative;overflow:hidden;background:#161620;min-height:300px}
.project-category{position:absolute;top:21px;left:23px;z-index:2;font-size:9px;font-family:var(--mono);letter-spacing:.5px;color:#b4b5d5;border:1px solid #6b70f328;padding:5px 9px;border-radius:4px;background:#17171ede;backdrop-filter:blur(10px)}
.project-screenshot{padding:70px 30px 0;transition:transform .5s;transform:translateY(8px)}
.project-screenshot img{border:1px solid #47486475;border-radius:6px 6px 0 0;box-shadow:0 10px 35px #0006;width:100%}
.project-card:hover .project-screenshot{transform:translateY(0)}
.project-media.anime-love{background:radial-gradient(ellipse at 50% 40%,#182d47,#16212c)}
.project-media.anime-love .project-screenshot{height:310px}
.project-view{position:absolute;bottom:17px;right:19px;background:#101015b0;backdrop-filter:blur(8px);width:36px;height:36px;border:1px solid #ffffff24;border-radius:50%;display:grid;place-items:center;color:var(--accent);z-index:2}
.project-view .icon{width:17px;height:17px}
.project-content{padding:27px 27px 29px}
.project-heading{display:flex;align-items:center;gap:11px;margin-bottom:12px}
.project-heading h3{font-size:24px;letter-spacing:-.6px;line-height:1.2}
.project-number{font-family:var(--mono);font-size:10px;color:#646580;align-self:flex-start;padding-top:5px}
.project-heading>.icon{margin-left:auto;color:#9091b2;width:20px;height:20px}
.project-content>p{font-size:13px;line-height:1.8;color:#9596a7;margin-bottom:19px;max-width:440px}
.project-featured{grid-column:1/-1}
.project-featured>.project-link{display:grid;grid-template-columns:.88fr 1.12fr}
.project-featured .project-media{grid-column:2;grid-row:1;min-height:350px;background:radial-gradient(ellipse at 50% 50%,#292a4a,#1d1c2e)}
.project-featured .project-screenshot{padding:65px 0 0 28px;transform:translateY(9px) rotate(-2deg);width:112%}
.project-featured:hover .project-screenshot{transform:translateY(0) rotate(-2deg)}
.project-featured .project-content{grid-column:1;grid-row:1;align-self:center;padding:40px}
.project-featured .project-heading{display:block;margin-bottom:17px}
.project-featured .project-heading h3{font-size:32px;line-height:1.1;margin-top:17px;max-width:330px}
.project-featured .project-heading>.icon{display:none}
.project-featured .project-content>p{font-size:14px;max-width:340px}
.project-outcome{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:29px;padding-top:23px;border-top:1px solid var(--line)}
.project-outcome>span{color:#818297;font-size:14px;text-decoration:line-through}
.project-outcome>.icon{width:17px;color:#5b5d89}
.project-outcome>strong{color:var(--accent);font-size:22px;font-weight:400;letter-spacing:-.5px;background:var(--accent-text-gradient);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.project-outcome>small{color:#86879b;font-size:10px;flex-basis:100%;margin-top:-8px}
.rag-diagram{height:310px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(ellipse at center,#282c48,#191c2a)}
.rag-grid{position:absolute;inset:0;background-image:radial-gradient(#64669640 1px,transparent 1px);background-size:18px 18px;mask-image:radial-gradient(ellipse,black,transparent 75%)}
.diagram-label{font:8px var(--mono);letter-spacing:1.2px;color:#6c6d8e;position:absolute;top:72px;left:28px}
.rag-nodes{position:relative;display:flex;align-items:center;justify-content:center;width:100%;padding:18px}
.rag-node{min-width:100px;display:flex;align-items:center;flex-direction:column;text-align:center}
.node-icon{width:49px;height:53px;display:grid;place-items:center;border:1px solid #3a3b5d;border-radius:9px;background:#1f2032;box-shadow:0 8px 25px #0003;margin-bottom:11px;color:#afb0cd}
.node-icon .icon{width:24px;height:24px}
.rag-node.agent .node-icon{border-color:#aaa4ff;color:var(--accent);background:linear-gradient(135deg,#344a83,#553785);box-shadow:0 0 35px #6b70f312}
.rag-node strong{font-size:10px;font-weight:500;white-space:nowrap}
.rag-node small{font-size:8px;color:#747593;margin-top:3px}
.node-line{height:1px;width:35px;background:var(--accent-gradient);position:relative;align-self:flex-start;margin-top:45px;flex-shrink:1}
.node-line:after{content:"";position:absolute;right:0;top:-2px;border-left:4px solid #aaa4ff;border-top:2px solid transparent;border-bottom:2px solid transparent}
.node-line>i{position:absolute;width:3px;height:3px;background:var(--accent);border-radius:50%;top:-1px;animation:none}
.diagram-foot{position:absolute;bottom:25px;left:0;right:0;display:flex;gap:7px;justify-content:center;align-items:center;font:8px var(--mono);color:#8e8fac;letter-spacing:.1px}
.diagram-foot .status-dot{width:4px;height:4px}
.process-section{background:#141417;border-block:1px solid #ffffff06}
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:34px;margin-top:63px}
.step-number{display:flex;align-items:center;gap:23px;margin-bottom:26px}
.step-number>span{font-family:var(--mono);font-size:14px;color:var(--accent)}
.step-number>i{height:1px;flex:1;background:linear-gradient(90deg,#3c3d65,#272735)}
.process-step:last-child .step-number>i{background:linear-gradient(90deg,#3c3d65,transparent)}
.process-step h3{font-size:20px;letter-spacing:-.4px;margin-bottom:13px}
.process-step p{font-size:13px;line-height:1.8;color:#9192a3}
.process-note{margin-top:48px;border:1px solid #2e2f44;border-radius:6px;padding:19px 23px;display:flex;align-items:center;gap:14px;background:#161622}
.process-note>.icon{color:var(--accent);width:17px;height:17px}
.process-note p{font-size:12px;color:#a5a6bd}
.process-note a{font-size:11px;white-space:nowrap;margin-left:auto;color:var(--accent);display:flex;align-items:center;gap:15px}
.process-note a>.icon{width:15px;height:15px}
.faq-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px}
.faq-intro .eyebrow{margin-bottom:24px}
.faq-intro p{margin-top:27px;font-size:13px;color:var(--muted);line-height:1.9}
.faq-intro p>a{color:#b7b8d8}
.faq-intro p .icon{width:13px;height:13px}
.faq-item{border-bottom:1px solid #2c2c37}
.faq-item:first-child{border-top:1px solid #2c2c37}
.faq-item summary{display:flex;align-items:center;gap:15px;list-style:none;cursor:pointer;min-height:77px;padding:18px 0;font-size:15px;line-height:1.5}
.faq-item summary::-webkit-details-marker{display:none}
.faq-number{font-family:var(--mono);font-size:9px;color:#656681;align-self:flex-start;padding-top:6px}
.faq-item summary>.icon{width:18px;height:18px;margin-left:auto;color:#9fa0bc;transition:transform .2s}
.faq-item[open] summary>.icon{transform:rotate(45deg);color:var(--accent)}
.faq-item[open] summary{color:var(--accent)}
.faq-answer{padding:0 25px 24px 29px}
.faq-answer p{font-size:13px;line-height:1.9;color:#9697aa}
.contact-section{padding-block:0 90px}
.contact-panel{padding:37px 42px 29px;background:var(--accent-gradient);border-radius:9px;color:#ffffff;position:relative;overflow:hidden}
.contact-panel:before{content:"";position:absolute;right:20%;top:-200px;width:600px;height:600px;border:1px solid #ffffff15;border-radius:50%;box-shadow:0 0 0 50px #ffffff05,0 0 0 100px #ffffff04;pointer-events:none}
.contact-top{display:flex;align-items:center;justify-content:space-between;gap:20px;position:relative}
.contact-top .eyebrow{color:#eff0ff;font-size:9px}
.contact-top .status-dot{background:#ffffff;box-shadow:0 0 12px #ffffff55}
.contact-index{font:9px var(--mono);color:#e4e7ff;letter-spacing:1px}
.contact-body{display:flex;align-items:center;justify-content:space-between;gap:40px;position:relative;padding-block:35px 40px}
.contact-body h2{font-size:clamp(44px,5.7vw,78px);font-weight:500;letter-spacing:-3.5px;line-height:1.05}
.contact-body h2>span{color:#e7dfff}
.contact-body p{margin-top:23px;color:#eff0ff;font-size:14px;line-height:1.8}
.contact-circle{display:grid;place-items:center;width:114px;height:114px;border-radius:50%;border:1px solid #ffffff66;margin-right:40px;transition:background .3s,transform .3s;flex-shrink:0}
.contact-circle .icon{width:49px;height:49px;stroke-width:1.3}
.contact-circle:hover{background:#ffffff18;transform:rotate(6deg)}
.contact-bottom{position:relative;display:flex;align-items:center;gap:20px;border-top:1px solid #ffffff38;padding-top:24px}
.contact-handle{display:flex;gap:10px;align-items:center;font-size:17px;letter-spacing:-.3px}
.contact-handle>.icon{width:21px;height:21px}
.copy-contact{display:flex;align-items:center;gap:6px;background:transparent;border:0;padding:6px;color:#eff0ff;font-size:10px;min-height:36px}
.copy-contact .icon{width:13px;height:13px}
.copy-contact:hover{color:#ffffff}
.contact-bottom>p{display:flex;align-items:center;gap:7px;color:#eff0ff;font-size:10px;margin-left:auto}
.contact-bottom>p .icon{width:13px;height:13px}
.contact-note{color:#6f7089;font-size:10px;text-align:center;padding-top:16px}
.footer{border-top:1px solid var(--line);padding-block:35px 22px}
.footer-main{display:flex;align-items:center;justify-content:space-between;gap:30px}
.footer-main .brand>span:last-child{font-size:20px}
.footer-main .brand-studio{font-size:12px}
.footer-main .brand-symbol{transform:scale(.8) rotate(-10deg)}
.footer-main>p{font-size:12px;color:#7b7c91}
.footer-main>a:last-child{display:flex;align-items:center;gap:10px;font-size:12px;color:#adaec4}
.footer-main>a:last-child>.icon{width:15px;height:15px}
.footer-bottom{display:flex;justify-content:space-between;gap:25px;border-top:1px solid #ffffff08;padding-top:23px;margin-top:28px;font-size:9px;color:#66677d}
.toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,20px);z-index:100;color:var(--text);background:#1f2033;border:1px solid #4b4d85;border-radius:8px;padding:12px 22px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;box-shadow:0 10px 30px #0005;max-width:calc(100vw - 30px)}
.toast.visible{opacity:1;transform:translate(-50%,0)}
.case-hero{padding-top:49px}
.back-link{display:inline-flex;align-items:center;font-size:12px;color:#9596ae;margin-bottom:49px}
.back-link:hover{color:var(--accent)}
.case-label{display:flex;align-items:center;gap:20px;margin-bottom:20px}
.case-label>span:last-child{font-size:10px;padding:4px 10px;border:1px solid #353654;border-radius:4px;color:#a9aacd}
.case-hero h1{font-size:clamp(40px,5.5vw,76px);line-height:1.08;letter-spacing:-3px;max-width:1000px}
.case-subtitle{font-size:18px;color:#9798ae;max-width:700px;line-height:1.7;margin-block:25px}
.case-meta{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-block:28px 44px}
.case-meta>.tags>span{font-size:11px}
.case-meta>span,.case-meta>a{font-size:11px;color:#8b8ca1;display:flex;align-items:center;gap:7px}
.case-meta>span>.icon,.case-meta>a>.icon{height:14px;width:14px}
.case-meta>a{color:var(--accent);margin-left:auto}
.screenshot-static{padding:0;border:0;display:block;background:none;width:100%;text-align:left;cursor:default}
.case-cover{border:1px solid #313248;border-radius:9px;overflow:hidden;background:#181822;position:relative;display:block;width:100%;margin:0}
.case-cover img{width:100%;object-fit:contain}
.case-image-chrome{height:45px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid #ffffff09;background:#20202e;color:#9a9bb9;font-size:10px}
.case-image-chrome .icon{width:15px;height:15px}
.case-story{display:grid;grid-template-columns:.75fr 1.25fr;gap:110px}
.story-sidebar h2{font-size:32px;letter-spacing:-1px;margin-top:21px;max-width:300px}
.story-sidebar>p{color:#84859d;font-size:14px;margin-top:18px}
.story-sidebar .button{font-size:12px;min-height:46px;margin-top:25px;padding:10px 16px;gap:15px}
.story-content>article{margin-bottom:42px}
.story-content>article .eyebrow{font-size:9px;margin-bottom:12px;color:#9899bb}
.story-content h3{font-size:25px;letter-spacing:-.5px;margin-bottom:15px}
.story-content p{font-size:15px;color:#999aae;line-height:1.9}
.case-metrics{padding:27px;border:1px solid #35365c;border-radius:8px;background:#171827;display:flex;align-items:center;gap:30px;flex-wrap:wrap}
.case-metrics>div>span{font-family:var(--mono);font-size:9px;letter-spacing:1px;color:#7f80a4;display:block;margin-bottom:8px}
.case-metrics strong{display:block;font-size:37px;font-weight:400;line-height:1.2;letter-spacing:-1.5px}
.case-metrics>div:first-child strong{color:#8d8ea5;text-decoration:line-through;text-decoration-thickness:1px}
.case-metrics>div:nth-child(3) strong{color:var(--accent);background:var(--accent-text-gradient);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.case-metrics strong small{font-size:14px;letter-spacing:0;padding-left:8px}
.case-metrics>.icon{color:#57598f}
.case-metrics>p{flex-basis:100%;font-size:10px;color:#6d6e96;margin-top:-10px}
.case-features{border-top:1px solid var(--line);padding-top:40px}
.case-features>.eyebrow{font-size:10px}
.case-features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:35px;margin-top:32px}
.feature-check{display:grid;place-items:center;width:29px;height:29px;border:1px solid #353661;border-radius:50%;color:var(--accent);margin-bottom:20px}
.feature-check>.icon{width:14px;height:14px}
.case-features-grid h3{font-size:17px;margin-bottom:10px;letter-spacing:-.2px}
.case-features-grid p{font-size:12px;color:#8c8da5;line-height:1.8}
.gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px 25px}
.gallery-item{margin:0;min-width:0}
.gallery-item .screenshot-static{border-radius:7px;overflow:hidden;border:1px solid #303146;position:relative;aspect-ratio:1.62;background:#161623}
.gallery-item img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .5s}
.gallery-item .screenshot-static:hover img{transform:scale(1.025)}
.image-zoom{position:absolute;right:15px;bottom:15px;display:grid;place-items:center;background:#121220d9;border:1px solid #8384ad66;border-radius:50%;width:35px;height:35px;color:var(--accent)}
.image-zoom>.icon{width:16px;height:16px}
.gallery-item figcaption{display:flex;gap:15px;margin-top:17px}
.gallery-item figcaption>.mono{font-size:10px;color:#616287;padding-top:4px}
.gallery-item h3{font-size:16px;margin-bottom:4px}
.gallery-item p{font-size:11px;color:#82839e;line-height:1.8;max-width:440px}
.next-project{border-top:1px solid #2e2f43;padding-top:33px;margin-bottom:100px}
.next-project>.eyebrow{font-size:9px}
.next-project>a{display:flex;align-items:center;justify-content:space-between;margin-top:15px;padding-bottom:15px}
.next-project>a h2{font-size:42px;transition:color .2s}
.next-project>a>.icon{height:36px;width:36px;color:var(--accent)}
.next-project>a:hover h2{color:var(--accent)}
.rag-large{height:400px}
.rag-large .diagram-label{top:32px;left:35px;font-size:10px}
.rag-large .rag-node{min-width:190px}
.rag-large .rag-nodes{max-width:900px;margin:auto}
.rag-large .node-icon{width:78px;height:84px;border-radius:15px;margin-bottom:20px}
.rag-large .node-icon>.icon{width:34px;height:34px}
.rag-large .rag-node strong{font-size:17px}
.rag-large .rag-node small{font-size:12px;margin-top:7px}
.rag-large .node-line{width:100px;margin-top:60px}
.rag-large .diagram-foot{bottom:36px;font-size:10px}
.vectra-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.vectra-steps>article{padding:30px;border:1px solid #2c2d49;border-radius:8px;background:#161622}
.vectra-steps>article>span{font:12px var(--mono);color:var(--accent)}
.vectra-steps h3{font-size:22px;margin:23px 0 12px;letter-spacing:-.4px}
.vectra-steps p{color:#9293b0;font-size:13px;line-height:1.8}
.image-viewer{max-width:100vw;max-height:100dvh;width:100vw;height:100dvh;padding:0;margin:0;border:0;background:#09090ef7;color:var(--text)}
.image-viewer::backdrop{background:#07070ce8;backdrop-filter:blur(14px)}
.viewer-toolbar{height:70px;padding:15px 30px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff15;gap:20px}
.viewer-toolbar p{font-size:13px;color:#b0b1cd}
.viewer-close{background:#212233;border:1px solid #37385e;border-radius:50%;width:38px;height:38px;display:grid;place-items:center}
.viewer-close>.icon{height:18px;width:18px}
.viewer-stage{height:calc(100dvh - 120px);display:flex;align-items:center;justify-content:center;gap:20px;padding:25px 75px;position:relative}
.viewer-stage>img{max-width:100%;max-height:100%;object-fit:contain;border-radius:5px;box-shadow:0 20px 70px #0008}
.viewer-stage>button{width:42px;height:42px;border:1px solid #50527f;background:#202138b8;border-radius:50%;position:absolute;top:50%;transform:translateY(-50%);display:grid;place-items:center;font-size:20px;color:var(--accent);z-index:1}
.viewer-prev{left:18px}
.viewer-next{right:18px}
.viewer-hint{height:50px;text-align:center;font-family:var(--mono);font-size:10px;color:#7c7d9f}
.not-found{min-height:65vh;padding-block:110px}
.not-found h1{font-size:60px;letter-spacing:-2px;line-height:1.1;margin:25px 0}
.not-found p{margin-bottom:30px;color:var(--muted)}
.motion-ready .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s,transform .7s}
.motion-ready .reveal.is-visible{opacity:1;transform:translateY(0)}
@media(max-width:1150px){.container{width:calc(100% - 64px)}.desktop-nav{gap:20px}.section{padding-block:90px}.section-head{gap:30px}.section-head>p{font-size:13px;max-width:300px}.project-featured .project-content{padding:30px}.project-featured .project-heading h3{font-size:28px}.project-featured .project-media{min-height:350px}.project-outcome{gap:9px}.project-outcome>strong{font-size:21px}.project-content{padding:25px}.project-heading h3{font-size:22px}.process-grid{gap:22px}.process-step h3{font-size:18px}.process-step p{font-size:12px}.faq-layout{gap:60px}.contact-section{padding-top:0}.contact-bottom{gap:12px}.contact-bottom>p{font-size:8px}.case-story{gap:60px}.rag-large .rag-node{min-width:150px}.case-features-grid{gap:25px}}
@media(max-width:900px){.header{height:76px}.desktop-nav{gap:17px;font-size:11px}.header-contact{font-size:10px;padding:8px 10px;gap:8px}.brand>span:last-child{font-size:22px}.brand-studio{font-size:12px}.section{padding-block:80px}.project-featured .project-heading h3{font-size:25px}.project-featured .project-content>p{font-size:12px}.project-featured .project-content{padding:25px}.project-featured .project-media{min-height:340px}.project-featured .project-screenshot{width:135%;padding-top:100px}.project-outcome>span{font-size:11px}.project-outcome>strong{font-size:19px}.project-content{padding:22px}.project-content>p{font-size:12px}.project-heading h3{font-size:21px}.project-media{min-height:250px}.project-media.anime-love .project-screenshot{height:260px;padding:65px 20px 0}.rag-diagram{height:260px}.rag-nodes{padding:10px}.rag-node{min-width:75px}.rag-node strong{font-size:8px}.rag-node small{font-size:7px}.node-line{width:20px}.diagram-label{font-size:7px;top:68px;left:20px}.diagram-foot{font-size:7px;bottom:16px}.process-grid{grid-template-columns:1fr 1fr;gap:35px}.process-note{flex-wrap:wrap;gap:10px}.process-note p{max-width:90%;flex:1}.process-note a{margin-left:27px;flex-basis:100%}.faq-layout{grid-template-columns:.7fr 1.3fr;gap:40px}.faq-item summary{font-size:13px}.contact-section{padding-top:0}.contact-panel{padding:30px}.contact-index{font-size:8px}.contact-circle{width:85px;height:85px;margin-right:10px}.contact-circle .icon{width:38px;height:38px}.contact-bottom{flex-wrap:wrap}.contact-bottom>p{font-size:9px;flex-basis:100%;margin-left:0}.contact-handle{font-size:15px}.contact-body h2{font-size:65px}.footer-main>p{font-size:10px}.case-hero h1{font-size:60px;letter-spacing:-2.5px}.case-story{grid-template-columns:.65fr 1.35fr;gap:40px}.story-sidebar h2{font-size:27px}.story-content h3{font-size:23px}.story-content p{font-size:14px}.case-features-grid{grid-template-columns:1fr 1fr;gap:30px}.rag-large .rag-node{min-width:120px}.rag-large .node-line{width:60px}.rag-large .rag-node strong{font-size:15px}.rag-large .diagram-label{font-size:9px}.rag-large .diagram-foot{font-size:10px}.vectra-steps{gap:16px}.vectra-steps>article{padding:23px}.vectra-steps h3{font-size:19px}.vectra-steps p{font-size:12px}}
@media(max-width:650px){html{scroll-padding-top:90px}.container{width:calc(100% - 40px)}.header{height:70px}.header-inner{gap:15px}.brand>span:last-child{font-size:24px}.brand-studio{font-size:12px}.brand-symbol{transform:scale(.9) rotate(-10deg)}.desktop-nav,.header-contact{display:none}.menu-toggle{display:grid;place-items:center;min-width:40px;min-height:40px;padding:8px}.menu-toggle .icon{width:20px;height:20px}.header:has(.mobile-nav:not([hidden])){height:auto;min-height:70px}.header-inner{height:70px}.mobile-nav{display:flex;flex-direction:column;gap:0;padding-block:10px 22px}.mobile-nav>a{padding:13px 0;border-top:1px solid var(--line);font-size:16px}.mobile-nav>a:last-child{color:var(--accent);font-size:14px;display:flex;justify-content:space-between;align-items:center}.browser-dots{gap:4px}.browser-dots i{width:4px;height:4px}.section{padding-block:65px}.section-head{display:block;margin-bottom:30px}.section-head .eyebrow{font-size:9px;margin-bottom:18px}.section-head h2{font-size:38px;letter-spacing:-1.6px}.section-head>p{margin-top:20px;font-size:12px;line-height:1.7;max-width:340px}.projects-grid{grid-template-columns:1fr;gap:20px}.project-featured>.project-link{display:flex;flex-direction:column}.project-featured .project-content{order:2;padding:25px}.project-featured .project-media{min-height:245px;max-height:245px;order:1}.project-featured .project-screenshot{padding:61px 0 0 23px;width:105%}.project-category{top:18px;left:20px;font-size:8px}.project-featured .project-heading{display:flex;margin-bottom:14px}.project-featured .project-heading h3{font-size:25px;line-height:1.2;margin-top:0}.project-featured .project-heading>.icon{display:block;width:17px;height:17px}.project-featured .project-content>p{font-size:12px;max-width:none}.project-outcome{padding-top:18px;margin-top:22px;gap:12px}.project-outcome>span{font-size:13px}.project-outcome>strong{font-size:23px}.project-outcome>small{font-size:10px}.project-outcome>.icon{width:16px;height:16px}.project-media.anime-love .project-screenshot{height:265px;padding:65px 24px 0}.project-content{padding:24px}.project-heading h3{font-size:25px}.project-content>p{font-size:12px}.project-number{font-size:9px}.project-heading>.icon{width:17px;height:17px}.project-view{width:30px;height:30px}.project-view .icon{width:14px;height:14px}.rag-diagram{height:270px}.rag-node{min-width:87px}.rag-node strong{font-size:9px}.rag-node small{font-size:7px}.node-line{width:25px}.diagram-label{top:68px;font-size:7px}.diagram-foot{font-size:7px;bottom:22px}.process-grid{gap:30px 22px;margin-top:40px}.process-step h3{font-size:17px}.process-step p{font-size:11px;line-height:1.8}.step-number{margin-bottom:18px;gap:15px}.step-number>span{font-size:12px}.process-note{padding:17px;margin-top:33px;gap:10px}.process-note p{font-size:10px;line-height:1.8}.process-note>.icon{width:16px;height:16px;align-self:flex-start;margin-top:3px}.process-note a{font-size:10px;margin-left:26px}.faq-layout{display:block}.faq-intro .eyebrow{font-size:9px;margin-bottom:18px}.faq-intro h2{font-size:40px;letter-spacing:-1.6px}.faq-intro p{font-size:12px;margin-top:18px}.faq-list{margin-top:30px}.faq-item summary{font-size:13px;min-height:72px;gap:12px}.faq-number{font-size:8px}.faq-item summary>.icon{width:16px;height:16px}.faq-answer{padding-left:23px;padding-right:10px}.faq-answer p{font-size:12px}.contact-section{padding-top:0;padding-bottom:45px}.contact-panel{padding:25px 24px 23px}.contact-top .eyebrow{font-size:7px;gap:6px;letter-spacing:.6px}.contact-index{display:none}.contact-body{padding-block:28px;gap:15px;align-items:flex-start}.contact-body h2{font-size:clamp(36px,9.5vw,51px);letter-spacing:-1.8px;line-height:1.08}.contact-body p{font-size:11px;margin-top:20px;line-height:1.7}.contact-body .desktop-break{display:none}.contact-circle{height:47px;width:47px;margin:4px 0 0;border-color:#ffffff66}.contact-circle>.icon{width:26px;height:26px}.contact-bottom{gap:10px 15px;padding-top:18px}.contact-handle{font-size:14px;gap:7px}.contact-handle>.icon{width:17px;height:17px}.copy-contact{font-size:9px;margin-left:auto}.contact-bottom>p{font-size:8px;gap:6px;line-height:1.7}.contact-bottom>p .icon{width:11px;height:11px}.contact-note{font-size:8px;padding-top:13px;line-height:1.7;max-width:300px;margin:auto}.footer{padding-block:27px 20px}.footer-main{flex-wrap:wrap;gap:19px}.footer-main .brand>span:last-child{font-size:21px}.footer-main .brand-studio{font-size:11px}.footer-main>p{flex-basis:100%;order:3;font-size:10px}.footer-main>a:last-child{margin-left:auto;font-size:11px}.footer-bottom{gap:14px;margin-top:22px;padding-top:20px;font-size:8px}.footer-bottom>span:nth-child(2){display:none}.case-hero{padding-top:31px}.back-link{font-size:11px;margin-bottom:35px}.case-label{gap:12px;margin-bottom:19px}.case-label .eyebrow{font-size:9px}.case-label>span:last-child{font-size:8px;padding:3px 7px}.case-hero h1{font-size:43px;letter-spacing:-1.9px;line-height:1.1}.case-subtitle{font-size:15px;line-height:1.7;margin-block:22px}.case-meta{gap:15px;margin-block:23px 28px}.case-meta>.tags{flex-basis:100%}.case-meta>.tags>span{font-size:9px}.case-meta>span,.case-meta>a{font-size:9px}.case-meta>a{margin-left:0;flex-basis:100%}.case-image-chrome{height:30px;padding:0 12px;font-size:7px}.case-image-chrome .icon{width:12px;height:12px}.case-cover{border-radius:6px}.case-story{display:block;padding-block:55px}.story-sidebar{margin-bottom:37px}.story-sidebar .eyebrow{font-size:9px}.story-sidebar h2{font-size:29px;margin-top:14px;max-width:none}.story-sidebar>p{font-size:12px;margin-top:13px}.story-sidebar>p br{display:none}.story-sidebar .button{font-size:11px;min-height:43px;margin-top:20px}.story-content>article{margin-bottom:30px}.story-content>article .eyebrow{font-size:8px;margin-bottom:10px}.story-content h3{font-size:23px;margin-bottom:12px}.story-content p{font-size:13px;line-height:1.85}.case-metrics{padding:23px 20px;gap:20px}.case-metrics>div>span{font-size:8px}.case-metrics strong{font-size:29px}.case-metrics strong small{font-size:11px;padding-left:6px}.case-metrics>.icon{width:18px;height:18px}.case-metrics>p{font-size:9px;margin-top:0}.case-features{padding-top:30px}.case-features>.eyebrow{font-size:9px}.case-features-grid{gap:26px 20px;margin-top:28px}.feature-check{width:25px;height:25px;margin-bottom:14px}.feature-check>.icon{width:12px;height:12px}.case-features-grid h3{font-size:16px;line-height:1.35}.case-features-grid p{font-size:11px}.gallery-grid{grid-template-columns:1fr;gap:30px}.gallery-item h3{font-size:15px}.gallery-item p{font-size:10px}.gallery-item figcaption{gap:12px;margin-top:14px}.gallery-item figcaption>.mono{font-size:9px}.image-zoom{width:30px;height:30px;bottom:12px;right:12px}.next-project{margin-bottom:60px;padding-top:26px}.next-project>.eyebrow{font-size:8px}.next-project>a h2{font-size:31px;letter-spacing:-1.2px;max-width:80%}.next-project>a>.icon{width:26px;height:26px}.rag-large{height:280px}.rag-large .diagram-label{top:24px;left:20px;font-size:7px}.rag-large .rag-nodes{padding:10px}.rag-large .rag-node{min-width:84px}.rag-large .node-icon{width:49px;height:55px;border-radius:9px;margin-bottom:13px}.rag-large .node-icon>.icon{width:24px;height:24px}.rag-large .rag-node strong{font-size:9px}.rag-large .rag-node small{font-size:7px;margin-top:4px}.rag-large .node-line{width:26px;margin-top:40px}.rag-large .diagram-foot{font-size:7px;bottom:24px}.vectra-steps{grid-template-columns:1fr;gap:14px}.vectra-steps>article{padding:25px}.vectra-steps h3{font-size:24px;margin-top:16px}.vectra-steps p{font-size:13px}.viewer-toolbar{height:60px;padding:12px 17px}.viewer-toolbar p{font-size:11px}.viewer-stage{height:calc(100dvh - 110px);padding:10px}.viewer-stage>button{width:33px;height:33px;top:auto;bottom:10px;transform:none}.viewer-prev{left:15px}.viewer-next{right:15px}.viewer-hint{font-size:8px}.viewer-close{width:33px;height:33px}.not-found{padding-block:80px}.not-found h1{font-size:43px}.not-found p{font-size:14px}.toast{font-size:12px;bottom:20px;padding:11px 16px;white-space:nowrap}}
@media(max-width:360px){.container{width:calc(100% - 32px)}.project-featured .project-heading h3{font-size:22px}.project-outcome>strong{font-size:21px}.rag-node{min-width:77px}.node-line{width:16px}.rag-large .rag-node{min-width:77px}.rag-large .node-line{width:16px}.contact-body h2{font-size:35px}.contact-circle{width:39px;height:39px}.contact-circle>.icon{width:22px;height:22px}.contact-bottom>p{font-size:7px}.copy-contact{font-size:8px}.case-hero h1{font-size:36px}.case-metrics{gap:12px}.case-metrics strong{font-size:25px}.case-metrics strong small{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.motion-ready .reveal{opacity:1;transform:none}}
