.hero-line{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}.hero-line>span{display:block}.reading-progress{position:fixed;left:0;right:0;top:0;height:2px;z-index:101;pointer-events:none}.reading-progress>span{display:block;background:#7b8961;height:100%;transform:scaleX(var(--reading-progress,0));transform-origin:left}.site-header{position:sticky;top:0;background:#f5f4eef0;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transition:box-shadow .35s,background .35s}.site-header.is-scrolled{box-shadow:0 14px 25px -28px #20221f88;background:#f5f4eef7}.site-header nav a{position:relative}.site-header nav a:after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:right;transition:transform .35s cubic-bezier(.2,.7,.2,1)}.site-header nav a:hover:after{transform:scaleX(1);transform-origin:left}.brand svg{transition:transform .5s cubic-bezier(.2,.8,.2,1)}.brand:hover svg{transform:rotate(-9deg) scale(.92)}.button>span{transition:transform .35s}.button:hover>span{transform:translate(3px,-3px)}
.studio-ticker{overflow:hidden;margin-top:47px;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);color:#777e69;user-select:none}.ticker-track{display:flex;width:max-content}.ticker-track>span{display:block;white-space:nowrap;font:400 33px/1.25 Manrope,Arial,sans-serif;letter-spacing:-1.2px;flex-shrink:0}.ticker-track i{font-family:var(--serif);font-weight:400}.ticker-track b{font-weight:400;color:#9ba68c;margin:0 30px}.studio-ticker:hover .ticker-track{animation-play-state:paused}.work{padding-top:86px}.featured-case{display:grid;grid-template-columns:.8fr 1.6fr;gap:40px;margin-bottom:58px;align-items:stretch}.featured-copy{padding:32px 8px 20px 0;display:flex;flex-direction:column;align-items:flex-start}.featured-copy .eyebrow{display:flex;align-items:center;gap:9px;font-size:8px;letter-spacing:1px}.featured-copy h3{font-size:46px;letter-spacing:-2.3px;line-height:1.04;margin:25px 0 22px}.featured-copy>p:not(.eyebrow){font-size:12px;line-height:1.8;max-width:280px;color:var(--muted)}.case-details{padding:0;margin:23px 0 28px;display:flex;flex-direction:column;gap:8px;list-style:none;font-size:10px;color:#636a57}.case-details li:before{content:"↗";margin-right:10px;color:#89966d}.featured-copy .button{font-size:11px;gap:40px;padding:16px 20px}.full-case-link{font-size:10px;border-bottom:1px solid #b1b6a2;padding-bottom:5px;margin-top:18px;display:flex;gap:20px}.case-credit{font-size:6px;letter-spacing:.7px;color:var(--muted);margin-top:30px}.featured-visual{padding:38px 0 0;position:relative;background:#dbddd1;overflow:hidden;display:block;text-align:left;isolation:isolate}.featured-visual-label{position:absolute;left:18px;top:16px;right:18px;font-size:6px;letter-spacing:.7px;display:flex;justify-content:space-between;color:#6a715d}.ma-browser{width:100%;display:block;box-shadow:none;transform:none}.ma-browser-chrome{height:22px;background:#f6f5ee;display:flex;align-items:center;justify-content:space-between;padding:0 11px;color:#6b7062;font-size:6px}.ma-browser-chrome>span:first-child{font-size:5px;letter-spacing:1px;color:#b8bdae}.ma-browser img{width:100%;height:auto;aspect-ratio:1348/926;object-fit:cover}.featured-visual:hover .ma-browser{transform:none}.demo-play{position:absolute;bottom:25px;right:24px;display:flex;align-items:center;gap:10px;font-size:7px;letter-spacing:.5px;color:#fff;mix-blend-mode:normal;background:#252c22ed;padding:10px 15px;transition:transform .3s,background .3s;z-index:2}.demo-play>span{display:grid;place-items:center;border:1px solid #a2af8c7a;border-radius:50%;width:25px;height:25px;font-size:15px;color:#dce6c9}.featured-visual:hover .demo-play{background:#475537;transform:translateY(-4px)}.preview-tools{display:flex;align-items:center;gap:20px}.full-demo-link{font-size:10px;letter-spacing:0;border-bottom:1px solid #bfc6ae;padding-bottom:5px;white-space:nowrap}.full-demo-link[hidden]{display:none}.project-preview.is-live-demo{display:flex;align-items:start;padding:18px;background:#dfe3d5}.live-demo-shell{width:100%;max-width:1100px;position:relative;overflow:hidden;background:#0d0d0c;box-shadow:0 10px 25px #0002;border:1px solid #151b1520;transition:width .4s cubic-bezier(.2,.7,.2,1)}.live-demo-shell iframe{width:1100px;height:730px;display:block;border:0;transform:scale(var(--demo-scale,1));transform-origin:top left}.live-demo-shell[data-view=mobile]{width:360px;max-width:100%;height:640px}.live-demo-shell[data-view=mobile] iframe{width:100%;height:640px;transform:none}.project-dialog:has(.is-live-demo){max-width:1220px}.project-dialog:has(.is-live-demo) .project-dialog-head h2{font-size:35px}.project-dialog:has(.is-live-demo) .project-dialog-foot{padding-top:22px;padding-bottom:22px}.project-dialog:has(.is-live-demo) .concept-note{font-size:8px}.footer-controls{display:flex;align-items:center;gap:27px}.footer-controls #motion-toggle{display:flex;align-items:center;gap:7px;min-height:25px}.motion-indicator{font-size:9px;line-height:1;color:#7e8a68}.hero-stage{perspective:1400px}.hero-browser{transform:translate3d(0,var(--stage-offset,0px),0) rotate(-3deg) rotateX(var(--hero-rx,0deg)) rotateY(var(--hero-ry,0deg));transition:transform .5s cubic-bezier(.2,.7,.2,1)}.hero-browser:hover{transform:translate3d(0,calc(var(--stage-offset,0px) - 5px),0) rotate(-1deg) rotateX(var(--hero-rx,0deg)) rotateY(var(--hero-ry,0deg))}.project-art{transition:box-shadow .5s}.project-art:hover{box-shadow:0 12px 24px -20px #262d2288}.art-open{transition:opacity .3s,transform .45s}.project-art:hover .art-open{transform:translateY(0) rotate(-8deg)}.work-card h3{display:inline-block;position:relative}.work-card h3:after{content:"";position:absolute;bottom:-4px;left:0;right:0;height:1px;background:#7c8869;transform:scaleX(0);transform-origin:left;transition:transform .4s}.work-card:has(.project-art:hover) h3:after{transform:scaleX(1)}
.motion-enabled .hero-line>span{animation:line-arrive 1.25s cubic-bezier(.16,1,.3,1) both}.motion-enabled .hero-line:nth-child(2)>span{animation-delay:.14s}.motion-enabled .hero-top{animation:soft-arrive .8s .12s both}.motion-enabled .hero-side{animation:soft-arrive 1s .35s both}.motion-enabled .hero-stage{animation:stage-arrive 1.25s .18s cubic-bezier(.2,.75,.2,1) both}.motion-enabled .hero-browser{animation:studio-float 8s 1.6s ease-in-out infinite}.motion-enabled .phone-mock{animation:phone-float 7s 1.3s ease-in-out infinite}.motion-enabled .stage-tag{animation:tag-float 9s 2s ease-in-out infinite}.motion-enabled .ticker-track{animation:studio-ticker 34s linear infinite}.motion-enabled [data-reveal]{opacity:0;transform:translateY(35px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1);transition-delay:var(--reveal-delay,0ms)}.motion-enabled [data-reveal].is-visible{opacity:1;transform:translateY(0)}.motion-enabled .fit-question,.motion-enabled .fit-result{animation:soft-arrive .45s cubic-bezier(.16,1,.3,1) both}.motion-enabled .fit-option{animation:option-arrive .45s cubic-bezier(.16,1,.3,1) both}.motion-enabled .fit-option:nth-child(2){animation-delay:.04s}.motion-enabled .fit-option:nth-child(3){animation-delay:.08s}.motion-enabled .fit-option:nth-child(4){animation-delay:.12s}.motion-enabled details[open] .service-body{animation:soft-arrive .45s cubic-bezier(.16,1,.3,1) both}.motion-enabled dialog[open]{animation:dialog-arrive .4s cubic-bezier(.16,1,.3,1) both}.motion-enabled dialog[open]::backdrop{animation:backdrop-arrive .35s both}.motion-enabled .concept-site{animation:soft-arrive .5s ease both}.motion-paused *, .motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important;transition:none!important}.motion-paused [data-reveal],.motion-paused .hero-line>span,.motion-paused .hero-top,.motion-paused .hero-side,.motion-paused .hero-stage,.motion-paused .fit-question,.motion-paused .fit-option,.motion-paused .fit-result,.motion-paused .service-body{opacity:1!important;transform:none!important;clip-path:none!important}.motion-paused .hero-browser,.motion-paused .phone-mock,.motion-paused .stage-tag{translate:none!important}.motion-paused dialog[open]{opacity:1;transform:none}
@keyframes line-arrive{from{transform:translateY(112%);opacity:.2}to{transform:translateY(0);opacity:1}}@keyframes soft-arrive{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}@keyframes stage-arrive{from{opacity:0;transform:translateY(35px) scale(.98);clip-path:inset(6% 0 0 0)}to{opacity:1;transform:none;clip-path:inset(0)}}@keyframes studio-float{0%,100%{translate:0 0}50%{translate:0 -12px}}@keyframes phone-float{0%,100%{translate:0 0}50%{translate:-3px -17px}}@keyframes tag-float{0%,100%{translate:0 0}50%{translate:0 -7px}}@keyframes studio-ticker{to{transform:translateX(-50%)}}@keyframes option-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes dialog-arrive{from{opacity:0;transform:translateY(20px) scale(.985)}to{opacity:1;transform:none}}@keyframes backdrop-arrive{from{opacity:0}to{opacity:1}}
@media(max-width:1050px){.featured-case{grid-template-columns:.85fr 1.4fr;gap:28px}.featured-copy{padding-top:15px}.featured-copy h3{font-size:39px}.featured-copy>p:not(.eyebrow){font-size:11px}.featured-visual{padding:38px 0 0}.case-credit{font-size:5px}.ma-browser img{aspect-ratio:1348/926;object-position:top left}.preview-tools{gap:14px}.full-demo-link{font-size:9px}.project-dialog:has(.is-live-demo) .project-dialog-head h2{font-size:30px}.studio-ticker{margin-top:32px}.ticker-track>span{font-size:28px}.work{padding-top:70px}}
@media(max-width:700px){.site-header{background:#f5f4eef7}.hero-line{padding-bottom:.12em;margin-bottom:-.12em}.studio-ticker{margin-top:25px;padding:14px 0}.ticker-track>span{font-size:23px;letter-spacing:-.8px}.ticker-track b{margin:0 18px}.work{padding-top:55px}.featured-case{grid-template-columns:1fr;gap:0;margin-bottom:42px}.featured-copy{padding:0 0 28px}.featured-copy .eyebrow{font-size:7px}.featured-copy h3{font-size:42px;margin:23px 0 18px}.featured-copy>p:not(.eyebrow){font-size:12px;max-width:310px}.case-details{font-size:10px;margin:20px 0 23px;gap:7px}.case-credit{font-size:6px;margin-top:22px}.featured-visual{padding:34px 0 0;min-height:0}.featured-visual-label{top:18px;left:18px;right:18px;font-size:5px}.ma-browser img{aspect-ratio:1348/926}.ma-browser-chrome{font-size:4px;height:17px;padding:0 8px}.ma-browser-chrome>span:first-child{font-size:4px}.demo-play{right:15px;bottom:16px;font-size:6px;gap:7px;padding:8px 10px}.demo-play>span{width:22px;height:22px;font-size:13px}.preview-tools{align-items:flex-end;gap:11px;flex-direction:column}.full-demo-link{font-size:8px}.project-dialog:has(.is-live-demo) .project-dialog-head h2{font-size:27px;letter-spacing:-1.4px}.project-dialog:has(.is-live-demo) .project-dialog-head .eyebrow{max-width:180px;font-size:6px}.project-preview.is-live-demo{padding:10px;margin:0 10px}.live-demo-shell[data-view=mobile]{height:570px}.live-demo-shell[data-view=mobile] iframe{height:640px}.project-dialog:has(.is-live-demo) .project-dialog-foot{padding:20px 18px}.footer-controls{gap:20px}.footer-controls #motion-toggle{font-size:7px}.motion-enabled [data-reveal]{transform:translateY(24px)}.motion-enabled .hero-browser{animation-duration:9s}.motion-enabled .phone-mock{animation-duration:8s}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.hero-line>span,[data-reveal]{opacity:1!important;transform:none!important}.hero-browser,.phone-mock,.stage-tag{translate:none!important}.reading-progress{display:none}.ma-browser{transform:none}.hero-browser,.hero-browser:hover{transform:rotate(-3deg)}}
/* Interactive surfaces keep stable hit areas while revealing. */
.motion-enabled .featured-case[data-reveal],.motion-enabled .work-card[data-reveal],.motion-enabled .fit-widget[data-reveal],.motion-enabled #inquiry-form[data-reveal]{transform:none}
.motion-enabled .featured-case.is-visible .ma-browser img{animation:poster-arrive 1.15s cubic-bezier(.16,1,.3,1) both}
@keyframes poster-arrive{from{clip-path:inset(5% 0 0);opacity:.65}to{clip-path:inset(0);opacity:1}}
@media(max-width:700px){.mobile-menu{position:fixed;top:80px;max-height:calc(100dvh - 80px);overflow:auto}}
.dialog-toolbar{position:sticky;top:0;z-index:5;background:var(--paper)}
.motion-paused{scroll-behavior:auto}
.site-header:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--paper);box-shadow:0 0 0 100vmax var(--paper);clip-path:inset(0 -100vmax)}

