.vs main{display:block;place-items:normal}
.vs-hero{padding:64px 0 88px;text-align:center;background:var(--paper)}
.vs-hero .wrap{max-width:1264px}
.vs-hero h1{max-width:none;margin:0 auto;font-size:clamp(44px,4.7vw,68px);line-height:1.03;letter-spacing:-.034em}
.vs-hero-img{margin:52px auto 0;max-width:1200px;aspect-ratio:20/11;border-radius:36px;background:#E9E6DC;box-shadow:inset 0 0 0 1px rgba(28,27,13,.06)}
@media (max-width:600px){
.vs-hero{padding:48px 0 64px}
.vs-hero h1{font-size:34px}
.vs-hero-img{margin-top:32px;border-radius:24px}
}
.ps{padding-block:112px}
.ps-problem{background:radial-gradient(55% 70% at 80% 45%,rgba(255,255,255,.07),rgba(255,255,255,0) 70%),var(--moss);color:#fff}
.ps-problem h2{color:#fff}
.ps-problem .eyebrow{color:rgba(255,255,255,.66)}
.ps-problem .ps-sub{color:rgba(255,255,255,.74)}
.ps-solution{background:var(--lime-1)}
.ps-grid{display:grid;grid-template-columns:minmax(0,1fr) 532px;gap:72px;align-items:center}
.ps .eyebrow{margin:0 0 18px}
.ps h2{max-width:14.5em;font-size:clamp(38px,3.7vw,54px);line-height:1.06;letter-spacing:-.028em}
.ps .cold{color:#8A8676}
.ps .mk{white-space:nowrap}
.ps-sub{margin:24px 0 0;max-width:30em;font-size:19px;line-height:1.55;color:var(--ink-2);text-wrap:pretty}
.pv{position:relative;height:480px;font-family:var(--body)}
.pv svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ps-solution h2{font-size:clamp(34px,3.2vw,46px);line-height:1.08}
.ps-solution .mk{white-space:normal}
.ps-solution h2 .l{display:block}
.pv .ic{position:relative;flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:12px;color:#fff;overflow:hidden;box-shadow:inset 0 0 0 .5px rgba(0,0,0,.08)}
.pv .ic svg{width:60%;height:60%;stroke-width:1.7}
.pv .ic.sm{width:30px;height:30px;border-radius:8px}
.pv .ic.xs{width:18px;height:18px;border-radius:5px}
.pv .i-cal{display:flex;flex-direction:column;justify-content:center;background:#fff}
.pv .i-cal b{font:600 9px/1 var(--body);letter-spacing:.04em;color:#FF3B30}
.pv .i-cal i{font:400 25px/1 var(--body);font-style:normal;color:#1C1B0D}
.pv .ic.xs.i-cal b{display:none}
.pv .ic.xs.i-cal i{font-size:10px}
.pv .i-notes{background:linear-gradient(180deg,#FFD447 0 26%,#fff 26%)}
.pv .i-notes i{position:absolute;left:18%;right:18%;top:42%;height:40%;background:repeating-linear-gradient(180deg,#D7D3C6 0 1.5px,transparent 1.5px 7px)}
.pv .i-rem{display:flex;flex-direction:column;justify-content:center;gap:12%;padding-left:18%;background:#fff}
.pv .i-rem i{display:block;width:64%;height:10%;border-radius:2px;background:linear-gradient(90deg,#FF9500 0 16%,transparent 16% 30%,#DADADF 30%)}
.pv .i-rem i:nth-child(2){background:linear-gradient(90deg,#007AFF 0 16%,transparent 16% 30%,#DADADF 30%)}
.pv .i-rem i:nth-child(3){background:linear-gradient(90deg,#FF3B30 0 16%,transparent 16% 30%,#DADADF 30%)}
.pv .i-photos{background:#fff}
.pv .i-photos i{position:absolute;inset:16%;border-radius:50%;background:conic-gradient(#FFCC00 0 60deg,#FF9500 0 120deg,#FF3B30 0 180deg,#AF52DE 0 240deg,#007AFF 0 300deg,#34C759 0 360deg)}
.p2a{overflow:hidden;-webkit-mask-image:linear-gradient(180deg,#000 78%,transparent);mask-image:linear-gradient(180deg,#000 78%,transparent)}
.pv .p2-ph{position:absolute;left:112px;top:26px;width:300px;height:620px;border-radius:52px;background:linear-gradient(150deg,#2B2B2B,#0B0B0B 60%);box-shadow:inset 0 0 0 1.5px #3A3A3A,0 0 0 2px #CDD0D4,0 0 0 3.5px #8F9297,0 50px 70px -30px rgba(70,50,0,.45);transform:rotate(-4deg)}
.pv .p2-scr{position:absolute;inset:10px;overflow:hidden;border-radius:43px;background:radial-gradient(90% 55% at 12% 4%,#8C98F6 0%,rgba(140,152,246,0) 62%),radial-gradient(80% 60% at 98% 36%,#F2A28C 0%,rgba(242,162,140,0) 62%),linear-gradient(180deg,#454CA2,#1E2250 72%)}
.pv .p2-scr::before{content:"";position:absolute;left:50%;top:10px;width:84px;height:24px;margin-left:-42px;border-radius:999px;background:#000}
.p2-sb{display:flex;align-items:center;justify-content:space-between;padding:15px 24px 0 30px;font:600 13px/1 var(--body);color:#fff}
.p2-sb i{display:flex;align-items:center;gap:5px}
.pv .p2-sb svg{width:auto;height:10px;fill:#fff;stroke:none}
.p2-bn{display:flex;gap:10px;margin:20px 12px 0;padding:10px 12px;border-radius:18px;background:rgba(245,245,247,.9);box-shadow:0 10px 22px -12px rgba(0,0,0,.5);font-size:11.5px;color:#1C1B0D}
.p2-bn.b2{margin-top:8px}
.p2-bn div{flex:1;min-width:0}
.p2-bn p{margin:0;line-height:1.35}
.p2-bn .t{display:flex;justify-content:space-between;font-size:10px;color:#6E6E73}
.p2-bn .t b{font-weight:600;color:#1C1B0D}
.p2-bn .od{font-weight:600;color:#D70015}
.p2-bn .mu{color:#6E6E73}
.p2-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 0;justify-items:center;margin:22px 12px 0}
.ap{position:relative;display:grid;justify-items:center;gap:5px;width:64px}
.ap em{position:absolute;top:-7px;left:44px;min-width:21px;height:21px;padding:0 6px;border-radius:11px;background:#FF3B30;font:600 11px/21px var(--body);font-style:normal;color:#fff;text-align:center;white-space:nowrap}
.ap .nm{font-size:10px;color:#fff;white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.pv .i-li{background:#0A66C2}
.pv .i-li b{font:700 27px/1 var(--body);letter-spacing:-.04em;color:#fff;transform:translate(1px,1px)}
.pv .ic.xs.i-li b{font-size:10px}
.pv .i-fb{background:#1877F2}
.pv .i-fb b{font:700 30px/1 var(--body);color:#fff;transform:translate(.07em,.13em)}
.pv .ic.sm.i-fb b{font-size:17px}.pv .ic.xs.i-fb b{font-size:11px}
.pv .i-rem i{display:block;width:66%;height:14%;border-radius:0;background:radial-gradient(circle at 7% 50%,#007AFF 0 12%,transparent 13%),linear-gradient(90deg,transparent 0 26%,#DADADF 26% 100%) center/100% 26% no-repeat}
.pv .i-rem i:nth-child(2){background:radial-gradient(circle at 7% 50%,#FF3B30 0 12%,transparent 13%),linear-gradient(90deg,transparent 0 26%,#DADADF 26% 100%) center/100% 26% no-repeat}
.pv .i-rem i:nth-child(3){background:radial-gradient(circle at 7% 50%,#FF9500 0 12%,transparent 13%),linear-gradient(90deg,transparent 0 26%,#DADADF 26% 100%) center/100% 26% no-repeat}
.pv .i-notes{background:linear-gradient(180deg,#FFE27A 0,#FFCF33 24%,#fff 24%)}
.p3-scr{position:absolute;inset:10px;overflow:hidden;border-radius:43px;background:#F7F6F1;color:#1C1B0D}
.p3-scr::before{content:"";position:absolute;left:50%;top:10px;width:84px;height:24px;margin-left:-42px;border-radius:999px;background:#000}
.p2-sb.dk{color:#1C1B0D}
.pv .p2-sb.dk svg{fill:#1C1B0D}
.pv img{display:block;border-radius:50%;object-fit:cover}
.pv.p4b{overflow:visible}
.p4b .src{position:absolute;z-index:2}
.p4b .src em{position:absolute;top:-7px;left:40px;min-width:21px;height:21px;padding:0 6px;border-radius:11px;background:#FF3B30;font:600 11px/21px var(--body);font-style:normal;color:#fff;text-align:center;white-space:nowrap}
.p4-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.pv .p4-lines path{fill:none;stroke:#A6BF45;stroke-width:1.6;stroke-linecap:round}
.p4-dot{position:absolute;z-index:3;left:0;top:0;width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px rgba(210,255,81,.35),0 0 12px rgba(166,191,69,.9);opacity:0}
.pv .p2-ph.p4-ph{left:236px;top:36px;width:272px;transform:none;-webkit-mask-image:linear-gradient(180deg,#000 68%,transparent 72%);mask-image:linear-gradient(180deg,#000 68%,transparent 72%)}
.p4-hero{display:grid;justify-items:center;margin:18px 16px 0;text-align:center}
.p4-hero img{width:72px;height:72px;box-shadow:0 0 0 3px #F7F6F1,0 0 0 5.5px var(--lime)}
.p4-hero b{margin-top:11px;font-size:15px;font-weight:600;letter-spacing:-.01em}
.p4-hero span{margin-top:2px;font-size:10.5px;color:#6E6B5E}
.p4-rows{margin:16px 14px 0;border-radius:16px;background:#fff;box-shadow:0 0 0 1px #ECEBE4}
.p4-row{display:flex;align-items:center;gap:9px;margin:0;padding:10px;font-size:11.5px}
.p4-row + .p4-row{border-top:1px solid #F0EFE9}
.p4-row .k{width:46px;padding:3px 0;font-size:8.5px}
.p4-btn{display:block;margin:12px 14px 0;padding:10px;border-radius:14px;background:var(--moss);font-size:11.5px;font-weight:600;text-align:center;color:var(--lime)}
.p4-srcs{display:flex;align-items:center;gap:4px;margin:12px 16px 0;font-size:9.5px;color:#7A776D}
.p4-srcs span{margin-right:3px}
.p4-srcs .ic.xs{width:15px;height:15px;border-radius:4px}
.pv .i-mail{background:linear-gradient(180deg,#5AC8FF,#1A6CFF)}
.pv .i-msg{background:linear-gradient(180deg,#67F46F,#0DBF27)}
.pv .i-person{background:linear-gradient(180deg,#B8B8BF,#8C8C94)}
.pv .i-wave{background:linear-gradient(180deg,#2C2C2E,#0B0B0C)}
.pv .i-chat{background:linear-gradient(180deg,#A07CF8,#6440D6)}
.pv .i-grid{background:linear-gradient(180deg,#45C774,#1B9A4B)}
.pv .i-doc{background:linear-gradient(180deg,#6395F2,#2F62D0)}
.pv .i-folder{background:linear-gradient(180deg,#5AAEF8,#1E6FE0)}
.pv .i-phone{background:linear-gradient(180deg,#6EE27B,#23B53A)}
.pv .i-compass{background:linear-gradient(180deg,#4FC3FA,#1570EF)}
.pv .i-gear{background:linear-gradient(180deg,#B8B8BE,#83838A)}
.p4b .src.s1{left:34px;top:40px}
.p4b .src.s2{left:70px;top:98px}
.p4b .src.s3{left:26px;top:156px}
.p4b .src.s4{left:62px;top:214px}
.p4b .src.s5{left:30px;top:272px}
.p4b .src.s6{left:68px;top:330px}
.p4b .src.s7{left:36px;top:388px}
.p4-dot.d1{offset-path:path("M90 66 C 166 66, 186 130, 238 130")}
.p4-dot.d2{offset-path:path("M126 124 C 202 124, 186 130, 238 130")}
.p4-dot.d3{offset-path:path("M82 182 C 158 182, 186 130, 238 130")}
.p4-dot.d4{offset-path:path("M118 240 C 194 240, 186 130, 238 130")}
.p4-dot.d5{offset-path:path("M86 298 C 162 298, 186 130, 238 130")}
.p4-dot.d6{offset-path:path("M124 356 C 200 356, 186 130, 238 130")}
.p4-dot.d7{offset-path:path("M92 414 C 168 414, 186 130, 238 130")}
.p4b .src.s1,.p4-lines path:nth-of-type(1),.p4-dot.d1{--i:0}
.p4b .src.s2,.p4-lines path:nth-of-type(2),.p4-dot.d2{--i:1}
.p4b .src.s3,.p4-lines path:nth-of-type(3),.p4-dot.d3{--i:2}
.p4b .src.s4,.p4-lines path:nth-of-type(4),.p4-dot.d4{--i:3}
.p4b .src.s5,.p4-lines path:nth-of-type(5),.p4-dot.d5{--i:4}
.p4b .src.s6,.p4-lines path:nth-of-type(6),.p4-dot.d6{--i:5}
.p4b .src.s7,.p4-lines path:nth-of-type(7),.p4-dot.d7{--i:6}
@keyframes p4-travel{0%{offset-distance:0%;opacity:0}15%{opacity:1}85%{opacity:1}100%{offset-distance:100%;opacity:0}}
@media (min-width:961px) and (min-height:640px) and (prefers-reduced-motion:no-preference){
.duo-on .duo{position:relative;height:260vh}
.duo-on .duo-pin{position:sticky;top:74px;height:calc(100vh - 74px);height:calc(100svh - 74px);overflow:hidden}
.duo-on .duo-pin > .ps{position:absolute;inset:0;display:flex;align-items:center;padding-block:0}
.duo-on .duo-pin > .ps > .wrap{width:100%}
.duo-on .duo .ps-solution{z-index:2;opacity:0;pointer-events:none;transition:opacity .5s ease}
.duo-on .duo.ans .ps-solution{opacity:1;pointer-events:auto;transition:opacity .8s ease}
.duo-on .duo .ps-grid > div:first-child,.duo-on .duo .p2a,.duo-on .duo .p4b{transition:opacity .35s ease,transform .45s ease}
.duo-on .duo.ans .ps-problem .ps-grid > div:first-child{opacity:0;transform:translateY(-28px);transition:opacity .45s ease,transform .6s cubic-bezier(.3,.7,.2,1)}
.duo-on .duo.ans .p2a{opacity:0;transform:translateY(-40px) scale(.96);transition:opacity .45s ease,transform .6s cubic-bezier(.3,.7,.2,1)}
.duo-on .duo .ps-solution .ps-grid > div:first-child{opacity:0;transform:translateY(28px)}
.duo-on .duo.ans .ps-solution .ps-grid > div:first-child{opacity:1;transform:none;transition:opacity .5s ease .25s,transform .7s cubic-bezier(.2,.8,.2,1) .25s}
.duo-on .duo .p4b{opacity:0;transform:translateY(40px)}
.duo-on .duo.ans .p4b{opacity:1;transform:none;transition:opacity .5s ease .15s,transform .7s cubic-bezier(.2,.8,.2,1) .15s}
.duo-on .duo .p4b .src{opacity:0;transform:translateY(-120px) scale(.8) rotate(-8deg);transition:opacity .2s,transform .2s}
.duo-on .duo.ans .p4b .src{opacity:1;transform:none;transition:opacity .45s ease calc(.4s + var(--i)*.08s),transform .75s cubic-bezier(.2,.8,.2,1) calc(.4s + var(--i)*.08s)}
.duo-on .duo .p4-lines path{opacity:0;transition:opacity .2s}
.duo-on .duo.ans .p4-lines path{opacity:1;transition:opacity .5s ease calc(.95s + var(--i)*.07s)}
.duo-on .duo.ans .p4-dot{animation:p4-travel .9s cubic-bezier(.4,0,.2,1) calc(1.05s + var(--i)*.07s) both}
.duo-on .duo .p4b .src em{transition:opacity .2s,transform .2s}
.duo-on .duo.ans .p4b .src em{opacity:0;transform:scale(.3);transition:opacity .3s ease calc(1.75s + var(--i)*.07s),transform .3s ease calc(1.75s + var(--i)*.07s)}
.duo-on .duo .p4-hero,.duo-on .duo .p4-row,.duo-on .duo .p4-btn,.duo-on .duo .p4-srcs{opacity:0;transform:translateY(10px);transition:opacity .2s,transform .2s}
.duo-on .duo.ans .p4-hero{opacity:1;transform:none;transition:opacity .5s ease 1.5s,transform .5s ease 1.5s}
.duo-on .duo.ans .p4-row:nth-child(1){opacity:1;transform:none;transition:opacity .45s ease 1.85s,transform .45s ease 1.85s}
.duo-on .duo.ans .p4-row:nth-child(2){opacity:1;transform:none;transition:opacity .45s ease 2s,transform .45s ease 2s}
.duo-on .duo.ans .p4-row:nth-child(3){opacity:1;transform:none;transition:opacity .45s ease 2.15s,transform .45s ease 2.15s}
.duo-on .duo.ans .p4-btn{opacity:1;transform:none;transition:opacity .45s ease 2.35s,transform .45s ease 2.35s}
.duo-on .duo.ans .p4-srcs{opacity:1;transform:none;transition:opacity .45s ease 2.5s,transform .45s ease 2.5s}
}
@media (max-width:960px){
.ps-grid{grid-template-columns:1fr;gap:40px}
.pv{justify-self:center;width:532px}
}
@media (max-width:600px){
.pv{zoom:.64}
.ps{padding-block:72px}
}
@media (max-width:380px){.pv{zoom:.54}}
@media (max-width:350px){.pv{zoom:.48}}