.hero-art{--scene-x:0;--scene-y:0;--ribbon-turn:0deg;isolation:isolate;-webkit-tap-highlight-color:transparent;background:radial-gradient(at 59% 47%,#24402a 0%,#192f23 50%,#152b20 100%);border-radius:30px;min-width:0;height:531.969px;position:relative;overflow:hidden}.hero-art-title{z-index:5;pointer-events:none;position:absolute;top:32px;left:32px}.hero-art-title>span{letter-spacing:.15em;color:var(--color-muted);font-size:8px}.hero-art-title h2{letter-spacing:-.045em;margin:30px 0 0;font-size:29px;font-weight:500;line-height:1.1}.device-stage{perspective:1000px;position:absolute;inset:145px 32px 52px}.scene-atmosphere{pointer-events:none;z-index:0;width:100%;height:100%;transform:translateX(calc(var(--scene-x) * 1.5px)) rotate(var(--ribbon-turn));transform-origin:50%;transition:transform 1s;position:absolute;overflow:visible}.scene-ribbon{transform-origin:50%;animation:3.6s ease-in-out both ribbon-breathe}.ribbon-body{fill-opacity:.9;transition:fill-opacity .8s}.hero-art[data-active=tv]{--ribbon-turn:-1deg}.hero-art[data-active=laptop]{--ribbon-turn:1deg}.hero-art:focus-within .ribbon-body{fill-opacity:1}.scene-key{pointer-events:none;filter:drop-shadow(1px 5px 3px #74845120);width:26%;max-width:120px;position:absolute;top:5%;left:3%;overflow:visible}.hero-device{--depth-x:3px;--depth-y:2px;--tilt:-3deg;--yaw:-5deg;--lift:0px;appearance:none;cursor:pointer;outline-offset:5px;transform-style:preserve-3d;touch-action:manipulation;--device-scale:1;--hover-scale:1.07;background:0 0;border:0;border-radius:14px;padding:0;line-height:0;position:absolute}.device-visual{pointer-events:none;border-radius:inherit;transform-origin:50%;transform:translate3d(calc(var(--scene-x) * var(--depth-x)), calc(var(--scene-y) * var(--depth-y) - var(--lift)), 0) rotate(var(--tilt)) rotateY(var(--yaw));filter:drop-shadow(1px 7px 5px #5263421b);transition:transform .28s cubic-bezier(.22,1,.36,1),filter .28s;display:block}.device-surface{border-radius:inherit;transform-origin:var(--scale-origin,50% 50%);transform:scale(var(--device-scale));transition:transform .28s cubic-bezier(.22,1,.36,1);display:block}.hero-device:focus-visible{outline:none}.hero-device:focus-visible .device-surface{outline:2px solid var(--focus);outline-offset:5px}.hero-device.is-active{--lift:3px;--yaw:0deg}.hero-device.is-active .device-visual{filter:drop-shadow(1px 10px 6px #52634225)}.hero-device.is-emphasized{--device-scale:var(--hover-scale);z-index:4}.hero-device.is-emphasized .device-visual{filter:drop-shadow(1px 12px 7px #52634229)}.device-drawing{width:100%;height:auto;display:block;overflow:visible}.hero-device-tv{--hover-scale:1.08;--scale-origin:50% 15%;z-index:1;width:48%;top:0;left:47%}.hero-device-laptop{--depth-x:4px;--depth-y:3px;--yaw:5deg;z-index:2;width:54%;top:51%;left:1%}.hero-device-phone{--hover-scale:1.1;--scale-origin:50% 70%;--depth-x:5px;--depth-y:4px;--tilt:7deg;--yaw:-6deg;z-index:2;border-radius:20px;width:17%;top:52%;left:79%}.hero-device-tv.is-active,.hero-device-laptop.is-active{--tilt:-1.5deg}.hero-device-phone.is-active{--tilt:4deg}.screen-stop-start{stop-color:#31523a;transition:stop-color .85s}.screen-stop-end{stop-color:#1d3827;transition:stop-color .85s}.screen-wave{stroke:#436a3b;stroke-opacity:.8;transition:stroke .85s,stroke-opacity .85s}.is-active .screen-stop-start{stop-color:#3e5d37}.is-active .screen-stop-end{stop-color:#2b482c}.is-active .screen-wave{stroke:var(--color-accent);stroke-opacity:.65}.hero-art-caption{color:#7c8573;align-items:center;gap:12px;display:flex;position:absolute;bottom:14px;left:32px;right:32px}.device-picker{align-items:center;gap:22px;display:flex}.device-picker button{min-height:32px;color:var(--color-muted);font:inherit;background:0 0;border:0;padding:8px 0;font-size:10px;position:relative}.device-picker button[aria-pressed=true]{color:var(--color-text)}.device-picker button:after{content:"";background:var(--color-accent);transform-origin:0;height:2px;transition:transform .3s;position:absolute;bottom:4px;left:0;right:0;transform:scaleX(0)}.device-picker button[aria-pressed=true]:after{transform:scaleX(1)}.scene-sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@keyframes ribbon-breathe{0%,to{transform:translate(0,0)rotate(0)}50%{transform:translate(2px,-3px)rotate(-.7deg)scaleY(1.025)}}@media (hover:hover) and (pointer:fine){.hero-art:hover .ribbon-body{fill-opacity:1}}@media (max-width:1100px){.hero-art{height:480px}.hero-art-title{left:25px}.hero-art-title h2{font-size:27px}.hero-art-caption{left:25px;right:25px}.device-stage{inset:135px 25px 52px}.hero-device-tv{width:47%;left:48%}.hero-device-laptop{width:53%;top:50%}}@media (min-width:601px) and (max-width:800px){.hero-art{height:440px}.hero-art-title{top:26px;left:23px}.hero-art-title h2{font-size:24px}.hero-art-title>span{font-size:7px}.device-stage{inset:135px 23px 52px}.hero-device-tv{width:61%;left:33%}.hero-device-laptop{width:63%;top:53%;left:0}.hero-device-phone{--tilt:5deg;width:19%;top:53%;left:78%}.scene-key{width:28%;top:9%;left:0}}@media (max-width:600px){.hero-art{border-radius:23px;height:480px}.hero-art-title{top:25px;left:25px}.hero-art-title h2{margin-top:28px;font-size:27px}.device-stage{max-width:310px;margin-inline:auto;inset:142px 24px 60px}.hero-device-tv{width:62%;left:29%}.hero-device-laptop{width:63%;top:53%;left:0}.hero-device-phone{--tilt:5deg;width:20%;top:54%;left:77%}.scene-key{width:28%;top:8%;left:0}.hero-art-caption{justify-content:center;bottom:14px;left:25px;right:25px}.device-picker{gap:30px}.device-picker button{min-height:40px;font-size:11px}}@media (max-width:359px){.hero-art{height:440px}.hero-art-title h2{font-size:22px}.device-stage{left:22px;right:22px}}@media (hover:none),(pointer:coarse){.hero-device{--depth-x:0px;--depth-y:0px}}@media (prefers-reduced-motion:reduce){.hero-art *,.hero-art :before,.hero-art :after{transition:none!important;animation:none!important}.hero-art{--scene-x:0!important;--scene-y:0!important}}@media (max-width:800px){.hero-device{--hover-scale:1.05}.hero-device-phone{--hover-scale:1.06}}@media (hover:none),(pointer:coarse){.hero-device.is-active{--device-scale:1.035;z-index:4}.hero-device-phone.is-active{--device-scale:1.045}}@media (prefers-reduced-motion:reduce){.hero-device{--device-scale:1!important}}.device-feedback{pointer-events:none}.feedback-pulse{transform-box:fill-box;transform-origin:50%;animation:.65s ease-out forwards feedback-pulse}.feedback-result{opacity:0;animation:.25s ease-out .65s forwards feedback-result}@keyframes feedback-pulse{0%{opacity:0;stroke-dasharray:0 250}20%{opacity:1}to{opacity:0;stroke-dasharray:250 0}}@keyframes feedback-result{to{opacity:1}}@media (prefers-reduced-motion:reduce){.feedback-pulse{display:none}.feedback-result{opacity:1}}.feedback-result text{font-size:19px}@media (max-width:800px){.feedback-result text{display:none}}.hero-device{height:auto;min-height:0;display:block}.hero-art-title{right:24px}