.real-demo-grid{grid-template-columns:1fr 1fr}.real-demo-art{padding:50px 28px 35px;background:#d9decf;height:390px;display:flex;align-items:center}.real-demo-art.colbo-demo-art{background:#ded9cf}.real-demo-label{position:absolute;left:25px;top:20px;font-size:6px;letter-spacing:.8px;color:#65715b}.real-demo-window{display:block;width:100%;transform:rotate(-2deg);box-shadow:0 18px 28px -14px #1a241c55;transition:transform .55s}.colbo-demo-art .real-demo-window{transform:rotate(2deg)}.real-demo-window>img{width:100%;height:auto;aspect-ratio:1348/926;object-fit:cover;object-position:top}.real-demo-art:hover .real-demo-window{transform:rotate(0deg) translateY(-4px)}.real-demo-art:hover img{transform:none}.hero .vela-logo{font-family:Manrope,Arial,sans-serif;letter-spacing:1px}.hero .vela-copy h2{font-size:50px}.hero .phone-copy{font-size:22px}
@media(max-width:1050px){.real-demo-art{height:320px;padding:43px 20px 30px}.hero .vela-copy h2{font-size:40px}.hero .phone-copy{font-size:19px}}
@media(max-width:700px){.real-demo-grid{grid-template-columns:1fr}.real-demo-art{height:315px;padding:43px 20px 30px}.real-demo-label{left:20px;font-size:6px}.hero .vela-copy h2{font-size:29px}.hero .phone-copy{font-size:13px}.real-demo-window .ma-browser-chrome{font-size:4px;height:17px}}