.sy{--ink:#203e43;--paper:#f6f5ef;--accent:#37666b;--content-width:1280px}.sy-compass{padding:65px 0 35px;display:grid;grid-template-columns:29% 42% 29%;align-items:center}.sy-compass header{padding-right:25px;align-self:start;padding-top:35px}.sy-compass h1 span{font-size:42px}.sy-compass>.art{height:540px;border-radius:270px 270px 0 0;animation:sy-orient 1.7s both}.sy-compass aside{padding-left:32px}.sy-compass nav{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);margin-top:40px;border-top:1px solid #9cafaa}.sy-compass nav a{display:flex;justify-content:space-between;padding:20px 25px;border-right:1px solid #c3cfca;font-size:17px}.sy-compass nav a:last-child{border:0}.sy-compass .motion{grid-column:3;justify-self:end;margin-top:25px}.sy-origin{padding:65px 0;background:#dce7e2}.sy-origin header{text-align:center;margin-bottom:35px}.sy-origin-stage{display:grid;grid-template-columns:1fr 2.5fr 1fr;gap:30px;align-items:center}.sy-origin-stage .art{height:390px}.sy-origin-stage aside{border-top:2px solid #b29864;padding-top:20px}.sy-origin-stage aside h3{font-size:21px}.sy-origin-stage aside p{font-size:15px;margin-top:17px}.sy-book{padding:45px 0 70px}.sy-book-heading{display:grid;grid-template-columns:1fr 1fr;gap:0 60px;margin-bottom:35px;align-items:end}.sy-book-heading .eyebrow{grid-column:1/-1}.sy-book-heading p:last-child{max-width:460px;justify-self:end}.sy-book-pages{display:grid;grid-template-columns:1.1fr 1fr;border-top:3px solid #799b91;background:#fff}.sy-book-pages>.art{height:520px}.sy-book-pages>div{padding:35px 45px;border-left:7px double #d6ddd3}.sy-route{background:#234a50;color:#edf4ed;padding:70px 0}.sy-route>.bound{display:grid;grid-template-columns:1fr 1.6fr;gap:35px;align-items:center}.sy-route header>p:last-child{margin-top:23px;color:#becfcb}.sy-route>.bound>.art{height:440px;clip-path:polygon(8% 0,100% 0,100% 100%,0 100%)}.sy-route-line{grid-column:1/-1;display:flex;gap:25px;align-items:center;width:75%;margin:0 auto;font-size:14px}.sy-route-line i{height:1px;flex:1;background:#c8b386;transform-origin:left;animation:sy-route 4s infinite alternate}.sy-qa{padding:35px 0 65px;display:grid;grid-template-columns:1fr 1.6fr;gap:50px}.sy-qa h2{font-size:30px}@keyframes sy-orient{from{clip-path:inset(100% 0 0)}to{clip-path:inset(0)}}@keyframes sy-route{from{transform:scaleX(.15)}to{transform:scaleX(1)}}@media(max-width:900px){.sy-compass{grid-template-columns:40% 60%}.sy-compass aside{grid-column:1/-1;padding:25px 0 0;max-width:800px}.sy-compass .motion{grid-column:2}.sy-origin-stage{grid-template-columns:1fr 2fr 1fr;gap:20px}.sy-book-pages>div{padding:30px}}@media(max-width:680px){.sy-compass{padding:30px 0;display:flex;flex-direction:column;align-items:stretch}.sy-compass header{padding:0}.sy-compass h1 span{font-size:32px}.sy-compass>.art{height:330px;width:90%;align-self:center;margin-top:25px;border-radius:150px 150px 0 0}.sy-compass aside{padding-top:25px}.sy-compass nav{margin-top:25px}.sy-compass nav a{font-size:12px;padding:16px 10px;gap:8px}.sy-compass .motion{align-self:end;margin-top:18px}.sy-origin{padding:45px 0}.sy-origin header{text-align:left;margin-bottom:25px}.sy-origin-stage{grid-template-columns:1fr 1fr;gap:25px 20px}.sy-origin-stage>.art{grid-column:1/-1;grid-row:1;height:270px}.sy-origin-stage aside h3{font-size:19px}.sy-origin-stage aside p{font-size:14px;margin-top:12px}.sy-book{padding:25px 0 45px}.sy-book-heading{display:block;margin-bottom:25px}.sy-book-heading p:last-child{margin-top:20px}.sy-book-pages{display:block}.sy-book-pages>.art{height:270px}.sy-book-pages>div{padding:25px;border-left:0;border-top:7px double #d6ddd3}.sy-route{padding:45px 0}.sy-route>.bound{display:block}.sy-route>.bound>.art{height:290px;margin-top:25px;clip-path:none}.sy-route-line{width:100%;font-size:12px;gap:10px;margin-top:25px}.sy-qa{display:block;padding:25px 0 40px}.sy-qa h2{font-size:26px;margin-bottom:20px}}

/* page-business-motion */
.sy-origin[data-seen="true"] .sy-origin-stage>.art{animation:sy-align 1.2s cubic-bezier(.2,.7,.2,1) both}
.sy-book[data-seen="true"] .sy-book-pages>.art{animation:sy-align 1.2s cubic-bezier(.2,.7,.2,1) both}
.sy-route[data-seen="true"] .art{animation:sy-align 1.2s cubic-bezier(.2,.7,.2,1) both}
@keyframes sy-align{from{clip-path:inset(0 0 0 45%)}to{clip-path:inset(0)}}
@media(prefers-reduced-motion:reduce){.sy-origin-stage>.art,.sy-book-pages>.art,.sy-route .art{animation:none!important}}
