.apps-page{--apps-navy:#0d1d27;--apps-ink:#142e39;--apps-blue:#459ce2;background:#f4f6f2}.apps-page>.site-header{background:var(--apps-navy)}
.apps-hero{position:relative;isolation:isolate;overflow:hidden;box-sizing:border-box;min-height:calc(100svh - var(--service-header-height,126px));display:flex;align-items:center;padding:64px 6% 90px;background:var(--apps-navy);color:white}
.apps-scene{position:absolute;inset:0;z-index:-1}.apps-scene video{width:100%;height:100%;object-fit:cover;object-position:68% center}.apps-scene:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0d1d27 0%,#0d1d27f2 30%,#0d1d2799 43%,transparent 61%),linear-gradient(0deg,#0d1d27 0%,transparent 14%,transparent 82%,#0d1d2780 100%)}
.apps-opening{width:46%;max-width:650px;position:relative}.apps-opening>.eyebrow{color:#9bd66f;font:600 18px/1.5 General,sans-serif;letter-spacing:.065em;margin:0 0 22px}.apps-hero h1{font:600 clamp(44px,4.25vw,72px)/1.05 Outfit,sans-serif;letter-spacing:-.04em;margin:0 0 30px;text-wrap:pretty}.apps-hero h1 em{color:#61b7fa;font-style:normal}.apps-lead{font:400 clamp(20px,1.45vw,24px)/1.6 General,sans-serif;color:#dce5e6;margin:0}.apps-film-controls{position:absolute;bottom:22px;right:6%;display:flex;align-items:center;gap:20px;font:400 13px/1.4 General,sans-serif;color:#d0dce2}.apps-motion{font:500 14px/1.4 Outfit,sans-serif;border:1px solid #ffffff50;background:#0d1d2780;border-radius:24px;color:white;padding:10px 16px;cursor:pointer}.apps-motion:focus-visible,.apps-faq summary:focus-visible,.apps-case-link:focus-visible{outline:3px solid #61b7fa;outline-offset:5px}
.apps-section{padding:100px 6%;color:var(--apps-ink);background:#f4f6f2}.apps-container{max-width:1320px;margin:auto}.apps-section .eyebrow{font:600 16px/1.5 General,sans-serif;letter-spacing:.14em;color:#2787cf;margin:0 0 24px}.apps-section h2{font:600 clamp(36px,3.65vw,58px)/1.12 Outfit,sans-serif;letter-spacing:-.035em;margin:0 0 30px;text-wrap:pretty}.apps-section h2 em{font-style:normal;color:var(--apps-blue)}.apps-section p{font:400 19px/1.65 General,sans-serif;color:#4c626e;margin:0 0 24px}.apps-section h3{font:500 26px/1.2 Outfit,sans-serif;letter-spacing:-.02em;margin:0 0 14px}.apps-intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}.apps-benefits{display:grid;grid-template-columns:repeat(3,1fr);margin-top:42px;border:1px solid #d0dad5;border-radius:18px;background:white;overflow:hidden}.apps-benefits article{padding:34px}.apps-benefits article+article{border-left:1px solid #d0dad5}.apps-benefits p{margin:0;font-size:18px}.apps-example{background:var(--apps-navy);color:white}.apps-example .eyebrow{color:#a8db80}.apps-example p{color:#cbd9df}.apps-example-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:10%;align-items:center}.apps-phone{margin:0;justify-self:center;width:min(100%,310px)}.apps-phone img{display:block;width:100%;height:auto;border-radius:32px;border:7px solid #070e15;box-shadow:0 25px 65px #0007}.apps-phone figcaption{text-align:center;font:400 14px/1.4 General,sans-serif;color:#b7ccd4;margin-top:20px}.apps-case-link{display:inline-flex;align-items:center;gap:22px;font:500 20px/1.4 Outfit,sans-serif;color:#a8db80;border-bottom:1px solid #a8db80;padding:8px 0;text-decoration:none;margin-top:12px}.apps-sage{background:#e7eee6}.apps-split{display:grid;grid-template-columns:.9fr 1.1fr;gap:8%;align-items:start}.apps-rows{list-style:none;margin:0;padding:0}.apps-rows li{display:grid;grid-template-columns:48px minmax(0,1fr);gap:20px;padding:28px 0;border-top:1px solid #c8d3cd}.apps-rows li:last-child{border-bottom:1px solid #c8d3cd}.apps-rows p{margin:0;font-size:18px}.apps-faq details{border-top:1px solid #c8d3cd;padding:25px 0}.apps-faq details:last-child{border-bottom:1px solid #c8d3cd}.apps-faq summary{list-style:none;display:flex;justify-content:space-between;align-items:flex-start;gap:24px;cursor:pointer;font:500 23px/1.3 Outfit,sans-serif}.apps-faq summary::-webkit-details-marker{display:none}.apps-faq summary span{flex:0 0 32px;width:32px;height:32px;border:1px solid #b8c9c6;border-radius:50%;display:grid;place-items:center;font:400 20px/1 Outfit,sans-serif;color:#2787cf}.apps-faq summary span:before{content:'+'}.apps-faq details[open] summary span:before{content:'−'}.apps-faq details p{margin:24px 48px 0 0;font-size:18px}
@media(max-width:1000px){.apps-section{padding:76px 6%}.apps-hero h1{font-size:46px}.apps-opening{width:49%}.apps-section h2{font-size:40px}.apps-benefits article{padding:24px}.apps-section h3{font-size:24px}.apps-example-grid{gap:6%}.apps-split{gap:6%}}
@media(max-width:760px){.apps-hero{align-items:flex-start;padding:28px 6% 370px}.apps-opening{width:100%;max-width:none}.apps-hero h1{font-size:clamp(40px,10vw,52px)}.apps-opening>.eyebrow{font-size:16px}.apps-lead{font-size:20px}.apps-scene{inset:auto 0 0;height:360px}.apps-scene video{object-position:78% center}.apps-scene:after{background:linear-gradient(0deg,#0d1d27 0%,transparent 25%,transparent 58%,#0d1d27 100%)}.apps-film-controls{left:6%;right:6%;justify-content:space-between;gap:12px;font-size:11px}.apps-motion{font-size:13px;padding:9px 12px}.apps-section{padding:62px 6%}.apps-intro-grid,.apps-example-grid,.apps-split{grid-template-columns:1fr;gap:32px}.apps-section h2{font-size:36px}.apps-section p{font-size:18px}.apps-benefits{grid-template-columns:1fr;margin-top:28px}.apps-benefits article{padding:28px}.apps-benefits article+article{border-left:0;border-top:1px solid #d0dad5}.apps-phone{width:min(78vw,290px);margin-top:16px}.apps-faq summary{font-size:21px}.apps-faq details p{margin-right:0}.apps-rows li{gap:20px;padding:25px 0}}

/* Keep the phone beside the copy and feather every exposed film edge. */
@media(min-width:761px){.apps-scene{left:38%}.apps-scene video{object-position:40% center}.apps-scene:after{background:linear-gradient(90deg,#0d1d27 0%,#0d1d27d9 9%,#0d1d2755 24%,transparent 40%),linear-gradient(0deg,#0d1d27 0%,transparent 20%,transparent 75%,#0d1d27 100%)}}
@media(max-width:760px){.apps-scene video{object-position:45% center}}
.apps-faq details[open] summary span{transform:none}

/* Work-ticket film has the phone composed on the right in the source. */
@media(min-width:761px){.apps-scene{left:0}.apps-scene video{object-position:68% center}.apps-scene:after{background:linear-gradient(90deg,#0d1d27 0%,#0d1d27f2 30%,#0d1d2799 43%,transparent 61%),linear-gradient(0deg,#0d1d27 0%,transparent 14%,transparent 78%,#0d1d27 100%)}}
@media(max-width:760px){.apps-scene video{object-position:83% center}}

@media(min-width:761px) and (max-width:1000px){.apps-scene video{position:absolute;top:15%;left:-18%;width:130%;max-width:none;height:70%;object-fit:cover;object-position:60% center;mask-image:linear-gradient(0deg,transparent,#000 12%,#000 88%,transparent);-webkit-mask-image:linear-gradient(0deg,transparent,#000 12%,#000 88%,transparent)}}

/* Keep the opening thought together on desktop. */
.apps-title-opening{display:block}
@media(min-width:1001px){.apps-title-opening{white-space:nowrap}}

.apps-hero h1{font:600 clamp(40px,3.7vw,64px)/1.04 Outfit,sans-serif;letter-spacing:-.045em}
.apps-hero h1 .apps-title-opening{color:#fff;font:inherit;letter-spacing:inherit;margin-bottom:0}
@media(min-width:761px) and (max-width:1100px){.apps-hero h1{font-size:40px}}
@media(max-width:760px){.apps-hero h1{font-size:clamp(39px,8.5vw,57px);line-height:1.06}}