@charset "UTF-8";
:root{color-scheme:dark;--bg:#020615;--text:#f8f9fd;--muted:#aebbd6;--line:rgba(168,190,231,.22);--blue:#0751ff;font-family:Arial,Helvetica,sans-serif;font-synthesis:none}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;color:var(--text);background:radial-gradient(ellipse 65% 680px at 100% 0,#1953d6 0,rgba(3,29,102,.65) 39%,transparent 80%),radial-gradient(ellipse 700px 650px at 3% 590px,rgba(0,27,120,.46),transparent 80%),var(--bg);font-size:16px;line-height:1.5}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;border:0}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:400}:focus-visible{outline:2px solid #8eb7ff;outline-offset:5px}.container{width:calc(100% - 112px);max-width:1292px;margin-inline:auto}.wide-container{width:calc(100% - 112px);max-width:1400px;margin-inline:auto}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;left:20px;top:-80px;background:white;color:#020615;padding:12px 20px;z-index:50;border-radius:6px}.skip-link:focus{top:12px}[hidden]{display:none!important}
.site-header{border-bottom:1px solid rgba(174,192,231,.16);background:linear-gradient(90deg,rgba(0,0,0,.45),rgba(1,13,44,.08))}.header-inner{height:105px;display:flex;align-items:center}.brand{display:inline-flex;align-items:center;gap:3px;flex:none}.brand img{width:64px;height:64px}.brand-words{font-weight:800;letter-spacing:-.5px;line-height:.9;font-size:22px}.header-divider{height:35px;width:1px;background:var(--line);margin:0 52px 0 64px}.primary-nav{display:flex;gap:46px;color:#c5cfe4}.primary-nav a{font-size:16px;transition:color .2s}.primary-nav a:hover{color:white}.header-cta{margin-left:auto}.button{min-height:53px;display:inline-flex;align-items:center;justify-content:center;gap:24px;padding:13px 23px;border:1px solid transparent;border-radius:10px;font-size:16px;font-weight:400;line-height:1.5;transition:background .2s,transform .2s,border-color .2s}.button:hover{transform:translateY(-2px)}.button-blue{background:var(--blue);color:white}.button-blue:hover{background:#2868ff}.button-white{background:#f6f7fb;color:#080d21}.button-white:hover{background:white}.button-outline{background:rgba(4,9,23,.34);border-color:#536079;color:#f9fbff}.button-outline:hover{background:#10192b;border-color:#a2b2d0}.menu-toggle{display:none;background:transparent;padding:12px}.menu-toggle span{display:block;background:white;width:25px;height:1px;margin:7px 0}
.hero{position:relative;min-height:730px;padding-top:83px;isolation:isolate}.hero-copy{position:relative;z-index:2;width:500px;max-width:42%}.eyebrow{font-size:11px;font-weight:500;letter-spacing:3px;text-transform:uppercase;line-height:1.65;color:#e0e8fa}.hero h1{font-size:84px;line-height:1.035;letter-spacing:-5px;margin-top:25px;margin-left:-4px;white-space:nowrap}.hero-description{font-size:20px;line-height:1.5;letter-spacing:-.3px;color:var(--muted);margin-top:34px}.hero-actions{display:flex;align-items:center;gap:15px;margin-top:51px;white-space:nowrap}.hero-actions .button{padding-inline:22px}.showcase{position:absolute;left:39.4%;top:26px;width:66.6%;aspect-ratio:860/700;overflow:hidden;z-index:0;pointer-events:none;-webkit-mask-image:linear-gradient(to right,transparent,#000 2%,#000 98%,transparent);mask-image:linear-gradient(to right,transparent,#000 2%,#000 98%,transparent)}.showcase img{position:absolute;max-width:none;width:175.93023%;height:auto;left:-70.93023%;top:-18.57143%}.expertises{display:grid;grid-template-columns:repeat(3,1fr);padding:32px 0 42px;border-top:1px solid #314062;position:relative}.service{display:grid;grid-template-columns:75px 1fr;gap:23px;padding:5px 33px 0 43px;border-right:1px solid #28365a;transition:background .2s}.service:last-child{border:0}.service:first-child{padding-left:46px}.service-icon,.service-icon svg{width:56px;height:56px;display:block}.service-icon svg{fill:none;stroke:#f1f5ff;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}.service-icon .icon-pixel{fill:var(--blue);stroke:none}.service h2{font-size:21px;margin:4px 0 9px;letter-spacing:-.4px}.service p{font-size:14px;line-height:1.7;color:var(--muted);max-width:300px}.arrow{font-size:28px;display:inline-block;line-height:1.2;margin-top:6px;transition:transform .2s}.service:hover .arrow{transform:translateX(8px)}.service:hover h2{color:#9fc1ff}
.section{padding-block:110px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px}.section h2{font-size:52px;letter-spacing:-2.6px;line-height:1.12;margin-top:20px}.section-heading>p{color:var(--muted);font-size:16px;line-height:1.7;padding-bottom:5px}.portfolio{padding-top:115px}.filters{display:flex;gap:8px;flex-wrap:wrap;margin:40px 0 28px}.filter{background:transparent;border:1px solid transparent;border-radius:50px;padding:10px 18px;font-size:14px;color:var(--muted);transition:all .2s}.filter span{font-size:10px;margin-left:10px;color:#aab8d5}.filter:hover{color:white}.filter.active{border-color:#344362;background:#10182a;color:white}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px 30px}.project-visual{display:block;position:relative;aspect-ratio:1.46;overflow:hidden;width:100%;border:1px solid rgba(172,188,222,.13);border-radius:13px;text-align:left;background:#091025;color:inherit;padding:0;isolation:isolate}.garage-visual{background:radial-gradient(ellipse at 70% 20%,#1c314e,#070b13 70%)}.garage-crop{position:absolute;top:11%;left:4%;width:92%;aspect-ratio:630/545;overflow:hidden;transform:rotate(-3deg);transition:transform .4s}.garage-crop img{position:absolute;width:240.16%;max-width:none;height:auto;left:-99.2%;top:-51.2%}.project-visual:hover .garage-crop{transform:rotate(-3deg) scale(1.035)}.project-badge{position:absolute;z-index:3;top:21px;left:22px;background:rgba(4,9,20,.83);border:1px solid rgba(255,255,255,.15);padding:6px 10px;border-radius:5px;color:#e3eaf9;font-size:10px;font-weight:400;letter-spacing:.5px}.project-open{position:absolute;z-index:3;right:20px;bottom:20px;border:1px solid #69758a;background:#060e1e70;border-radius:50%;width:40px;height:40px;display:grid;place-items:center;font-size:22px;transition:background .2s}.project-visual:hover .project-open{background:#0751ff;border-color:#0751ff}.project-caption{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:20px}.project-caption p{color:#8e9fbc;font-size:12px;margin-bottom:6px}.project-caption h3{font-size:22px;letter-spacing:-.6px}.text-link{background:transparent;padding:5px 0;font-size:12px;color:#c6d2eb;white-space:nowrap}.text-link span{margin-left:9px}.text-link:hover{color:white}.shop-visual{background:radial-gradient(ellipse at 40% 30%,#2d3b4d,#121c2b 75%)}.shop-wordmark{position:absolute;top:38%;left:8%;font-family:Georgia,serif;font-size:39px;line-height:1.07;color:#e9e3d8;letter-spacing:-1.8px}.shop-phone{position:absolute;top:9%;left:60%;height:82%;aspect-ratio:372/780;transform:rotate(6deg);transition:transform .4s;filter:drop-shadow(0 15px 16px #0005)}.shop-phone img{display:block;width:100%;height:100%;object-fit:contain}.project-visual:hover .shop-phone{transform:rotate(3deg) translateY(-4px)}.project-wide{grid-column:1/-1}.project-wide .project-visual{aspect-ratio:3.07;min-height:350px}.app-visual{background:linear-gradient(120deg,#141e2c,#111824 48%,#1b3443);display:flex;align-items:center;justify-content:space-between;padding:68px 45px 35px;gap:45px}.app-pitch{width:32%;flex:none}.atelio-logo{font-size:20px;letter-spacing:3px;font-weight:700}.atelio-logo>sup{font-size:10px;margin-left:3px}.app-pitch h3{font-size:31px;line-height:1.18;letter-spacing:-1px;margin:25px 0}.demo-pill{display:inline-flex;font-size:11px;border-bottom:1px solid #77848b;padding-bottom:7px;gap:25px}.dashboard-preview{width:65%;min-width:600px;display:flex;background:#f3f5f6;color:#152a32;border-radius:9px;overflow:hidden;box-shadow:0 18px 60px #0006;transform:rotate(-3deg) translateY(15px);transition:transform .4s;min-height:300px}.app-visual:hover .dashboard-preview{transform:rotate(-2deg) translateY(9px)}.dashboard-preview aside{width:118px;background:#142b32;color:#d0dee0;flex:none;padding:22px 10px}.dashboard-preview aside strong{display:block;font-size:25px;margin:0 10px 20px;color:#f2f7f3}.dashboard-preview aside strong span{color:#93b29f}.dashboard-preview aside i{display:block;font-style:normal;font-size:8px;padding:9px;border-radius:4px;white-space:nowrap}.dashboard-preview aside .selected{background:#34504e}.dashboard-body{padding:25px;width:100%;font-size:10px}.dashboard-top{font-size:17px;font-weight:600;display:flex;align-items:center;justify-content:space-between}.dashboard-top span{font-size:8px;background:#e0eae5;color:#537262;padding:4px 9px;border-radius:3px}.dashboard-body>p{margin:5px 0 20px;color:#748188;font-size:9px}.dashboard-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.dashboard-stats>div{background:white;border:1px solid #dfe5e6;border-radius:5px;padding:11px 10px}.dashboard-stats small{display:block;font-size:7px;color:#6c797e}.dashboard-stats b{display:block;font-size:20px;line-height:1.3;margin:6px 0}.dashboard-stats em{font-size:6px;display:block;color:#47785d;font-style:normal}.dashboard-table{padding:14px;background:white;border:1px solid #dfe5e6;border-radius:5px;margin-top:14px}.dashboard-table>b{display:block;font-size:10px;margin-bottom:8px}.dashboard-table>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid #edf0f1}.dashboard-table span{width:43%;font-size:7px}.dashboard-table i{height:4px;width:35%;border-radius:3px;background:linear-gradient(to right,#497d70 var(--progress),#e4ebe8 var(--progress))}.dashboard-table small{font-size:7px}.portfolio-note{font-size:12px;color:#8191ae;margin-top:26px}
.about{background:linear-gradient(135deg,#0b1327,rgba(4,10,25,.5));border-block:1px solid #19243c}.about-grid{display:grid;grid-template-columns:1fr 1.12fr;gap:90px}.about h2{margin-top:26px;font-size:49px}.about h2>span{color:#8394b6}.holding-signature{display:flex;gap:12px;align-items:center;margin-top:46px;font-size:10px;line-height:1.7;color:#8e9fbb}.holding-signature strong{font-size:12px;font-weight:500;letter-spacing:1.4px;color:#e4eaf5}.about-copy>.large-copy{color:#e8edf8;font-size:24px;line-height:1.5;letter-spacing:-.5px}.about-copy>p{color:var(--muted);font-size:15px;line-height:1.85;margin-bottom:25px}.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;border-top:1px solid var(--line);padding-top:28px;margin-top:40px}.principles>div>span{font-size:11px;color:#759bff}.principles h3{font-size:16px;margin-top:14px;margin-bottom:8px}.principles p{font-size:12px;color:#91a2bf;line-height:1.7}.contact-section{display:flex;justify-content:space-between;align-items:center;gap:40px;padding-block:110px 115px}.contact-section h2{font-size:50px}.contact-section p:not(.eyebrow){color:var(--muted);font-size:16px;margin-top:24px}.contact-section>.button{margin-top:30px;flex:none;min-width:220px}.site-footer{border-top:1px solid var(--line);background:rgba(0,0,0,.18)}.footer-inner{display:flex;align-items:center;gap:26px;min-height:115px}.site-footer .brand img{width:42px;height:42px}.site-footer .brand-words{font-size:15px}.footer-inner>p{font-size:12px;color:#8394b2;margin-left:20px}.footer-inner>span{margin-left:auto;color:#7789a8;font-size:11px}.footer-link{background:transparent;font-size:11px;color:#9aa9c2;padding:10px 0}.back-top{display:grid;place-items:center;width:34px;height:34px;border:1px solid #3c4a62;border-radius:50%;font-size:20px}
dialog{color:var(--text);border:1px solid #394760;background:#0a1225;border-radius:18px;width:min(680px,calc(100% - 32px));max-height:calc(100dvh - 40px);padding:42px;box-shadow:0 30px 130px #000b;overflow-y:auto}dialog::backdrop{background:#010511cf;backdrop-filter:blur(9px)}body.modal-open{overflow:hidden}dialog h2{font-size:42px;line-height:1.1;letter-spacing:-2px;margin:20px 0}.dialog-close{position:absolute;right:15px;top:13px;background:#162139;border:1px solid #35415a;border-radius:50%;width:32px;height:32px;font-size:25px;line-height:1;display:grid;place-items:center}.dialog-intro{font-size:14px;line-height:1.7;color:#adbedb;margin-bottom:26px}fieldset{padding:0;border:0;margin:0 0 24px}legend,.field{display:block;font-size:13px;color:#d6e0f3}legend{margin-bottom:10px}.type-options{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.type-options label{position:relative;cursor:pointer}.type-options input{position:absolute;opacity:0;width:1px;height:1px}.type-options span{display:block;text-align:center;border:1px solid #33415b;border-radius:7px;padding:12px 8px;font-size:13px;color:#b9c7e1}.type-options input:checked+span{background:#0b307c;border-color:#387aff;color:white}.type-options input:focus-visible+span{outline:2px solid #9bbcff;outline-offset:3px}.field{margin-bottom:19px}.field input,.field textarea,.field select{display:block;border:1px solid #34425c;border-radius:7px;background:#070e1f;color:white;width:100%;font-size:14px;padding:12px;margin-top:8px}.field textarea{resize:vertical;min-height:100px}.field input::placeholder,.field textarea::placeholder{color:#7f91b1}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.download-button{width:100%;margin-top:4px}.form-note{font-size:11px;color:#8f9fbb;text-align:center;margin-top:13px}.form-status{color:#b6d4ff;font-size:13px;line-height:1.6;margin-top:12px;text-align:center}.privacy-dialog p:not(.eyebrow){font-size:14px;line-height:1.8;color:var(--muted);margin:18px 0}.detail-dialog .project-visual{margin:22px 0;aspect-ratio:1.8;min-height:240px;pointer-events:none}.detail-dialog h2{margin-bottom:12px}.detail-tags{display:flex;gap:8px;flex-wrap:wrap}.detail-tags span{font-size:11px;border:1px solid #34415b;padding:5px 10px;border-radius:20px;color:#aabbd7}.detail-description{color:#bac7dd;font-size:15px;line-height:1.8;margin-top:22px}.detail-dialog .button{margin-top:25px}.detail-dialog .shop-phone{left:62%;top:8%;height:84%}.detail-dialog .shop-wordmark{top:30%}
@media(min-width:1600px){.hero{min-height:750px}.showcase{top:35px}.hero-copy{max-width:43%}}
@media(max-width:1300px){.container{width:calc(100% - 88px)}.wide-container{width:calc(100% - 64px)}.header-divider{margin-inline:40px}.primary-nav{gap:30px}.hero{min-height:665px;padding-top:75px}.hero h1{font-size:72px;letter-spacing:-4.5px}.hero-description{font-size:18px;max-width:435px}.hero-actions{gap:10px;margin-top:38px}.hero-actions .button{font-size:13px;padding-inline:18px;min-height:49px}.showcase{top:50px;left:40%;width:66%}.service{grid-template-columns:55px 1fr;gap:18px;padding-inline:25px}.service:first-child{padding-left:20px}.service h2{font-size:20px}.service p{font-size:13px}.service-icon,.service-icon svg{width:48px;height:48px}.about-grid{gap:50px}.section h2{font-size:46px}.shop-wordmark{font-size:34px}.app-visual{padding-left:35px;gap:35px}.dashboard-preview{min-width:540px}.app-pitch h3{font-size:28px}}
@media(max-width:1050px){.header-inner{height:92px}.header-divider{margin:0 30px}.primary-nav{gap:24px}.primary-nav a{font-size:14px}.header-cta{font-size:13px;min-height:46px;padding-inline:17px}.brand img{width:55px;height:55px}.brand-words{font-size:19px}.hero{min-height:590px;padding-top:65px}.hero h1{font-size:63px;letter-spacing:-4px}.hero .eyebrow{font-size:9px;letter-spacing:2.4px}.hero-description{font-size:16px}.hero-actions{flex-wrap:wrap;max-width:210px;gap:11px;margin-top:30px}.hero-actions .button{width:100%}.showcase{top:70px;left:37%;width:71%}.service{grid-template-columns:1fr;gap:10px;padding-inline:26px}.service-icon,.service-icon svg{width:39px;height:39px}.expertises{padding-block:26px 35px}.service p{max-width:280px}.section{padding-block:85px}.section-heading>p{font-size:14px}.section h2{font-size:40px}.about-grid{gap:40px;grid-template-columns:.95fr 1.05fr}.about-copy>.large-copy{font-size:20px}.principles{gap:15px}.principles p{font-size:11px}.app-visual{gap:20px}.app-pitch{width:30%}.app-pitch h3{font-size:26px}.dashboard-preview{min-width:510px}.project-caption{gap:12px}.project-caption h3{font-size:20px}.text-link{font-size:11px}.footer-inner{gap:20px}.footer-inner>p{margin-left:5px;max-width:180px}}
@media(max-width:780px){html{scroll-padding-top:15px}body{background:radial-gradient(ellipse 600px 800px at 100% 0,rgba(13,63,169,.65),transparent 80%),radial-gradient(ellipse 700px 700px at 0 1100px,#001037,transparent 80%),var(--bg)}.container,.wide-container{width:calc(100% - 40px)}.header-inner{height:86px}.brand img{width:52px;height:52px}.brand-words{font-size:18px}.header-divider{display:none}.header-cta{margin-left:auto;margin-right:12px;font-size:11px;min-height:40px;padding:10px 13px;border-radius:7px}.menu-toggle{display:block;padding-right:0}.primary-nav{display:none;position:absolute;left:20px;right:20px;top:78px;z-index:10;border:1px solid #324264;background:#0a142b;border-radius:10px;padding:12px;box-shadow:0 20px 60px #0008}.primary-nav.is-open{display:flex;flex-direction:column;gap:0}.primary-nav a{padding:13px 15px;font-size:16px}.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(4px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-4px) rotate(-45deg)}.hero{padding-top:52px;min-height:0;padding-bottom:0}.hero-copy{max-width:none;width:100%}.hero .eyebrow{font-size:9px;letter-spacing:2.3px}.hero h1{font-size:clamp(54px,10.7vw,81px);letter-spacing:-3.5px;line-height:1.03;margin-top:25px}.hero-description{max-width:490px;font-size:17px;line-height:1.6;margin-top:28px}.desktop-break{display:none}.hero-actions{max-width:none;flex-wrap:nowrap;gap:10px;margin-top:29px}.hero-actions .button{width:auto;min-height:47px;font-size:12px;padding-inline:15px}.showcase{position:relative;left:-3%;top:auto;width:109%;aspect-ratio:860/700;margin-top:25px;mask-image:linear-gradient(to right,transparent,#000 2%,#000 98%,transparent)}.expertises{grid-template-columns:1fr;padding:8px 0 0;margin-top:6px}.service,.service:first-child{grid-template-columns:51px 1fr;padding:25px 5px;gap:20px;border:0;border-bottom:1px solid #243453}.service:last-child{border-bottom:1px solid #243453}.service-icon,.service-icon svg{width:43px;height:43px}.service h2{font-size:22px;margin:0 0 6px}.service p{font-size:14px;max-width:490px;padding-right:32px}.service>div{position:relative}.service .arrow{position:absolute;right:0;top:25px}.section{padding-block:74px}.section-heading{display:block}.section h2{font-size:39px;letter-spacing:-1.9px;margin-top:16px}.section-heading>p{margin-top:20px;font-size:14px}.filters{margin-top:28px;gap:1px;margin-bottom:24px}.filter{padding:9px 12px;font-size:12px}.filter span{font-size:9px;margin-left:6px}.project-grid{grid-template-columns:1fr;gap:35px}.project-visual{aspect-ratio:1.4}.project-wide{grid-column:auto}.shop-wordmark{font-size:42px}.project-caption h3{font-size:23px}.project-caption p{font-size:11px}.text-link{font-size:12px}.project-wide .project-visual{aspect-ratio:auto;min-height:490px}.app-visual{display:block;padding:65px 25px 0}.app-pitch{width:100%}.app-pitch h3{font-size:29px;margin:18px 0}.atelio-logo{font-size:17px}.dashboard-preview{margin-top:20px;margin-left:15px;width:115%;min-width:450px;min-height:270px}.app-visual .project-badge{font-size:9px}.project-caption{margin-top:17px}.portfolio-note{font-size:11px;line-height:1.65;margin-top:25px}.about-grid{grid-template-columns:1fr;gap:35px}.about h2{font-size:42px}.holding-signature{margin-top:27px}.about-copy>.large-copy{font-size:22px}.principles{gap:24px;margin-top:30px}.principles p{font-size:12px}.contact-section{display:block}.contact-section h2{font-size:38px}.contact-section p:not(.eyebrow){font-size:15px;line-height:1.8}.contact-section>.button{margin-top:30px;min-width:220px}.footer-inner{padding-block:30px;display:grid;grid-template-columns:1fr auto;gap:22px}.footer-inner>p{max-width:none;grid-column:1/-1;grid-row:2;margin:0;font-size:12px}.footer-inner>span{margin:0;font-size:10px}.footer-link{grid-column:2;grid-row:3;text-align:right;font-size:10px;padding:0}.back-top{grid-column:2;grid-row:1;justify-self:end}.site-footer .brand{justify-self:start}.site-footer .brand img{width:40px;height:40px}}
@media(max-width:430px){.container,.wide-container{width:calc(100% - 36px)}.header-cta{font-size:10px;padding-inline:10px;margin-right:10px}.hero-actions .button{font-size:11px;padding-inline:11px;gap:0;border-radius:7px}.hero h1{font-size:57px;letter-spacing:-3.5px}.hero-description{font-size:16px}.eyebrow{font-size:9px;letter-spacing:2px}.shop-wordmark{font-size:33px}.principles{gap:16px}.principles h3{font-size:14px}.principles p{font-size:11px}.section h2{font-size:36px}.project-caption .text-link{font-size:10px}.filter{padding:8px 10px;font-size:11px}dialog{padding:34px 23px}dialog h2{font-size:36px}.form-row{grid-template-columns:1fr;gap:0}.type-options{gap:7px}.type-options span{font-size:12px;padding-inline:4px}.brief-dialog .eyebrow{max-width:220px}.detail-dialog .shop-wordmark{font-size:29px}.detail-dialog .project-visual{min-height:205px}}
main{overflow-x:clip}
@media(max-width:360px){.hero h1{font-size:51px}.hero-actions{flex-wrap:wrap}.hero-actions .button{font-size:12px}.header-cta{max-width:123px;line-height:1.25}.hero .eyebrow{letter-spacing:1.8px}}
/* Interactive project showcase: independent layers, with the original artwork. */
.showcase{left:42%;width:63%;overflow:visible;pointer-events:auto;mask-image:none;-webkit-mask-image:none;z-index:1;isolation:isolate}
.showcase::before{content:"";position:absolute;inset:5% -5% 12% 10%;background:radial-gradient(ellipse,rgba(30,91,232,.19),transparent 68%);pointer-events:none}
.showcase-stage{position:absolute;inset:0 0 64px;perspective:1200px}
.showcase-card{position:absolute;display:block;padding:0;border:0;background:none;border-radius:12px;transform-origin:center;transition:left .95s cubic-bezier(.22,.68,.2,1),top .95s cubic-bezier(.22,.68,.2,1),width .95s cubic-bezier(.22,.68,.2,1),transform .65s cubic-bezier(.22,.68,.2,1),filter .6s,opacity .6s;filter:brightness(.78) drop-shadow(0 16px 22px #0004);opacity:.94;will-change:transform;cursor:pointer}
.showcase-card[data-slot="front"]{left:3%;top:14%;width:73%;z-index:3;transform:rotate(-2deg);filter:brightness(1) drop-shadow(0 26px 32px #0007);opacity:1}
.showcase-card[data-slot="back"]{left:37%;top:3%;width:60%;z-index:1;transform:rotate(3deg)}
.showcase-card[data-slot="side"]{left:57%;top:45%;width:43%;z-index:2;transform:rotate(6deg)}
.showcase-screen{display:block;position:relative;overflow:hidden;width:100%}
.garage-screen{aspect-ratio:630/540;clip-path:polygon(0 0,100% 8.5%,100% 100%,0 83%)}
.garage-screen img{position:absolute;max-width:none;width:240.16%;height:auto;left:-99.2%;top:-51.48%}
.showcase-phone[data-slot="front"]{left:35%;top:4%;width:30%;transform:rotate(-3deg)}
.showcase-phone[data-slot="back"]{left:70%;top:0;width:21%;transform:rotate(4deg)}
.showcase-phone[data-slot="side"]{left:79%;top:40%;width:20%;transform:rotate(3deg)}


.app-screen{aspect-ratio:1.45;border:1px solid #5d7295;border-radius:10px;background:#f1f4fa;color:#14213b;container-type:inline-size;box-shadow:0 15px 50px #0004}
.browser-bar{display:flex;gap:1%;align-items:center;height:7%;padding:0 3%;background:#121d35;color:#8d9dbb;font-size:1.6cqw}
.browser-bar>i{width:1.1%;aspect-ratio:1;background:#8293ae;border-radius:50%}.browser-bar>span{margin:auto}
.hero-dashboard{display:flex;height:93%;text-align:left}.hero-app-sidebar{display:block;width:22%;flex:none;background:#0d1930;color:#a8b8d4;padding:5% 2%;font-size:1.6cqw}
.hero-app-sidebar>b{display:block;font-size:7cqw;color:#fff;margin:0 10% 24%}.hero-app-sidebar>b span{color:#6e9fff}
.hero-app-sidebar>i{display:block;padding:9% 10%;font-style:normal;border-radius:3px;margin-bottom:4%;white-space:nowrap}.hero-app-sidebar>.selected{background:#174393;color:#e9f1ff}
.hero-app-body{display:block;width:78%;padding:5% 3%}.hero-app-heading{display:flex;justify-content:space-between;align-items:center;font-size:2.8cqw;font-weight:600;margin-bottom:5%}.hero-app-heading>small{font-size:1.4cqw;color:#315ca3;background:#e1eafc;padding:1% 4%;border-radius:3px}
.hero-app-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:3%}.hero-app-stats>span{display:block;background:#fff;border:1px solid #e4e9f2;border-radius:4px;padding:10%}.hero-app-stats small{display:block;font-size:1.35cqw;color:#6c7890}.hero-app-stats b{display:block;font-size:4cqw;margin-top:10%}
.hero-app-chart{position:relative;display:flex;align-items:flex-end;gap:5%;height:35%;margin:5% 0;padding:10% 5% 0;background:repeating-linear-gradient(to bottom,#f6f8fc 0,#f6f8fc 24%,#e0e6f1 25%);border-bottom:1px solid #d5e0f0}.hero-app-chart>span{position:absolute;top:7%;left:5%;font-size:1.7cqw;color:#77849c}.hero-app-chart>i{flex:1;height:var(--bar);border-radius:3px 3px 0 0;background:linear-gradient(#2468ed,#96bbfb)}
.hero-app-row{display:flex;justify-content:space-between;align-items:center;font-size:1.6cqw;padding:2.8% 2%;border-bottom:1px solid #e1e7f1}.hero-app-row>b{font-size:1.4cqw;font-weight:500;background:#e2edff;color:#426db2;padding:1% 4%;border-radius:3px}
.showcase-card:focus-visible{z-index:8;transform:translateY(-10px) scale(1.055);filter:brightness(1.08) drop-shadow(0 25px 35px #061e6388);opacity:1;outline-offset:8px}
.showcase-controls{position:absolute;bottom:3%;left:7%;right:2%;display:flex;align-items:center;gap:8px;min-height:42px;z-index:12}
.showcase-current{margin-right:auto;min-width:0}.showcase-current>span{display:block;font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:#92a8ce}.showcase-current>strong{display:block;font-size:13px;font-weight:400;margin-top:3px;color:#edf3ff}
.showcase-dots{display:flex;align-items:center;margin-inline:6px;gap:1px}.showcase-dots button{display:grid;place-items:center;background:none;width:25px;height:36px;padding:0}.showcase-dots button::after{content:"";display:block;width:5px;height:5px;border-radius:50%;background:#52668b;transition:width .4s,background .4s}.showcase-dots button.is-active::after{width:18px;border-radius:4px;background:#78a7ff}
.showcase-control{display:grid;place-items:center;width:34px;height:34px;flex:none;border:1px solid #34496d;border-radius:50%;background:#08142b9c;color:#d1e1ff;font-size:17px;transition:background .2s,border-color .2s}.showcase-control:hover{background:#183b75;border-color:#82aaff}.showcase-pause{font-size:11px}
.project-grid>.project{position:relative;z-index:0;transition:transform .45s cubic-bezier(.22,.68,.2,1)}
.project-grid>.project .project-visual{transition:box-shadow .45s,border-color .45s,filter .45s}
.project-grid>.project:focus-within{z-index:3;transform:translateY(-8px) scale(1.015)}
.project-grid>.project:focus-within .project-visual{border-color:#688ac7;box-shadow:0 25px 55px #0008,0 0 32px #1353cf20}
@media(hover:hover) and (pointer:fine){
.showcase-card:hover{z-index:8;transform:translateY(-10px) scale(1.055);filter:brightness(1.08) drop-shadow(0 25px 35px #061e6388);opacity:1}
.project-grid>.project:hover{z-index:3;transform:translateY(-10px) scale(1.025)}
.project-grid>.project:hover .project-visual{border-color:#688ac7;box-shadow:0 30px 65px #0008,0 0 40px #1353cf25;filter:brightness(1.08)}
}
@media(min-width:781px) and (max-width:1050px){.showcase{left:40%;width:65%;top:55px}.showcase-controls{gap:5px}.showcase-current>strong{font-size:11px}.showcase-dots{margin-inline:1px}.showcase-dots button{width:20px}}
@media(max-width:780px){.showcase{position:relative;left:-2%;width:104%;top:auto;aspect-ratio:860/750;margin-top:35px;mask-image:none;-webkit-mask-image:none}.showcase-stage{bottom:70px}.showcase-controls{left:6%;right:4%;bottom:1%;gap:6px}.showcase-control{width:38px;height:38px}.showcase-current>strong{font-size:12px}.showcase-current>span{font-size:8px}.showcase-card[data-slot="front"]{top:12%}.project-grid>.project:focus-within{transform:translateY(-5px)}.app-screen{border-radius:6px}}
@media(max-width:380px){.showcase-controls{gap:3px;left:4%;right:1%}.showcase-control{width:33px;height:33px}.showcase-dots button{width:20px}.showcase-current>strong{font-size:11px}}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* Refined portfolio and Paris contact section. */
.site-header{position:relative;z-index:20}.primary-nav{gap:30px}.header-divider{margin-inline:36px}.primary-nav a{position:relative}.primary-nav a::after{content:"";position:absolute;height:1px;left:0;right:100%;bottom:-7px;background:#84acff;transition:right .25s}.primary-nav a:hover::after{right:0}
.hero::before{content:"";position:absolute;inset:0 -40px 0 40%;z-index:-1;pointer-events:none;background-image:linear-gradient(#95b6ff09 1px,transparent 1px),linear-gradient(90deg,#95b6ff09 1px,transparent 1px);background-size:80px 80px;mask-image:radial-gradient(ellipse,#000,transparent 72%)}
.hero .eyebrow::before{content:"";display:inline-block;width:6px;height:6px;background:#6c9cff;box-shadow:0 0 17px #5387ff;margin-right:12px;vertical-align:2px}.service-signature{display:flex;align-items:center;justify-content:space-between;gap:20px;border-block:1px solid #24314b;padding-block:21px;color:#7f91af;font-size:11px;letter-spacing:.15px}.service-signature>span:first-child{color:#d2dcf0;display:flex;align-items:center;gap:9px}.service-signature i{display:block;width:5px;height:5px;border-radius:50%;background:#78a4ff;box-shadow:0 0 12px #3f7dff}
.portfolio{padding-top:95px}.project-grid{gap:49px 30px}.project-visual{border-radius:16px}.project-caption h3{font-size:23px}.project-caption p{font-size:11px;letter-spacing:.2px}.project-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}.project-tags span{font-size:9px;letter-spacing:.3px;padding:5px 9px;border:1px solid #29364e;border-radius:4px;color:#8e9fbb}.project-application .app-visual{aspect-ratio:1.46;display:block;min-height:0;padding:61px 30px 0;background:radial-gradient(ellipse at 85% 80%,#34574866,transparent 65%),#101e25}.project-application .app-pitch{width:100%}.project-application .atelio-logo{font-size:15px}.project-application .app-pitch h3{font-size:28px;margin:16px 0 15px;line-height:1.14}.project-application .demo-pill{font-size:10px}.project-application .dashboard-preview{width:95%;min-width:450px;min-height:265px;margin:16px 0 0 90px;transform:rotate(-6deg);box-shadow:0 20px 55px #0007}.project-application .app-visual:hover .dashboard-preview{transform:rotate(-4deg) translateY(-7px)}
.enterprise-visual{aspect-ratio:1.46;display:block;background:radial-gradient(ellipse at 85% 70%,#933c514d,transparent 65%),#1b1a26;padding:61px 30px 0}.enterprise-card-heading>span{font-size:9px;letter-spacing:2px;color:#dba3b5}.enterprise-card-heading h3{font-size:28px;line-height:1.14;letter-spacing:-1px;margin:14px 0 0;color:#fff1f5}.enterprise-preview{background:#f5f6fa;color:#252631;border:1px solid #5e5564;border-radius:10px;overflow:hidden;container-type:inline-size;font-family:Arial,sans-serif;text-align:left;box-shadow:0 15px 55px #0006}.enterprise-visual>.enterprise-preview{width:94%;min-width:380px;margin:19px 0 0 87px;transform:rotate(-6deg);transition:transform .5s}.enterprise-visual:hover>.enterprise-preview{transform:rotate(-3deg) translateY(-8px)}
.enterprise-preview-top{display:flex;align-items:center;justify-content:space-between;gap:5%;padding:3% 5%;background:#20212a;color:#f7f5f8;font-size:2cqw;letter-spacing:.3cqw}.enterprise-preview-top>span:first-child{display:flex;align-items:center;gap:10%}.enterprise-preview-top>span>b{font-size:4.8cqw;letter-spacing:-.5cqw}.enterprise-preview-top>span>b>span{color:#f36578}.enterprise-preview-top>small{font-size:1.1cqw;background:#ffffff10;border:1px solid #ffffff19;padding:1.2% 2%;letter-spacing:.2cqw}.enterprise-avatar{width:5cqw;height:5cqw;display:grid;place-items:center;background:#e7a2b2;color:#331720;border-radius:50%;font-size:1.6cqw;letter-spacing:0}.enterprise-preview-body{padding:4% 5%}.mini-eyebrow{display:block;font-size:1.3cqw;letter-spacing:.3cqw;color:#9d5c71}.enterprise-preview-body>strong{display:block;font-size:4.4cqw;line-height:1.15;letter-spacing:-.12cqw;font-weight:600;margin:2% 0 4%}.enterprise-preview-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:3%}.enterprise-preview-metrics>span{display:block;background:white;border:1px solid #e4e5ed;padding:8% 10%;font-size:1.4cqw;color:#747b8e;border-radius:5px}.enterprise-preview-metrics b{display:block;font-size:5.1cqw;color:#222733;margin-bottom:5%;font-weight:600}.enterprise-preview-modules{display:grid;grid-template-columns:repeat(3,1fr);gap:3% 2%;margin-top:5%;padding-bottom:2%}.enterprise-preview-modules>span{padding:10%;background:white;border:1px solid #e3e5ed;border-radius:4px;color:#c94b63;font-size:3cqw;display:flex;align-items:center;gap:10%}.enterprise-preview-modules b{font-size:1.5cqw;color:#545c71;font-weight:500}
.enterprise-screen{border-radius:12px;aspect-ratio:1.45}.enterprise-screen>.enterprise-preview{height:100%;border-radius:12px}.showcase-card[data-slot="queued"]{left:38%;top:12%;width:43%;z-index:0;opacity:0;transform:scale(.7) rotate(8deg);pointer-events:none;visibility:hidden}.showcase-controls{gap:6px}.showcase-current>strong{max-width:210px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.showcase-dots button{width:23px}
.location-section{padding-bottom:70px;scroll-margin-top:30px}.location-topline{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:24px 0;border-top:1px solid #30405b}.location-topline>span{font-size:12px;color:#8396b9}.location-layout{display:grid;grid-template-columns:.85fr 1.35fr;border:1px solid #2b3e60;border-radius:18px;overflow:hidden;background:radial-gradient(ellipse at 0 0,#0c285b,transparent 78%),#071126}.location-info{padding:46px 42px 40px}.location-number{display:inline-block;font-size:9px;letter-spacing:2px;border:1px solid #46618a;color:#a3bae1;border-radius:4px;padding:6px 10px}.location-info h2{font-size:47px;line-height:1.07;letter-spacing:-2.4px;margin-top:24px}.location-intro{color:#9caed0;font-size:13px;line-height:1.8;margin:22px 0 31px}.location-info address{font-style:normal;padding-top:26px;border-top:1px solid #2d3e5c}.contact-label{display:block;font-size:9px;text-transform:uppercase;letter-spacing:1.9px;color:#7f9ac4;margin-bottom:10px}.location-info .street{display:block;font-size:18px;color:#eef3ff;letter-spacing:-.25px}.location-info .city{display:block;font-size:13px;color:#a2b2d0;margin-top:6px}.location-phone{display:block;margin-top:28px}.location-phone strong{font-size:24px;letter-spacing:-.6px;font-weight:400}.location-phone strong>span{font-size:19px;margin-left:16px;color:#7eaaff}.location-phone:hover strong{color:#aacbff}.location-directions{display:inline-flex;align-items:center;gap:20px;font-size:11px;border-bottom:1px solid #455f88;padding-bottom:9px;margin-top:28px;color:#afc7f1}.location-directions:hover{color:white;border-color:#8baeff}.location-map{position:relative;min-height:560px;background:#dce3ec;border-left:1px solid #2b3e60}.location-map iframe{border:0;width:100%;height:100%;min-height:560px;display:block;position:absolute;inset:0}.map-caption{position:absolute;bottom:24px;left:24px;right:24px;z-index:1;background:#071329f0;color:#ecf3ff;border:1px solid #5d7597;border-radius:11px;box-shadow:0 10px 35px #0003;padding:17px;display:flex;gap:13px;align-items:center;backdrop-filter:blur(8px)}.map-pin{width:37px;height:37px;display:grid;place-items:center;background:#145cff;border-radius:8px;font-size:22px;flex:none}.map-caption strong{display:block;letter-spacing:1.4px;font-size:11px;font-weight:600}.map-caption small{display:block;font-size:10px;color:#9eb4d6;margin-top:5px}.map-open-label{margin-left:auto;font-size:9px;color:#bbcdf0;white-space:nowrap}.footer-inner>p{line-height:1.9}.footer-inner>p a:hover{color:#d6e5ff}
@media(max-width:1200px){.header-divider{margin-inline:24px}.primary-nav{gap:23px}.primary-nav a{font-size:14px}.location-info{padding:35px 28px}.location-info h2{font-size:42px}.map-open-label{display:none}.project-application .app-visual,.enterprise-visual{padding:56px 24px 0}.project-application .app-pitch h3,.enterprise-card-heading h3{font-size:24px}.project-caption h3{font-size:20px}.service-signature{font-size:10px;gap:15px}}
@media(max-width:1050px){.primary-nav{gap:18px}.header-divider{margin-inline:22px}.header-cta{font-size:12px;padding-inline:14px}.project-caption{align-items:flex-start}.project-application .project-caption{flex-wrap:wrap;gap:9px}.location-map,.location-map iframe{min-height:530px}.location-layout{grid-template-columns:1fr 1.2fr}.service-signature>span:last-child{display:none}.showcase-current>strong{max-width:145px}}
@media(max-width:780px){.primary-nav a{font-size:16px}.primary-nav a::after{display:none}.hero::before{inset:40% -10px 0 0;background-size:50px 50px}.service-signature{flex-wrap:wrap;justify-content:flex-start;gap:13px 20px;padding-block:24px;border-top:0}.service-signature>span:first-child{width:100%;font-size:11px}.service-signature>span:last-child{display:block}.portfolio{padding-top:65px}.project-grid{gap:37px}.project-application .app-visual,.enterprise-visual{aspect-ratio:1.3;min-height:330px;padding-top:60px}.project-application .app-pitch h3,.enterprise-card-heading h3{font-size:30px}.project-application .project-caption{flex-wrap:nowrap;align-items:center}.project-caption h3{font-size:23px}.enterprise-visual>.enterprise-preview{min-width:330px;margin-left:55px;margin-top:26px}.project-application .dashboard-preview{margin-left:55px;min-width:420px;margin-top:25px}.location-section{padding-bottom:45px}.location-topline{display:block;padding-block:23px}.location-topline>span{display:block;font-size:11px;margin-top:12px}.location-layout{grid-template-columns:1fr}.location-info{padding:32px 27px}.location-info h2{font-size:42px}.location-intro{font-size:13px;margin-bottom:25px}.location-map{min-height:360px;border-left:0;border-top:1px solid #2b3e60}.location-map iframe{min-height:360px}.map-caption{bottom:18px;left:15px;right:15px;padding:14px}.location-phone strong{font-size:25px}.location-info address{padding-top:23px}.showcase-current>strong{max-width:170px;font-size:11px}.showcase-dots button{width:20px}.showcase-control{width:34px;height:34px}.showcase-controls{gap:4px}}
@media(max-width:390px){.showcase-current>strong{max-width:125px;font-size:10px}.showcase-controls{left:3%;right:1%;gap:2px}.showcase-dots{margin-inline:2px}.showcase-dots button{width:18px}.showcase-control{width:31px;height:31px}.project-application .project-caption{flex-wrap:wrap}.location-info{padding-inline:24px}.project-application .app-pitch h3,.enterprise-card-heading h3{font-size:27px}}
@media(prefers-reduced-motion:reduce){.primary-nav a::after,.enterprise-visual>.enterprise-preview{transition:none}}

/* Crisp vector handset: the frame and screen scale together. */





.phone-screen{aspect-ratio:372/780;overflow:visible;border-radius:16%;background:none}
.phone-screen>img{position:static;display:block;width:100%;height:auto;max-width:100%;transform:none}