/* A living layer of the original studio: particles, signal, curiosity and real product imagery. */
.hero{gap:4%;grid-template-columns:1.07fr 1fr;padding-top:160px;min-height:790px}.hero-copy{padding-bottom:35px}.hero h1{font-size:clamp(60px,6.1vw,102px)}.hero .living-art{margin:0;height:570px;min-width:0;border-radius:22px;overflow:hidden;background:#11121b;transform:none;border:1px solid #252d3520;box-shadow:0 30px 65px #232a3020;isolation:isolate}.living-art:before{content:'';position:absolute;inset:0;background-image:linear-gradient(#b7c4d20b 1px,transparent 1px),linear-gradient(90deg,#b7c4d20b 1px,transparent 1px);background-size:70px 70px;mask-image:radial-gradient(ellipse,#000,transparent 85%);z-index:0}.living-art:after{content:'';position:absolute;inset:0;background:linear-gradient(#11121b00 65%,#11121bc9);pointer-events:none;z-index:2}.study-top{position:absolute;inset:24px 25px auto;display:flex;justify-content:space-between;gap:12px;font-size:6px;letter-spacing:1.1px;color:#b7bdc7;z-index:4}.study-top i{width:4px;height:4px;background:#d3fc6c;display:inline-block;border-radius:50%;margin-right:5px;box-shadow:0 0 10px #d3fc6c88}.study-top>span:last-child{opacity:.55}#living-field{position:absolute;inset:0;width:100%;height:100%;z-index:1;touch-action:pan-y}.study-face{position:absolute;left:50%;top:45%;width:76px;height:76px;transform:translate(-50%,-50%);display:grid;place-items:center;z-index:3;pointer-events:none}.study-face>img{width:59px;border-radius:17px;box-shadow:0 0 0 9px #ed927c12,0 0 0 10px #ed927c35,0 0 45px #f7927350;animation:face-float 7s ease-in-out infinite}.study-face>span{position:absolute;width:210px;height:125px;border:1px solid #d3fc6c65;border-radius:50%;transform:rotate(-22deg)}.study-face>span:nth-child(2){width:122px;height:200px;border-color:#a9cfff40;transform:rotate(-30deg)}.study-note{position:absolute;left:50%;top:68%;transform:translateX(-50%);width:max-content;max-width:92%;font-size:6px;letter-spacing:1.2px;padding:8px 13px;color:#c0c6d1;background:#11121bd9;border:1px solid #c6d1e12b;border-radius:25px;z-index:3;pointer-events:none}.study-bottom{position:absolute;bottom:49px;left:22px;right:22px;display:flex;justify-content:space-between;align-items:center;gap:8px;z-index:5}.study-controls{display:flex;border:1px solid #ffffff27;border-radius:30px;padding:4px;background:#151721ac;backdrop-filter:blur(10px)}.study-controls button{background:none;border:0;color:#b1b7c5;font-size:8px;padding:8px 13px;border-radius:25px}.study-controls button[aria-pressed=true]{background:#d3fc6c;color:#202516}.study-bottom .motion-button{position:static;flex-shrink:0;color:#d2d5df;border-color:#ffffff40;width:32px;height:32px}.study-hint{position:absolute;bottom:17px;left:25px;margin:0;font-size:5px;letter-spacing:1.6px;color:#8992a6;z-index:5}.hero-bottom{margin-top:45px}.visual-paths{gap:5%}.visual-paths .path-feature{border:0;padding-top:0;display:block}.path-media{height:330px;border-radius:13px;position:relative;overflow:hidden;margin-bottom:25px;transition:transform .45s,box-shadow .45s}.path-feature:hover .path-media{transform:translateY(-5px);box-shadow:0 18px 36px #25282316}.poster-caption{position:absolute;top:24px;left:25px;font-size:6px;letter-spacing:1.4px;z-index:4}.poster-bottom{position:absolute;left:25px;bottom:20px;right:25px;display:flex;align-items:center;justify-content:space-between;font-size:6px;letter-spacing:1.3px;z-index:4}.poster-bottom i{font-size:20px;font-style:normal}.flow-poster{background:#25322d;color:#d7dece;background-image:radial-gradient(ellipse at 70% 40%,#7d9d6b22,transparent 65%),linear-gradient(#b5c3a20a 1px,transparent 1px),linear-gradient(90deg,#b5c3a20a 1px,transparent 1px);background-size:auto,50px 50px,50px 50px}.signal-route{display:flex;gap:0;align-items:center;position:absolute;top:60px;left:14%;right:14%;height:65px}.signal-route>i{width:36px;height:36px;border:1px solid #c2d4b43b;display:grid;place-items:center;border-radius:12px;font-size:18px;color:#d9e7cc;font-style:normal;background:#2c3b32}.signal-route>span{flex:1;height:1px;background:#b9d39a45;position:relative}.signal-route>span:after{content:'';position:absolute;width:5px;height:5px;top:-2px;left:0;background:#d3fc6c;border-radius:50%;box-shadow:0 0 9px #d3fc6c;animation:signal-pass 3.5s linear infinite}.signal-route>img{width:42px;border-radius:12px;box-shadow:0 0 0 6px #ffffff08}.flow-paper{background:#f3f1e7;color:#283328;width:65%;position:absolute;left:18%;top:145px;padding:17px 22px;border-radius:6px;transform:rotate(-4deg);box-shadow:0 12px 25px #0002}.flow-paper>span{font-size:5px;letter-spacing:1px;display:block;color:#6e7a64}.flow-paper>b{font-size:24px;font-weight:500;letter-spacing:-1px;line-height:1.1;display:block;margin:10px 0}.flow-paper>p{font-size:6px;margin:0;color:#5d7153}.flow-paper>div{position:absolute;right:15px;top:52px;display:flex;gap:3px;align-items:center;height:30px}.flow-paper i{width:2px;height:8px;background:#a7b895;animation:signal-bar 2.6s ease-in-out infinite}.flow-paper i:nth-child(3n){height:25px;animation-delay:-1s}.flow-paper i:nth-child(2n){height:15px;animation-delay:-.6s}.product-poster{background:#dfd9bf;color:#393a27;background-image:radial-gradient(ellipse at 70% 30%,#fff4b0,transparent 65%)}.poster-tick{position:absolute;left:17%;top:100px;transform:rotate(-15deg);box-shadow:0 22px 35px #4742241c;border-radius:20px}.poster-tick img{width:92px;border-radius:20px}.poster-word{position:absolute;left:12%;top:190px;font-size:65px;font-weight:800;letter-spacing:-4px;transform:rotate(-8deg);opacity:.8}.poster-phone{position:absolute;right:15%;top:48px;transform:rotate(12deg);width:145px;height:244px;background:#171b14;padding:6px;border:1px solid #53533c;border-radius:19px;box-shadow:10px 20px 25px #39352033}.poster-phone img{width:100%;height:100%;border-radius:13px;object-fit:cover;object-position:top}.visual-paths h2{font-size:clamp(32px,3.4vw,52px);letter-spacing:-2px;margin:20px 0}.visual-paths>a>span{font-size:7px;letter-spacing:1.4px}.visual-paths>a>p{max-width:410px}.closing-links{display:flex;gap:35px;align-items:center}.immersive-product{background:#19221e;color:#f3f1df;border:1px solid #4e5c4b}.immersive-product .okayd-story>p{color:#b9c2b2}.immersive-product .okayd-brand strong{color:#f5f1d7}.immersive-product .product-kicker{color:#e2c96f!important}.immersive-product .okayd-visual{background:radial-gradient(ellipse at 50% 50%,#78874d45,transparent 75%)}.immersive-product .okayd-orbits{border-color:#d8dfa43d}.immersive-product .okayd-orbits:after{border-color:#d8dfa41f}.immersive-product .product-caption,.immersive-product .product-visual-label{color:#b5bea9}.immersive-product .pill{background:#e4d07d;color:#252b19}.immersive-product .product-details{color:#c2ccba}.product-preview-controls{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:26px}.product-preview-controls button{font-size:8px;padding:8px 12px;border:1px solid #adba9f4d;color:#bdcbb2;border-radius:20px;background:none}.product-preview-controls button[aria-pressed=true]{background:#c7d4a6;color:#283021;border-color:#c7d4a6}.immersive-product .phone{box-shadow:20px 30px 60px #0008;transition:transform .6s}.immersive-product:hover .phone{transform:rotate(3deg) translateY(-5px)}.possibilities .workflow-demo{box-shadow:0 30px 90px #0004,0 0 60px #c5dc8920}.possibilities .incoming{box-shadow:0 7px 20px #0002}.possibilities .prepared{box-shadow:0 8px 20px #0002}@keyframes face-float{50%{transform:translateY(-4px) rotate(-5deg)}}@keyframes signal-pass{to{left:100%;opacity:.2}}@keyframes signal-bar{50%{transform:scaleY(.4)}}
@media(min-width:1600px){.hero .living-art{height:680px}.hero{min-height:900px}}@media(max-width:1100px){.hero .living-art{height:500px}.hero h1{font-size:clamp(48px,6.2vw,75px)}.study-controls button{font-size:7px;padding:8px 9px}.study-top{inset:20px 18px auto;font-size:5px}.study-bottom{left:15px;right:15px}.study-note{font-size:5px}.path-media{height:300px}.poster-phone{right:10%;width:130px}.poster-word{font-size:52px}.flow-paper{left:12%;width:76%}.closing-links{gap:20px}}@media(max-width:800px){.hero{padding-top:125px;grid-template-columns:1fr;gap:30px}.hero-copy{padding-bottom:0}.hero .living-art{height:470px;width:100%;margin:0;max-width:100%;border-radius:17px}.hero h1{font-size:clamp(60px,10vw,85px)}.hero-bottom{margin-top:10px}.study-controls button{font-size:8px;padding:8px 12px}.study-top{font-size:6px;inset:23px}.study-note{font-size:6px}.study-bottom{left:20px;right:20px}.path-media{height:280px}.poster-phone{width:115px;height:205px;right:9%;top:50px}.poster-word{font-size:40px;left:7%;top:185px}.poster-tick{left:13%;top:95px}.poster-tick img{width:65px;border-radius:16px}.flow-paper{padding:15px;left:10%;width:80%;top:132px}.flow-paper>b{font-size:20px}.flow-paper>div{display:none}.signal-route{left:10%;right:10%;top:55px}.poster-caption{font-size:5px;left:18px;top:20px}.poster-bottom{left:18px;right:18px;font-size:5px}.closing-links{flex-direction:column;align-items:flex-start;gap:15px}.immersive-product .okayd-visual{border-top:1px solid #c3d2a32a}.visual-paths h2{font-size:32px}}@media(max-width:480px){.hero{padding-top:115px;gap:25px}.hero h1{font-size:clamp(44px,12.5vw,60px)}.hero .living-art{height:405px}.study-top{font-size:5px;inset:20px 17px auto;letter-spacing:.7px}.study-controls button{font-size:7px;padding:8px 10px}.study-bottom{left:13px;right:13px;bottom:44px}.study-hint{left:17px;font-size:4px;letter-spacing:1.2px}.study-note{font-size:4.5px;letter-spacing:.7px;padding:6px 9px;top:66%}.study-face>img{width:49px;border-radius:14px}.study-face>span{width:170px;height:100px}.study-face>span:nth-child(2){width:95px;height:155px}.visual-paths{gap:40px}.path-media{height:300px}.poster-phone{width:145px;height:244px;right:12%;top:35px}.poster-word{font-size:53px;left:10%;top:200px}.poster-tick{left:15%;top:90px}.poster-tick img{width:76px}.flow-paper{top:140px;left:12%;width:76%}.flow-paper>b{font-size:23px}.visual-paths h2{font-size:36px}.home-closing .closing-links{margin-top:22px}.home-closing .text-link{margin-top:0}.product-preview-controls button{font-size:7px;padding:8px 10px}}
@media(prefers-reduced-motion:reduce){.living-art *, .path-media *, .immersive-product *{animation:none!important;transition:none!important}.path-feature:hover .path-media,.immersive-product:hover .phone{transform:none}}

.flow-paper{top:125px}
