@font-face{font-family:'Inter';font-weight:400 800;font-display:swap;src:url(/assets/fonts/inter.woff2) format('woff2')} @font-face{font-family:'Fraunces';font-weight:600 800;font-display:swap;src:url(/assets/fonts/fraunces.woff2) format('woff2')} :root{--ink:#15171c;--mut:#555a63;--bg:#faf7f2;--card:#fff;--line:#e8e2d8;--lin:#f1ebe1;--a:#c4572c;--ad:#a9461f;--a2:#e9a46a;--ch:#1f2228;--chl:#2c2f36;--hf:'Fraunces',Georgia,'Times New Roman',serif;--r:22px;--sh:0 1px 2px rgba(21,23,28,.05),0 18px 40px -24px rgba(21,23,28,.28)} *{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:84px} body{margin:0;font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6;font-size:17px;overflow-wrap:break-word;-webkit-font-smoothing:antialiased} body.home{overflow-x:clip} a{color:inherit}img{max-width:100%;height:auto;display:block}.i{width:1.1em;height:1.1em;flex:none} .wrap{max-width:1180px;margin:0 auto;padding:0 24px} .skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:99;background:#fff;padding:8px 12px;border-radius:8px} :focus-visible{outline:3px solid var(--a);outline-offset:3px;border-radius:6px} /* founding bar */ .fbar{background:var(--ink);color:#f3efe8;font-size:14.5px;text-align:center;padding:9px 16px;line-height:1.45} .fbar b{color:var(--a2);font-weight:700}.fbar a{color:#fff;font-weight:650;text-underline-offset:3px;white-space:nowrap} .fbar .s{display:none} /* header */ header.top{position:sticky;top:0;z-index:40;background:rgba(250,247,242,.86);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid rgba(232,226,216,.9)} .top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px} .brand{display:flex;align-items:center;gap:10px;white-space:nowrap;text-decoration:none;font-family:var(--hf);font-weight:700;font-size:21px;letter-spacing:-.005em} .brand svg{width:36px;height:36px;border-radius:10px} nav.links{display:flex;gap:28px;font-size:15px;font-weight:500}nav.links a{text-decoration:none;color:var(--mut)}nav.links a:hover{color:var(--ink)} .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:650;text-decoration:none;border-radius:999px;padding:14px 24px;font-size:16px;line-height:1.2;border:2px solid transparent;cursor:pointer;font-family:inherit;transition:transform .15s ease,background .15s ease,box-shadow .15s ease;min-height:48px} .btn:hover{transform:translateY(-1px)}.btn.p{background:var(--a);color:#fff;box-shadow:0 10px 24px -12px rgba(196,87,44,.8)}.btn.p:hover{background:var(--ad)} .btn.g{border-color:rgba(21,23,28,.85);color:var(--ink);background:transparent}.btn.g:hover{background:#fff} .btn.w{background:#fff;color:var(--ink)}.btn.gl{border-color:rgba(255,255,255,.55);color:#fff}.btn.gl:hover{background:rgba(255,255,255,.08)} .btn.s{padding:10px 18px;font-size:15px;min-height:42px;white-space:nowrap} .eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--a);font-weight:700;margin:0 0 16px} h1,h2,h3{font-family:var(--hf);line-height:1.08;margin:0 0 14px;letter-spacing:-.015em;font-weight:700} h1{font-size:clamp(40px,6.2vw,74px);line-height:1.02}h2{font-size:clamp(32px,4.4vw,50px)}h3{font-size:22px;line-height:1.2} h1 em,h2 em{font-style:italic;color:var(--a);font-weight:700} .lead{font-size:clamp(17px,1.6vw,20px);color:var(--mut);max-width:34em;margin:0 0 30px} /* hero */ .hero{position:relative;padding:72px 0 96px;overflow:hidden;background:radial-gradient(900px 520px at 85% 20%,rgba(233,164,106,.28),transparent 60%),radial-gradient(700px 500px at 0% 100%,rgba(196,87,44,.10),transparent 60%),var(--bg)} .hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(21,23,28,.07) 1px,transparent 1px);background-size:22px 22px;-webkit-mask-image:linear-gradient(180deg,#000,transparent 85%);mask-image:linear-gradient(180deg,#000,transparent 85%);pointer-events:none} .hero .wrap{position:relative;display:grid;grid-template-columns:1.02fr 1fr;gap:56px;align-items:center} .pill{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 14px 6px 6px;font-size:14px;font-weight:600;color:var(--ink);box-shadow:var(--sh);margin-bottom:22px;text-decoration:none} .pill span{background:var(--ink);color:var(--a2);border-radius:999px;padding:3px 10px;font-size:12px;letter-spacing:.06em;text-transform:uppercase} .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:18px} .micro{font-size:14.5px;color:var(--mut);margin:0 0 30px;display:flex;align-items:center;gap:8px}.micro .i{color:var(--a)} .facts{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:10px 30px;padding:22px 0 0;margin:0;list-style:none;border-top:1px solid var(--line)} .facts li b{display:block;font-family:var(--hf);font-size:26px;line-height:1.1}.facts li span{font-size:14px;color:var(--mut)} /* device mockups */ .dev{position:relative;padding:0 9% 9% 0} .lap{position:relative;background:#111318;border-radius:16px 16px 4px 4px;padding:9px 9px 0;box-shadow:0 40px 70px -30px rgba(21,23,28,.55)} .lap:before{content:"";position:absolute;top:3px;left:50%;width:5px;height:5px;margin-left:-2px;border-radius:50%;background:#2c2f36} .lap .scr{aspect-ratio:16/10;overflow:hidden;border-radius:6px 6px 0 0;background:#222} .lap .scr img{width:100%;height:100%;object-fit:cover;object-position:top} .lap:after{content:"";position:absolute;left:-7%;right:-7%;bottom:-14px;height:14px;background:linear-gradient(180deg,#e6e2db,#bfbab1);border-radius:2px 2px 14px 14px;box-shadow:0 14px 20px -12px rgba(0,0,0,.45)} .mob{position:absolute;right:0;bottom:0;width:29%;background:#111318;border-radius:26px;padding:6px;box-shadow:0 30px 50px -20px rgba(21,23,28,.6),0 0 0 1px rgba(255,255,255,.06) inset} .mob img{border-radius:20px;aspect-ratio:390/844;object-fit:cover;object-position:top;width:100%} .hero .dev{animation:rise .9s cubic-bezier(.2,.7,.2,1) both} .chip{position:absolute;z-index:3;display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:9px 13px;font-size:13.5px;font-weight:650;box-shadow:0 16px 30px -16px rgba(0,0,0,.35);white-space:nowrap} .chip .dot{width:9px;height:9px;border-radius:50%;background:#2f9e6a;box-shadow:0 0 0 4px rgba(47,158,106,.15)} .chip.c1{left:-4%;top:12%}.chip.c2{left:6%;bottom:2%}.chip .i{color:var(--a)} .clabel{position:absolute;right:31%;top:-14px;z-index:3;background:var(--ink);color:#fff;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:6px 12px} @keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}} /* strip */ .strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff} .strip .wrap{display:flex;align-items:center;gap:14px 34px;flex-wrap:wrap;justify-content:center;padding-top:20px;padding-bottom:20px;color:var(--mut);font-size:15px} .strip b{color:var(--ink);font-weight:650}.strip span{display:inline-flex;align-items:center;gap:8px}.strip .i{color:var(--a)} /* sections */ section{padding:104px 0}section.alt{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)} .sh{max-width:760px;margin-bottom:48px}.sh p{color:var(--mut);margin:0;font-size:18px}.sh.c{margin-left:auto;margin-right:auto;text-align:center} .why{display:grid;grid-template-columns:repeat(3,1fr);gap:22px} .why article{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:30px 28px;box-shadow:var(--sh)} .ic{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:#fbe9de;color:var(--a);margin-bottom:18px}.ic .i{width:24px;height:24px} .why p{margin:0;color:var(--mut);font-size:16px} /* work */ .label{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 16px 8px 8px;font-size:14.5px;font-weight:600;margin-bottom:34px} .label span{background:var(--ink);color:#fff;border-radius:999px;padding:4px 10px;font-size:12px;letter-spacing:.06em;text-transform:uppercase} .work{display:grid;grid-template-columns:repeat(3,1fr);gap:26px} .wk{display:flex;flex-direction:column;text-decoration:none;background:var(--bg);border:1px solid var(--line);border-radius:26px;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease} .wk:hover{transform:translateY(-4px);box-shadow:0 30px 50px -30px rgba(21,23,28,.45)} .wk .stage{padding:34px 30px 26px;background:linear-gradient(160deg,#f3ece2,#e9dfd1)} .wk:nth-child(2n) .stage{background:linear-gradient(160deg,#efe6dc,#e3d6c6)} .wk .dev{padding:0 10% 10% 0}.wk .lap{border-radius:10px 10px 3px 3px;padding:5px 5px 0}.wk .lap:before{display:none}.wk .lap:after{bottom:-8px;height:8px} .wk .mob{border-radius:16px;padding:4px;width:30%}.wk .mob img{border-radius:12px} .wk .cap{padding:20px 24px 24px;display:flex;flex-direction:column;gap:6px;flex:1} .wk .tag{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--a)} .wk h3{margin:0;font-size:22px}.wk p{margin:0;color:var(--mut);font-size:15.5px} .wk .go{margin-top:auto;padding-top:12px;display:inline-flex;align-items:center;gap:8px;font-weight:650;font-size:15px} .gnote{color:var(--mut);font-size:14.5px;margin:28px 0 0;max-width:62em} /* free concept band */ .band{background:var(--ink);color:#f3efe8;position:relative;overflow:hidden} .band:before{content:"";position:absolute;right:-180px;top:-180px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(233,164,106,.28),transparent 65%)} .band .wrap{position:relative;display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center} .band h2{color:#fff}.band .eyebrow{color:var(--a2)}.band p.lead{color:#c9c4bb} .bsteps{list-style:none;margin:0;padding:0;display:grid;gap:14px;counter-reset:b} .bsteps li{display:flex;gap:16px;align-items:flex-start;background:var(--ch);border:1px solid var(--chl);border-radius:18px;padding:20px 22px} .bsteps li:before{counter-increment:b;content:counter(b);flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--a2);color:var(--ink);font-weight:800} .bsteps b{display:block;color:#fff;font-size:17px}.bsteps span{color:#bdb8af;font-size:15.5px} /* pricing */ .prices{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:22px;align-items:stretch} .price{position:relative;background:var(--card);border:1px solid var(--line);border-radius:26px;padding:34px 30px;display:flex;flex-direction:column;box-shadow:var(--sh)} .price.f{background:var(--ink);color:#f3efe8;border-color:var(--ink);box-shadow:0 40px 70px -36px rgba(21,23,28,.7)} .price.f h3{color:#fff}.price.f .sub,.price.f li{color:#d6d1c8}.price.f li .i{color:var(--a2)} .badge{align-self:flex-start;background:#fbe9de;color:#8c3a17;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:6px 12px;margin-bottom:18px} .price.f .badge{background:var(--a2);color:var(--ink)} .amt{font-family:var(--hf);font-size:54px;font-weight:700;line-height:1;margin:6px 0 6px;letter-spacing:-.02em}.amt small{font-family:'Inter',sans-serif;font-size:15px;font-weight:500;color:var(--mut);letter-spacing:0} .price.f .amt small{color:#bdb8af} .price .sub{color:var(--mut);font-size:15.5px;margin:0 0 20px} .fo{margin:0 0 22px;padding:14px 16px;border-radius:14px;background:rgba(233,164,106,.12);border:1px solid rgba(233,164,106,.45);font-size:14.5px;line-height:1.5;color:#f3efe8} .fo b{color:var(--a2)} .price ul{list-style:none;padding:0;margin:0 0 26px;display:grid;gap:10px;font-size:15.5px} .price li{display:flex;gap:10px;align-items:flex-start}.price li .i{color:var(--a);margin-top:4px} .price .btn{margin-top:auto} .note{color:var(--mut);font-size:14.5px;margin-top:26px;max-width:64em} /* steps */ .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:s;padding:0;margin:0;list-style:none;position:relative} .steps li{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px 24px;position:relative;box-shadow:var(--sh)} .steps li:before{counter-increment:s;content:"0" counter(s);display:block;font-family:var(--hf);font-size:40px;font-weight:700;color:var(--a);line-height:1;margin-bottom:16px} .steps p{margin:0;color:var(--mut);font-size:15.5px} /* included */ .inc{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;list-style:none;padding:0;margin:0} .inc li{display:flex;gap:14px;background:var(--bg);border:1px solid var(--line);border-radius:18px;padding:22px} .inc .ic{width:40px;height:40px;border-radius:12px;margin:0}.inc .ic .i{width:20px;height:20px} .inc b{display:block;margin-bottom:2px}.inc span{color:var(--mut);font-size:15.5px} /* about */ .about{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:center} .mono{aspect-ratio:1;max-width:400px;width:100%;border-radius:36px;background:var(--ink);display:grid;place-items:center;position:relative;box-shadow:0 40px 70px -36px rgba(21,23,28,.7);overflow:hidden} .mono:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 20%,rgba(233,164,106,.35),transparent 55%)} .mono span{position:relative;font-family:var(--hf);font-weight:700;font-size:clamp(110px,14vw,170px);color:var(--a2);letter-spacing:-.02em} .mono i{position:absolute;left:22px;bottom:20px;font-style:normal;color:#c9c4bb;font-size:14px;display:flex;align-items:center;gap:6px}.mono i .i{color:var(--a2)} .about p{color:var(--mut);font-size:18px;margin:0 0 16px} .trio{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:26px} .trio div{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px} .trio b{display:block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--a);margin-bottom:4px}.trio span{font-size:15px;font-weight:600;line-height:1.4;display:block} /* faq */ .faqw{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:start} .faq details{background:#fff;border:1px solid var(--line);border-radius:16px;padding:2px 22px;margin-bottom:12px} summary{cursor:pointer;list-style:none;font-weight:650;font-size:17.5px;padding:18px 36px 18px 0;position:relative} summary::-webkit-details-marker{display:none} summary:after{content:"";position:absolute;right:2px;top:50%;width:22px;height:22px;margin-top:-11px;border-radius:50%;background:#fbe9de url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23c4572c' d='M11 5h2v14h-2z'/%3E%3Cpath fill='%23c4572c' d='M5 11h14v2H5z'/%3E%3C/svg%3E") center/14px no-repeat;transition:transform .2s} details[open] summary:after{transform:rotate(45deg)} details p{margin:0 0 20px;color:var(--mut)} /* contact */ .contact .wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start} .cbtns{display:flex;flex-direction:column;gap:12px;align-items:flex-start;margin:6px 0 26px} .cbtns .btn{max-width:100%;overflow-wrap:anywhere;text-align:left} .where{display:flex;align-items:center;gap:8px;font-weight:600;margin:0;color:var(--mut)}.where .i{color:var(--a)} form.enq{background:#fff;border:1px solid var(--line);border-radius:26px;padding:32px;display:grid;gap:16px;box-shadow:0 40px 70px -40px rgba(21,23,28,.4)} form.enq h3{margin:0 0 2px;font-size:24px} .row2{display:grid;grid-template-columns:1fr 1fr;gap:14px} label{display:grid;gap:6px;font-size:14.5px;font-weight:600} label .o{font-weight:400;color:var(--mut)}label>span.lt{display:block} input,textarea,select{font:inherit;font-size:16px;padding:13px 14px;border:1.5px solid #d6cfc3;border-radius:12px;background:#fff;color:var(--ink);width:100%;min-height:48px} select{-webkit-appearance:none;appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23555a63' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") right 12px center/22px no-repeat;padding-right:40px} input:focus,textarea:focus,select:focus{outline:3px solid #f3c6ad;border-color:var(--a)} textarea{min-height:120px;resize:vertical}.hp{position:absolute;left:-9999px} .small{font-size:13.5px;color:var(--mut);margin:0} form.enq .btn{width:100%} /* footer */ footer{background:var(--ink);color:#c9c4bb;padding:64px 0 calc(40px + env(safe-area-inset-bottom));font-size:15px} .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px} footer .brand{color:#fff;margin-bottom:12px}footer .brand svg{box-shadow:0 0 0 1px #3a3d45;border-radius:10px}footer h4{color:#fff;font-size:13px;letter-spacing:.14em;text-transform:uppercase;margin:6px 0 14px} footer a{color:#fff;text-decoration:none}footer a:hover{text-decoration:underline} footer ul{list-style:none;padding:0;margin:0;display:grid;gap:8px} .fbot{border-top:1px solid var(--chl);margin-top:40px;padding-top:22px;font-size:13.5px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px} /* sticky mobile cta */ .mcta{display:none} /* docs */ .doc{max-width:780px;padding:64px 24px 88px;margin:0 auto}.doc h1{font-size:clamp(36px,5vw,52px)}.doc h2{font-size:24px;margin-top:36px} .doc p,.doc li{color:#363a42}.doc .upd{color:var(--mut);font-size:15px} .center{text-align:center;padding-top:96px;padding-bottom:120px} @media (max-width:1060px){.hero .wrap{grid-template-columns:1fr;gap:48px}.hero .dev{max-width:640px;margin:0 auto;width:100%}.work{grid-template-columns:repeat(2,1fr)}.prices{grid-template-columns:1fr;max-width:620px}.steps{grid-template-columns:repeat(2,1fr)}.band .wrap,.about,.faqw,.contact .wrap{grid-template-columns:1fr;gap:40px}.mono{max-width:300px}} @media (max-width:860px){nav.links{display:none}.why,.inc{grid-template-columns:1fr}section{padding:80px 0}.fgrid{grid-template-columns:1fr 1fr}.fgrid>div:first-child{grid-column:1/-1}} @media (max-width:640px){body{font-size:16px}.wrap{padding:0 20px}.fbar{font-size:13.5px}.fbar .l{display:none}.fbar .s{display:inline} .top .wrap{min-height:60px}.brand{font-size:19px}.brand svg{width:32px;height:32px}.top .btn.s{padding:9px 15px;font-size:14px;min-height:40px}.pill{display:none}.mono{max-width:220px;border-radius:28px}.mono span{font-size:96px} .hero{padding:40px 0 64px}.ctas .btn{width:100%}.facts{grid-template-columns:repeat(3,1fr);gap:8px 14px}.facts li b{font-size:21px}.facts li span{font-size:12.5px} .chip{font-size:12px;padding:7px 10px}.chip.c1{left:-2%;top:6%}.clabel{font-size:10.5px;padding:5px 9px;top:-12px} section{padding:68px 0}.sh{margin-bottom:34px}.sh p{font-size:16.5px}.work{grid-template-columns:1fr}.steps{grid-template-columns:1fr} .row2{grid-template-columns:1fr}form.enq{padding:22px}.price{padding:28px 22px}.amt{font-size:46px}.trio{grid-template-columns:1fr} .strip .wrap{justify-content:flex-start;gap:10px 20px;font-size:14px} .mcta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(250,247,242,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--line);transition:transform .25s ease} .mcta.hide{transform:translateY(110%)} .mcta .btn{flex:1;padding:12px 10px;font-size:15px}.mcta .btn.g{flex:0 0 auto;width:52px;padding:0}.mcta .btn.g .i{width:22px;height:22px} body.home footer{padding-bottom:calc(100px + env(safe-area-inset-bottom))}.fgrid{grid-template-columns:1fr}} @media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}