/* The entire scene is native HTML/CSS. Scroll changes its camera and layer depth. */
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.experience{--story-header:104px;--scene-fit:1;--progress:0;--rotate-x:8deg;--rotate-y:-22deg;--rotate-z:-5deg;--device-scale:1;--device-x:0px;--device-y:0px;--spread:0;--phone:0;--glow:.2;position:relative;background:#0b1118;color:#f3f4f5;isolation:isolate;scroll-margin-top:0!important}
.experience.is-animated{height:350svh}
.experience-pin{position:relative;min-height:680px;overflow:hidden;background:#0b1118}
.experience.is-animated .experience-pin{position:sticky;top:var(--story-header);height:calc(100svh - var(--story-header));min-height:0}
.experience-film,.experience-video,.experience-vignette{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.experience-film{opacity:calc(.24 + var(--glow)*.28);transform:scale(1.05)}
.experience-video{object-fit:cover;filter:saturate(.6)}
.experience-vignette{background:linear-gradient(90deg,#0b1118 4%,#0b111833 62%,#0b111877),linear-gradient(0deg,#0b1118,transparent 30%,transparent 75%,#0b1118)}
.experience-topbar{position:absolute;top:30px;left:var(--gutter);right:var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:24px;z-index:5}
.experience-eyebrow{font-size:11px;letter-spacing:.09em;text-transform:uppercase;display:flex;align-items:center;gap:11px;color:#cbd4dd}
.live-dot{width:5px;height:5px;border-radius:50%;background:var(--accent-light);box-shadow:0 0 12px #ed969050}
.experience-tools{display:flex;align-items:center;gap:24px}
.experience-tools>a{font-size:11px;color:#b9c7d4;display:flex;gap:18px;align-items:center}
.experience-tools>a:hover{color:var(--accent-light)}
.experience-tools>a>span{font-size:18px}
.experience-motion{border:1px solid #ffffff35;background:#ffffff08;color:#e3eaf0;width:30px;height:30px;border-radius:50%;font-size:11px;display:grid;place-items:center}
.experience-motion:disabled{cursor:default;opacity:.4}
.experience-copy{position:absolute;z-index:3;left:var(--gutter);top:20%;width:40%;pointer-events:none}
.experience-chapter{position:absolute;top:0;left:0;width:100%;opacity:0;visibility:hidden;transform:translateY(24px);will-change:transform,opacity}
.experience-chapter.is-active{opacity:1;visibility:visible;transform:none}
.chapter-kicker{font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:#909fad;display:block;margin-bottom:24px}
.experience-chapter h3{font-size:clamp(42px,5.05vw,83px);font-weight:500;letter-spacing:-.062em;line-height:1.04}
.experience-chapter h3 em{font-style:normal;color:var(--accent-light)}
.experience-chapter p{font-size:14px;line-height:1.8;color:#a6b4c1;margin-top:25px;max-width:350px}
.experience-visual{position:absolute;left:44%;width:53%;top:13%;height:75%;pointer-events:none}
.experience-scene{position:absolute;inset:0;perspective:1400px;perspective-origin:50% 50%;transform-style:preserve-3d}
.experience-device{position:absolute;left:50%;top:48%;width:600px;height:385px;margin-left:-300px;margin-top:-192.5px;transform-style:preserve-3d;transform:translate3d(var(--device-x),var(--device-y),0) scale(calc(var(--scene-fit)*var(--device-scale))) rotateX(var(--rotate-x)) rotateY(var(--rotate-y)) rotateZ(var(--rotate-z));will-change:transform}
.experience-layer{position:absolute;inset:0;border-radius:16px;backface-visibility:visible;transform-style:preserve-3d}
.product-window{overflow:hidden;background:#edf1f5;color:#202d3a;box-shadow:0 0 0 1px #ffffff90,0 3px 0 2px #6b7c8c,0 20px 90px #0009;transform:translate3d(0,calc(var(--spread)*-58px),calc(var(--spread)*145px));will-change:transform}
.product-chrome{height:35px;padding:0 15px;border-bottom:1px solid #d0d9e2;display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:.015em;background:#f8fafc}
.chrome-dots{display:flex;gap:5px}.chrome-dots i{width:5px;height:5px;border-radius:50%;background:#c8d2dc}.chrome-dots i:first-child{background:#889dad}
.product-layout{height:350px;display:grid;grid-template-columns:126px 1fr}
.product-sidebar{padding:22px 12px 14px;display:flex;flex-direction:column;gap:9px;border-right:1px solid #d0d9e2;font-size:9px}
.product-sidebar>img{width:31px;height:auto;margin:0 0 23px 8px}
.product-sidebar>span{padding:8px 7px;border-radius:5px;color:#76899a}.product-sidebar .selected{background:#dce5ed;color:#314b63}
.sidebar-bottom{margin-top:auto;font-size:7px;color:#657b8d;display:flex;align-items:center;justify-content:space-between;gap:4px}.sidebar-bottom i{width:4px;height:4px;background:#567a98;border-radius:50%}
.product-content{padding:20px 23px 15px}.product-greeting{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:#677e90}.product-avatar{height:23px;width:23px;display:grid;place-items:center;border-radius:50%;background:#d8e4ee;font-size:8px}
.product-headline{font-size:35px;letter-spacing:-.06em;line-height:1.04;margin-top:9px;position:relative}.product-headline>span{position:absolute;right:0;top:3px;color:#b43838;font-size:50px}
.product-widgets{display:grid;grid-template-columns:1.45fr 1fr;gap:12px;margin-top:22px;height:131px}.product-chart{background:#f9fbfd;border:1px solid #d5dfe8;border-radius:9px;padding:13px}.product-chart>div:first-child{display:flex;justify-content:space-between;font-size:9px}.chart-bars{display:flex;gap:8px;align-items:flex-end;height:76px;padding-top:15px}.chart-bars i{flex:1;background:#b6c8d8;border-radius:3px 3px 0 0;height:40%;transform-origin:bottom;transform:scaleY(calc(.7 + var(--progress)*.3))}.chart-bars i:nth-child(2){height:57%}.chart-bars i:nth-child(3){height:45%}.chart-bars i:nth-child(4){height:70%}.chart-bars i:nth-child(5){height:58%}.chart-bars i:nth-child(6){height:77%}.chart-bars i:nth-child(7){height:69%}.chart-bars i:nth-child(8){height:85%;background:#6c8ba6}.chart-bars i:nth-child(9){height:100%;background:#b43838}
.product-connect{background:#263c51;color:#edf3f8;border-radius:9px;padding:13px;display:flex;flex-direction:column;justify-content:space-between}.connect-orb{font-size:38px;line-height:1;color:#ed9690}.product-connect b{font-size:12px;line-height:1.3;font-weight:500}.product-bottom{display:flex;justify-content:space-between;margin-top:18px;font-size:8px;color:#687f93}.product-bottom>span{display:flex;align-items:center;gap:5px}.product-bottom i{height:4px;width:4px;border-radius:50%;background:#b43838}
.layer-data,.layer-logic{border:1px solid #adc4d950;background:#142232ec;box-shadow:0 10px 50px #0005;opacity:var(--spread);will-change:transform,opacity}
.layer-logic{transform:translate3d(0,calc(var(--spread)*25px),calc(var(--spread)*-40px))}
.layer-data{transform:translate3d(0,calc(var(--spread)*112px),calc(var(--spread)*-210px));background:linear-gradient(#9abedc18 1px,transparent 1px),linear-gradient(90deg,#9abedc18 1px,transparent 1px),#101e2c; background-size:25px 25px}
.layer-caption{display:flex;justify-content:space-between;align-items:center;padding:20px 23px;color:#becfdd;font-size:13px}.layer-caption b{font-size:11px;font-weight:400;opacity:.5}
.logic-flow{display:flex;align-items:center;justify-content:space-between;margin:95px 30px 0}.logic-flow>span{padding:18px 19px;border:1px solid #adc6dd65;border-radius:8px;font-size:16px;color:#dce7f0;box-shadow:0 0 25px #ed969008}.logic-flow i{color:#ed9690;font-style:normal;font-size:25px}.logic-traces{display:flex;justify-content:space-evenly;position:absolute;left:10%;right:10%;top:225px;bottom:20px}.logic-traces i{width:1px;background:linear-gradient(#96bad880,transparent)}
.data-nodes{position:absolute;bottom:20px;left:28px;right:28px;display:flex;justify-content:space-between;font-size:14px;color:#b4cce0}.data-nodes span{background:#172b3d;padding:8px 12px;border:1px solid #42647f;border-radius:4px}.data-paths{position:absolute;inset:80px 40px 50px;display:flex;flex-direction:column;justify-content:space-around}.data-paths i{height:1px;background:linear-gradient(90deg,transparent,#739bbd,transparent);transform:rotate(-12deg)}
.experience-phone{position:absolute;left:65%;top:42%;width:182px;height:355px;margin-left:-91px;margin-top:-177px;background:#edf1f5;border-radius:28px;border:5px solid #303e4b;box-shadow:0 0 0 1px #9cacba,0 15px 60px #0008;overflow:hidden;color:#202e3b;opacity:var(--phone);transform:translate3d(calc((1 - var(--phone))*100px),calc((1 - var(--phone))*80px),170px) scale(calc(var(--scene-fit)*.94)) rotateY(calc((1 - var(--phone))*-25deg)) rotateZ(calc((1 - var(--phone))*12deg));will-change:transform,opacity}
.phone-camera{width:47px;height:12px;border-radius:20px;background:#17222d;margin:7px auto 0}.phone-top{display:flex;justify-content:space-between;align-items:center;padding:14px 14px 0}.phone-top img{width:23px;height:auto}.phone-top>span{font-size:10px}.phone-label{display:block;font-size:7px;color:#6e8496;padding:19px 15px 0}.phone-title{font-size:31px;line-height:1.04;letter-spacing:-.055em;padding:9px 15px 0}.phone-title>span{color:#b43838}.phone-art{height:135px;position:relative;margin-top:-8px}.phone-art img{height:160px;width:160px;position:absolute;top:-13px;left:9px;mix-blend-mode:multiply;filter:hue-rotate(285deg) saturate(.62)}.phone-pill{display:flex;align-items:center;justify-content:space-between;margin:-4px 12px 0;border-radius:20px;background:#263c51;color:#e9f0f7;font-size:8px;padding:10px}.phone-pill>span{font-size:15px;color:#ed9690}.phone-home{height:3px;width:50px;background:#384b5c;border-radius:5px;margin:16px auto 0}
.experience-tag{position:absolute;left:22%;bottom:1%;display:flex;align-items:center;gap:8px;border:1px solid #94b6d050;background:#17283be6;padding:12px 18px;border-radius:40px;color:#cbddeb;font-size:11px;opacity:var(--phone);transform:translateY(calc((1 - var(--phone))*20px))}.experience-tag i{height:5px;width:5px;background:#c7ddef;border-radius:50%;box-shadow:0 0 12px #ed969050}
.experience-orbit{position:absolute;width:85%;height:80%;border:1px solid #b6d0e314;left:6%;top:10%;border-radius:50%;transform:rotateX(65deg) rotateZ(-25deg)}.orbit-two{width:110%;height:110%;top:-5%;left:-7%;border-color:#b6d0e30a;transform:rotateX(55deg) rotateZ(25deg)}
.experience-bottom{position:absolute;left:var(--gutter);right:var(--gutter);bottom:31px;display:flex;align-items:center;justify-content:space-between;gap:24px;z-index:5}.experience-hint,.experience-caption{font-size:10px;color:#91a1af;letter-spacing:.015em}.experience-hint{display:flex;align-items:center;gap:20px}.experience-hint>span{font-size:18px;color:#d5e1ec}.experience-caption{text-align:right;font-size:9px}
.experience-steps{display:flex;align-items:center;gap:14px}.experience-steps button{display:flex;align-items:center;gap:9px;padding:12px 0;border:0;background:none;color:#8092a2;font-size:10px;transition:color .2s}.experience-steps button i{display:block;width:36px;height:2px;background:#364d60;transition:background .2s,width .3s}.experience-steps button[aria-current]{color:#ed9690}.experience-steps button[aria-current] i{background:#ed9690;width:65px}
.experience-progress{position:absolute;bottom:0;height:2px;width:100%;background:#ffffff08}.experience-progress>span{display:block;height:100%;width:100%;background:#d7847f;transform:scaleX(var(--progress));transform-origin:left}
.experience:not(.is-animated) .experience-pin{min-height:740px}
.experience:not(.is-animated) .experience-copy{top:140px}
.experience:not(.is-animated) .experience-chapter{position:relative;margin-bottom:24px;opacity:1!important;visibility:visible!important;transform:none!important}
.experience:not(.is-animated) .experience-chapter h3{font-size:30px;line-height:1.15}
.experience:not(.is-animated) .experience-chapter h3 br{display:none}
.experience:not(.is-animated) .experience-chapter h3 em:before{content:' '}
.experience:not(.is-animated) .chapter-kicker{margin-bottom:10px;font-size:10px}
.experience:not(.is-animated) .experience-chapter p{margin-top:9px;font-size:13px}
.experience:not(.is-animated) .experience-steps,.experience:not(.is-animated) .experience-hint,.experience:not(.is-animated) .experience-progress{display:none}
.experience:not(.is-animated) .experience-bottom{justify-content:flex-end}
@media(min-width:1600px){.experience-copy{top:24%}.experience-visual{top:15%;height:72%}}
@media(max-width:1000px){.experience-chapter h3{font-size:clamp(38px,5vw,58px)}.experience-copy{width:43%;top:24%}.experience-chapter p{font-size:13px}.experience-visual{left:44%;width:55%;height:65%;top:23%}.experience-caption{display:none}.experience-steps button i{width:30px}.experience-steps button[aria-current] i{width:50px}}
@media(max-width:700px){
 .experience{--story-header:82px;--scene-fit:.48}.experience.is-animated{height:310svh}
 .experience.is-animated .experience-pin{height:calc(100svh - var(--story-header));height:calc(100dvh - var(--story-header));display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:16px;padding:22px var(--gutter) 20px}
 .experience-topbar{position:relative;top:auto;left:auto;right:auto;gap:12px}.experience-eyebrow{font-size:9px;letter-spacing:.035em;gap:7px;max-width:155px;line-height:1.7}.experience-tools{gap:13px}.experience-tools>a{font-size:10px;gap:8px}.experience-tools>a>span{font-size:14px}.experience-motion{width:28px;height:28px;flex-shrink:0}
 .experience.is-animated .experience-copy{position:relative;top:auto;left:auto;width:100%;display:grid;min-width:0}.experience.is-animated .experience-chapter{position:relative;top:auto;left:auto;grid-area:1/1}.experience-chapter h3{font-size:clamp(36px,8.6vw,54px);line-height:1.04}.experience-chapter h3 br:first-of-type{display:none}.experience-chapter h3 em{display:block}.chapter-kicker{font-size:9px;margin-bottom:13px}.experience-chapter p{font-size:12px;line-height:1.65;margin-top:14px;max-width:310px}.experience-chapter p br{display:none}
 .experience.is-animated .experience-visual{position:relative;left:auto;top:auto;width:100%;height:100%;min-height:0}.experience-device{top:47%}.experience-tag{font-size:8px;padding:8px 12px;bottom:-2%;left:14%}.experience-phone{left:69%}
 .experience.is-animated .experience-bottom{position:relative;left:auto;right:auto;bottom:auto;gap:15px}.experience-hint{font-size:9px;gap:12px;max-width:115px;line-height:1.5}.experience-steps{gap:9px}.experience-steps button{gap:5px;font-size:9px}.experience-steps button i{width:18px}.experience-steps button[aria-current] i{width:34px}
 .experience:not(.is-animated) .experience-pin{min-height:1050px}.experience:not(.is-animated) .experience-copy{top:110px}.experience:not(.is-animated) .experience-chapter{margin-bottom:24px}.experience:not(.is-animated) .experience-chapter h3{font-size:25px}.experience:not(.is-animated) .experience-chapter h3 em{display:inline}.experience:not(.is-animated) .experience-visual{top:660px;height:300px}
}
@media(max-width:380px){.experience-eyebrow{max-width:140px;font-size:8px}.experience-tools>a{font-size:9px}.experience-tools{gap:9px}.experience-chapter h3{font-size:35px}.experience-chapter p{max-width:265px;font-size:11px}.experience-phone{left:59%}}
@media(prefers-reduced-motion:reduce){.experience-film{transform:none}.experience-device,.experience-phone,.experience-layer{will-change:auto}.experience-video{visibility:hidden}}