:where(.page-service--app-design){--svc-a:#7B3BFF;--svc-b:#D05CFF}:where(.page-service--app-design){.svc-planes{position:absolute;inset:0;perspective:1800px}.svc-plane{position:absolute;left:40%;top:48%;width:36%;aspect-ratio:7/12;overflow:hidden;border-radius:4.5cqw;transform:translate(-50%,-50%) rotateX(56deg) rotateZ(-40deg);translate:calc(var(--px,0) * var(--i) * 5px) calc((1 - var(--i)) * 16cqw + var(--py,0) * var(--i) * 4px);transition:translate .9s var(--ease-out)}.svc-plane--wire{border:1px dashed rgba(255,255,255,.42);background:rgba(255,255,255,.03)}.svc-plane--color{background:linear-gradient(160deg,var(--svc-a),var(--svc-b) 58%,var(--svc-c));box-shadow:inset 0 0 0 1px rgba(255,255,255,.3),0 30px 60px -24px rgba(0,0,0,.7)}.svc-plane--final{background:#F7F1E8;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3),0 40px 80px -20px rgba(0,0,0,.85)}.svc-wire{position:absolute;inset:9% 10%;display:flex;flex-direction:column;gap:5%}.svc-wire i{height:3.5%;border-radius:99px;background:rgba(255,255,255,.26)}.svc-wire i:first-child{width:45%;height:5%}.svc-wire i:nth-child(2){height:24%;border-radius:12%;background:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.34)}.svc-wire i:nth-child(4){width:70%}.svc-wire i:nth-child(6){width:55%}.svc-wire i:last-child{height:10%;margin-top:auto;background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1px rgba(255,255,255,.34)}.svc-plane__aa{position:absolute;left:12%;top:10%;color:#FFF;font:800 12cqw/1 var(--font-display);letter-spacing:-.05em}.svc-swatches{position:absolute;left:12%;bottom:12%;display:flex;gap:.55em;font-size:2cqw}.svc-swatches i{width:2.6em;aspect-ratio:1;border-radius:30%;background:var(--svc-a);box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}.svc-swatches i:nth-child(2){background:var(--svc-b)}.svc-swatches i:nth-child(3){background:var(--svc-c)}.svc-swatches i:nth-child(4){background:#FFF}.svc-plane-labels{margin:0;padding:0;list-style:none}.svc-plane-labels li{position:absolute;right:0;top:calc(48% + (1 - var(--i)) * 16cqw);display:flex;align-items:center;gap:.7em;translate:0 -50%;color:#D4D4E4;font:500 max(10px,1.9cqw)/1.2 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}.svc-plane-labels li::before{content:"";width:7cqw;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55))}.svc-art__flow{display:flex;align-items:center;justify-content:center;gap:1.5rem}.svc-art__screen{position:relative;width:3.6rem;aspect-ratio:9/19;padding:.55rem .4rem;border-radius:.7rem;background:var(--c-tile);box-shadow:inset 0 0 0 1px var(--c-line-2)}.svc-art__screen:nth-child(2){box-shadow:inset 0 0 0 1.5px var(--svc-a),0 12px 24px -12px var(--svc-a)}.svc-art__screen+.svc-art__screen::before{content:"";position:absolute;right:calc(100% + .3rem);top:50%;width:.9rem;height:1.5px;background:linear-gradient(90deg,var(--svc-a),var(--svc-b))}.svc-art__type{display:flex;align-items:baseline;justify-content:center;gap:.9rem;color:var(--c-ink);font:700 1rem/1 var(--font-display)}.svc-art__type i{font-style:normal}.svc-art__type i:nth-child(1){font-size:.75rem}.svc-art__type i:nth-child(2){font-size:1.05rem}.svc-art__type i:nth-child(3){font-size:1.45rem}.svc-art__type i:nth-child(4){font-size:1.95rem}.svc-art__type i:nth-child(5){padding:.1em .15em;border-radius:8px;font-size:2.6rem;outline:2px solid var(--svc-a);outline-offset:3px}.svc-win{width:min(100%,var(--win-w,760px));background:#1B1A24;box-shadow:0 0 0 1px rgba(255,255,255,.1),0 60px 120px -40px rgba(11,10,42,.6);color:#D8D8E6;font-size:.875rem}.svc-win .macwin__bar span{flex:none}.svc-win .macwin__bar b{flex:1;margin-right:45px;color:#A9A9C2;font:600 12px/1 var(--font-sans);text-align:center}.svc-win code{font:500 .8125rem/1.3 var(--font-mono)}.svc-art__lines{display:grid;gap:.45em}.svc-art__lines i{height:.45em;border-radius:9px;background:var(--c-line-2)}.svc-art__lines i:first-child{width:70%;background:color-mix(in srgb,var(--c-ink) 55%,transparent)}.svc-art__lines i:last-child{width:45%}.svc-win--specs{--win-w:980px}.svc-specs{display:grid;gap:1.75rem 2rem;padding:clamp(1.25rem,1rem + 1vw,1.75rem)}@media (min-width:800px){.svc-specs{grid-template-columns:1.2fr 1fr 1fr}}.svc-specs__label{margin:0 0 .9rem;color:#8D8DA6;font:500 .8125rem/1.3 var(--font-mono);letter-spacing:.12em;text-transform:uppercase}.svc-spec-cell{position:relative;align-self:center;padding:2.9rem 0 2.9rem 3.9rem}.svc-spec-cell__row{display:flex;align-items:center;gap:.9rem;height:4rem;padding:0 1.2rem;border-radius:14px;background:#2C2C2E}.svc-spec-cell__icon{flex:none;width:2.25rem;aspect-ratio:1;border-radius:22.5%;background:linear-gradient(135deg,var(--svc-a),var(--svc-b))}.svc-spec-cell__text{display:grid;flex:1;gap:.4rem}.svc-spec-cell__text :is(b,i){width:72%;height:.55rem;border-radius:9px;background:rgba(255,255,255,.8)}.svc-spec-cell__text i{width:48%;height:.45rem;background:rgba(235,235,245,.35)}.svc-spec-cell__chev{width:.5rem;height:.5rem;border:solid rgba(235,235,245,.35);border-width:2px 2px 0 0;rotate:45deg}.svc-red{position:absolute;display:flex;justify-content:center;color:#FF5C8A;font:600 .6875rem/1 var(--font-mono);white-space:nowrap}.svc-red--h{left:0;top:2.9rem;align-items:center;justify-content:flex-start;width:3.4rem;height:4rem;border-right:1px solid}.svc-red--pad{left:3.9rem;top:1.25rem;width:1.2rem;height:1.25rem;border-bottom:1px solid}.svc-red--gap{left:7.35rem;top:7.35rem;width:.9rem;padding-top:.45rem;border-top:1px solid}:is(.svc-type,.svc-colors){display:grid;gap:.6rem;margin:0;padding:0;list-style:none}.svc-type li{display:grid;grid-template-columns:3.1rem minmax(0,1fr) auto;align-items:baseline;gap:.75rem;padding-bottom:.6rem;border-bottom:1px solid rgba(255,255,255,.07)}.svc-type__aa{color:#FFF;font:700 calc(var(--fs) * .058rem)/1 var(--font-display);letter-spacing:-.02em}.svc-type li>span:last-child{color:#8D8DA6;font:500 .75rem var(--font-mono)}.svc-colors li{display:flex;align-items:center;gap:.75rem}.svc-swatch{flex:none;width:2.6rem;height:1.7rem;border-radius:8px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);background:linear-gradient(90deg,#007AFF 50%,#0A84FF 0)}.svc-swatch--1{background:linear-gradient(90deg,#000 50%,#FFF 0)}.svc-swatch--2{background:linear-gradient(90deg,rgba(60,60,67,.6) 50%,rgba(235,235,245,.6) 0),linear-gradient(90deg,#FFF 50%,#000 0)}.svc-swatch--3{background:linear-gradient(90deg,#FFF 50%,#000 0)}@media (max-width:639px){.svc-plane{left:36%;width:40%}}}@media (prefers-reduced-motion:no-preference){:where(.page-service--app-design) .svc-plane{animation:svc-explode 1.7s var(--ease-out) .45s both}}@keyframes svc-explode{from{opacity:0;translate:0 0}25%{opacity:1}}