.home-feature{--tile-light:#fff0d6;--tile-mid:#eed0a0;--tile-edge:#b78a4c;--tile-ink:#775124;border-radius:16px}.home-feature[data-tone="1"]{--tile-light:#ffe9ee;--tile-mid:#ecc1cc;--tile-edge:#bc8192;--tile-ink:#874c63}.home-feature[data-tone="2"]{--tile-light:#eeeaff;--tile-mid:#cec6ea;--tile-edge:#9586b5;--tile-ink:#655183}.home-feature[data-tone="3"]{--tile-light:#e9f3df;--tile-mid:#c8dbb8;--tile-edge:#8ca079;--tile-ink:#536940}.home-feature[data-tone="4"]{--tile-light:#e5f2fa;--tile-mid:#bdd7e6;--tile-edge:#83a7bc;--tile-ink:#42677f}.home-feature[data-tone="5"]{--tile-light:#ffecdf;--tile-mid:#efc6ac;--tile-edge:#c59270;--tile-ink:#8a5738}.feature-object{perspective:500px;flex:0 0 88px;width:88px;height:96px;display:block;position:relative}.feature-object-shadow{background:var(--tile-edge);opacity:.22;filter:blur(7px);border-radius:50%;height:18px;transition:transform .35s,opacity .35s;position:absolute;bottom:4px;left:14px;right:4px}.feature-object-base,.feature-object-face{border-radius:24px;transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s;position:absolute;inset:5px 6px 14px;transform:rotateX(14deg)rotateY(-18deg)rotate(-7deg)}.feature-object-base{background:var(--tile-edge);transform:translate(3px,6px)rotateX(14deg)rotateY(-18deg)rotate(-7deg)}.feature-object-face{background:linear-gradient(140deg, var(--tile-light) 12%, var(--tile-mid) 95%);box-shadow:inset 1px 2px 2px #ffffffe6, inset -2px -2px 3px #5a3e271a, 5px 10px 14px -10px var(--tile-edge);place-items:center;display:grid}.feature-object-face svg{fill:none;width:44px;height:44px;position:absolute}.feature-object-depth{color:var(--tile-edge);transform:translate(1px,3px)}.feature-object-symbol{color:var(--tile-ink);filter:drop-shadow(0 -1px #ffffffd9)}@media (hover:hover) and (pointer:fine){.home-feature:hover .feature-object-face{box-shadow:inset 1px 2px 2px #ffffffe6, inset -2px -2px 3px #5a3e271a, 6px 14px 18px -10px var(--tile-edge);transform:translateY(-7px)rotateX(7deg)rotateY(12deg)rotate(4deg)}.home-feature:hover .feature-object-base{transform:translate(2px,-2px)rotateX(7deg)rotateY(12deg)rotate(4deg)}.home-feature:hover .feature-object-shadow{opacity:.14;transform:scale(.85)}}@media (max-width:639px){.feature-object{flex-basis:72px;width:72px;height:80px}.feature-object-base,.feature-object-face{border-radius:20px}.feature-object-face svg{width:36px;height:36px}}@media (prefers-reduced-motion:reduce){.feature-object *,.home-feature:hover .feature-object-face,.home-feature:hover .feature-object-base{transition:none}.home-feature:hover .feature-object-face{transform:rotateX(14deg)rotateY(-18deg)rotate(-7deg)}.home-feature:hover .feature-object-base{transform:translate(3px,6px)rotateX(14deg)rotateY(-18deg)rotate(-7deg)}.home-feature:hover .feature-object-shadow{opacity:.22;transform:none}}.home-feature[data-active=true] .feature-object-face{box-shadow:inset 1px 2px 2px #ffffffe6, inset -2px -2px 3px #5a3e271a, 6px 14px 18px -10px var(--tile-edge);transform:translateY(-7px)rotateX(7deg)rotateY(12deg)rotate(4deg)}.home-feature[data-active=true] .feature-object-base{transform:translate(2px,-2px)rotateX(7deg)rotateY(12deg)rotate(4deg)}.home-feature[data-active=true] .feature-object-shadow{opacity:.14;transform:scale(.85)}.step-object-wrap{border-radius:24px;width:88px;height:96px}.step-object-wrap .feature-object{width:100%}.home-step .step-connector{height:calc(100% - 3rem);top:100px;left:43px}@media (max-width:639px){.step-object-wrap{width:72px;height:80px}.home-step .step-connector{height:calc(100% - 2rem);top:84px;left:35px}}@media (min-width:1280px){.home-step .step-connector{width:calc(100% - 80px);height:3px;top:44px;left:calc(50% + 52px)}}
