.face-service-hero .service-hero-grid{display:grid;grid-template-columns:1.08fr 1fr;gap:60px;align-items:center}.face-service-hero h1{font-size:clamp(44px,5.5vw,76px);letter-spacing:-.055em}.face-service-hero p{font-size:17px}.face-demo{margin:0;min-width:0;color:#101418}.face-demo-top{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:.12em}.face-demo-top>img{opacity:.75}.face-demo-top b{font-size:8px;letter-spacing:.08em;font-weight:400;color:#7d847e;margin-left:auto}.face-visual{position:relative;height:435px;margin-top:14px;isolation:isolate}.face-svg{width:100%;height:100%;display:block;overflow:visible}.face-orbit{stroke:#bcc6bd;stroke-width:.65;stroke-dasharray:2 5}.face-progress{stroke:#064bff;stroke-width:1.6;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset 1.8s cubic-bezier(.22,.61,.36,1);opacity:.8}.face-human-photo{opacity:.97}.face-scan-line{stroke:#064bff;stroke-width:.8;opacity:0;animation:face-sweep 3.2s cubic-bezier(.45,0,.55,1) infinite}.face-landmarks{stroke:#fff;stroke-width:.65;opacity:0;transition:opacity 1s}.face-landmarks circle{fill:#fff;stroke:#064bff;stroke-width:.6}.face-success{opacity:0;transform:translateY(5px);transition:opacity .8s,transform .8s}.face-success circle{fill:#064bff;stroke:#f4f4ed;stroke-width:4}.face-success path{stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.face-floating{position:absolute;z-index:2;background:#fffefbf5;border:1px solid #dce0d7;box-shadow:0 12px 32px -18px #202d4329;padding:16px 18px;min-width:145px;border-radius:5px}.face-floating span{display:block;font-size:8px;letter-spacing:.08em;color:#818780}.face-floating strong{font-size:13px;font-weight:500;display:block;margin-top:8px;color:#1b2824}.face-floating-left{left:0;bottom:60px}.face-floating-right{right:0;top:53px;min-width:146px}.face-card-icon{margin-bottom:13px;color:#064bff}.face-card-icon img{display:block;filter:invert(21%) sepia(100%) saturate(5674%) hue-rotate(222deg) brightness(104%)}.face-card-line{height:2px;background:#e4e9df;margin-top:15px;overflow:hidden}.face-card-line i{height:100%;width:15%;display:block;background:#064bff;transition:width 1.4s ease}.face-processing{display:flex;align-items:center;gap:3px;margin-top:12px}.face-processing i{display:block;width:3px;height:3px;background:#a9b3a7;border-radius:50%}.face-processing small{margin-left:6px;font-size:9px;color:#8a9189}.face-feedback{display:flex;gap:12px;align-items:center;border-top:1px solid #d5dbd0;padding:20px 0}.face-status-dot{width:6px;height:6px;background:#064bff;border-radius:50%;box-shadow:0 0 0 5px #064bff08;flex-shrink:0}.face-feedback strong{font-size:15px;font-weight:500;display:block}.face-feedback div>span{display:block;font-size:11px;color:#70786e;line-height:1.6;margin-top:6px}.face-feedback>b{margin-left:auto;font-size:10px;font-weight:400;color:#899083;white-space:nowrap}.face-stage-track{display:flex;gap:22px;padding:0 0 18px 18px}.face-stage-track span{display:flex;align-items:center;gap:6px;font-size:9px;color:#969c93;transition:color .6s}.face-stage-track i{width:4px;height:4px;border-radius:50%;background:#d3dacd;transition:background .6s}.face-demo figcaption{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid #e0e4da;padding-top:15px;font-size:9px;line-height:1.6;color:#899182}.face-demo button{background:none;border:0;padding:4px 0;font:inherit;font-size:10px;color:#535f50;text-decoration:underline;text-underline-offset:4px;cursor:pointer;white-space:nowrap}.face-demo button:focus-visible{outline:2px solid #064bff;outline-offset:5px}.face-demo[data-phase="1"] .face-progress{stroke-dashoffset:70}.face-demo[data-phase="2"] .face-progress{stroke-dashoffset:26}.face-demo[data-phase="3"] .face-progress{stroke-dashoffset:0}.face-demo[data-phase="1"] .face-card-line i,.face-demo[data-phase="2"] .face-card-line i,.face-demo[data-phase="3"] .face-card-line i{width:100%}.face-demo[data-phase="1"] .face-scan-line,.face-demo[data-phase="2"] .face-scan-line{opacity:1}.face-demo[data-phase="2"] .face-landmarks{opacity:.68}.face-demo[data-phase="3"] .face-success{opacity:1;transform:translateY(0)}.face-demo[data-phase="2"] .face-processing i{background:#064bff;animation:face-processing 1.2s ease infinite}.face-demo[data-phase="2"] .face-processing i:nth-child(2){animation-delay:.15s}.face-demo[data-phase="2"] .face-processing i:nth-child(3){animation-delay:.3s}.face-demo[data-phase="3"] .face-processing i{background:#064bff}.face-demo[data-phase="1"] .face-stage-track span:first-child,.face-demo[data-phase="2"] .face-stage-track span:nth-child(-n+2),.face-demo[data-phase="3"] .face-stage-track span{color:#425540}.face-demo[data-phase="1"] .face-stage-track span:first-child i,.face-demo[data-phase="2"] .face-stage-track span:nth-child(-n+2) i,.face-demo[data-phase="3"] .face-stage-track i{background:#064bff}.face-demo[data-paused="true"] *{animation-play-state:paused!important;transition:none!important}@keyframes face-sweep{0%{transform:translateY(-45px)}100%{transform:translateY(155px)}}@keyframes face-processing{50%{opacity:.25;transform:translateY(-2px)}}@media(max-width:1080px){.face-service-hero .service-hero-grid{gap:30px}.face-visual{height:400px}.face-floating{padding:13px;min-width:132px}.face-floating-right{min-width:132px;top:42px}.face-floating strong{font-size:12px}.face-stage-track{gap:15px}}@media(max-width:760px){.face-service-hero .service-hero-grid{grid-template-columns:1fr;gap:45px}.face-service-hero .service-hero-grid>div{max-width:none}.face-service-hero h1{font-size:52px}.face-service-hero p{font-size:15px}.face-demo{width:100%;max-width:500px;justify-self:center}.face-visual{height:420px}.face-floating-left{left:0;bottom:47px}.face-floating-right{top:50px}.face-feedback{padding:18px 0}.face-stage-track{gap:20px}}@media(max-width:400px){.face-visual{height:390px}.face-floating{padding:12px;min-width:119px}.face-floating-left{bottom:43px;left:-1px}.face-floating-right{top:32px;right:-1px;min-width:116px}.face-floating span{font-size:7px}.face-floating strong{font-size:11px}.face-processing small{font-size:8px;margin-left:3px}.face-card-icon{margin-bottom:10px}.face-feedback strong{font-size:14px}.face-feedback div>span{font-size:10px}.face-stage-track{gap:17px;padding-left:0}.face-stage-track span{font-size:8px}.face-demo figcaption{font-size:8px}.face-demo-top{font-size:9px}.face-demo-top b{font-size:7px}}@media(prefers-reduced-motion:reduce){.face-demo *{animation:none!important;transition:none!important}}

@media(max-width:400px){.face-floating-right{top:0}}
