.site-frame.demo-page-frame:where(.twin-host,.twin-host *){background:#10251e}.demo-host:not(.is-ready):where(.twin-host,.twin-host *){visibility:hidden}.demo-host:not(.is-ready):not(.staff-demo-host)>.demo-intro:where(.twin-host,.twin-host *){visibility:visible}.demo-host:not(.is-ready)>.demo-startup:where(.twin-host,.twin-host *){visibility:visible}.demo-startup:where(.twin-host,.twin-host *){display:grid;grid-template-columns:minmax(340px,36%) minmax(0,1fr);min-height:680px;padding:60px var(--page-edge);gap:32px;background:#10251e;color:#f5faef}.demo-startup-copy:where(.twin-host,.twin-host *){align-self:center;min-width:0}.demo-startup-copy h2:where(.twin-host,.twin-host *){font-size:36px;line-height:1.12;font-weight:500;letter-spacing:0;margin:20px 0}.demo-startup-copy p:where(.twin-host,.twin-host *){font-size:17px;line-height:1.7;color:#bdd0c3}.demo-startup .demo-startup-visual:where(.twin-host,.twin-host *){position:relative;inset:auto;display:block;min-width:0;min-height:560px;padding:0;overflow:hidden}.demo-startup :is(.bv-access-phone,.bv-access-transfer,.bv-transfer-booking):where(.twin-host,.twin-host *){display:none}.demo-startup .bv-booking-deck:where(.twin-host,.twin-host *){position:absolute;inset:0}@media(max-width:1024px){.demo-startup:where(.twin-host,.twin-host *){grid-template-columns:minmax(0,1fr);padding:24px var(--page-edge);gap:24px}.demo-startup-copy:where(.twin-host,.twin-host *){order:1}.demo-startup-copy h2:where(.twin-host,.twin-host *){font-size:28px}.demo-startup .demo-startup-visual:where(.twin-host,.twin-host *){min-height:360px}}@media(max-width:600px){.demo-startup .bv-planner:where(.twin-host,.twin-host *){display:none}}.staff-presentation-frame:where(.twin-host,.twin-host *){position:fixed;inset:0;overflow:hidden}.staff-demo-host>[hidden]:where(.twin-host,.twin-host *),.staff-demo-host>header:where(.twin-host,.twin-host *),.staff-presentation-frame .demo-intro:where(.twin-host,.twin-host *),.staff-presentation-frame .demo-outro:where(.twin-host,.twin-host *){display:none!important}body:not(.staff-demo):not(.staff-manual) .staff-demo-host :is(.story-copy,.story-tools,.story-demo-meta,.story-brand,.app-column):where(.twin-host,.twin-host *){visibility:hidden}body:not(.staff-demo):not(.staff-manual) .staff-demo-host .scroll-story:where(.twin-host,.twin-host *){position:fixed;inset:0;width:100%;height:100dvh;grid-template-columns:minmax(0,1fr)}body:not(.staff-demo):not(.staff-manual) .staff-demo-host .story-visual:where(.twin-host,.twin-host *){position:absolute;inset:0;width:100%;height:100%;grid-area:1/1/-1/-1}.site-intro.demo-intro:where(.twin-host,.twin-host *){padding:clamp(32px,5vw,64px) var(--page-edge) 28px;background:#10251e;color:#f5faef;border-bottom:1px solid #ffffff20}.demo-intro .demo-heading:where(.twin-host,.twin-host *){display:block;max-width:920px}.demo-intro .demo-eyebrow:where(.twin-host,.twin-host *){margin:0 0 16px;color:var(--brand-eyebrow-light)}.site-intro.demo-intro h1:where(.twin-host,.twin-host *){font-size:clamp(32px,4vw,54px);font-weight:500;line-height:1.08;letter-spacing:-.035em;max-width:22ch;margin:0;color:#f5faef;text-wrap:balance}.demo-intro .demo-description:where(.twin-host,.twin-host *){max-width:67ch;margin:18px 0 0;font-size:clamp(16px,1.4vw,18px);line-height:1.6;color:#c9d8c4}.demo-intro .demo-launch:where(.twin-host,.twin-host *){margin-top:18px}.demo-intro .demo-actions:where(.twin-host,.twin-host *),.demo-outro .demo-actions:where(.twin-host,.twin-host *){display:flex;align-items:center;flex-wrap:wrap;gap:12px 20px}.demo-intro .demo-actions button:where(.twin-host,.twin-host *){margin:0;padding:14px 20px;min-height:50px;border:1px solid #ffffff50;border-radius:7px;background:transparent;color:#f5faef;font:500 16px/1.4 Gabarito,sans-serif;cursor:pointer;text-align:left}.demo-intro .demo-actions .site-primary:where(.twin-host,.twin-host *){background:#83b827;color:#10251e;border-color:#83b827}.demo-intro .demo-actions button:hover:not(:disabled):where(.twin-host,.twin-host *){background:#ffffff14}.demo-intro .demo-actions .site-primary:hover:where(.twin-host,.twin-host *){background:#96c943}.demo-intro .demo-actions button:disabled:where(.twin-host,.twin-host *){opacity:.5;cursor:wait}.demo-intro .demo-status:where(.twin-host,.twin-host *){margin:12px 0 0;max-width:none;color:#c9d8c4;font-size:13px}.demo-intro .demo-note:where(.twin-host,.twin-host *){margin:14px 0 0;max-width:none;color:#aab6ad;font-size:12px}.demo-host .demo-intro .demo-actions:where(.twin-host,.twin-host *){display:none}.demo-host .demo-intro .demo-launch:where(.twin-host,.twin-host *){margin-top:8px}body.story-mode .demo-intro+.story-track .scroll-story>.story-brand:where(.twin-host,.twin-host *){visibility:hidden;pointer-events:none}body.story-mode:not(.story-controls) .demo-intro+.story-track .booking-journey.booking-introduction:where(.twin-host,.twin-host *){top:0;bottom:0}.demo-intro+.story-track .booking-introduction .bv-booking-scene:where(.twin-host,.twin-host *){margin-block:0}.site-footer.demo-outro:where(.twin-host,.twin-host *){display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center;min-height:0;padding:var(--page-section-space) var(--page-edge);background:#f5f5f3;border:0}.demo-outro h2:where(.twin-host,.twin-host *){font-size:clamp(28px,3vw,40px);color:#10251e;margin:0 0 18px}.demo-outro p:where(.twin-host,.twin-host *){font-size:17px;line-height:1.6;color:#494949;margin:0;max-width:54ch}.demo-outro .demo-actions:where(.twin-host,.twin-host *){justify-content:flex-end}.demo-outro .demo-actions a:where(.twin-host,.twin-host *){color:#10251e;font:500 16px/1.5 Gabarito,sans-serif;padding-block:12px;text-decoration:underline;text-underline-offset:5px}.demo-outro a:focus-visible:where(.twin-host,.twin-host *){outline-color:#10251e}.story-tools:where(.twin-host,.twin-host *){position:sticky;top:0;grid-column:2;grid-row:1;align-self:start;margin-bottom:calc(-1 * var(--demo-tools-height,120px));z-index:65;width:100%;min-width:0}.demo-intro+.story-track .story-tools:where(.twin-host,.twin-host *){grid-column:1/-1}.story-demo-panel:where(.twin-host,.twin-host *){position:relative;display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:6px 20px;padding:8px 170px 8px 24px;background:#10251e;color:#fff}.demo-intro+.story-track .story-demo-panel:where(.twin-host,.twin-host *){padding-left:var(--page-edge);padding-right:calc(var(--page-edge) + 158px)}.story-demo-routes:where(.twin-host,.twin-host *){display:flex;align-items:stretch;gap:20px;max-width:100%}.story-demo-meta:where(.twin-host,.twin-host *){position:fixed;top:var(--demo-meta-top,0);right:0;display:flex;align-items:center;gap:12px 18px;flex-wrap:wrap;max-width:100%;box-sizing:border-box;padding:8px 24px 8px 16px;background:transparent;z-index:80}body.story-controls .demo-host .story-demo-meta #staff-login:not([hidden]):where(.twin-host,.twin-host *){display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;width:100%;margin:0}.story-demo-meta .header-quality:where(.twin-host,.twin-host *){display:flex;align-items:center;gap:8px;min-height:44px;margin:0;padding:0;border:0;font-size:13px;color:#c9d8c4}.story-demo-meta .header-quality select:where(.twin-host,.twin-host *){min-height:36px;max-width:150px;background:#10251e;color:#f5faef;border:1px solid #58734d;border-radius:5px}.story-demo-meta .staff-demo-option:where(.twin-host,.twin-host *){display:flex;align-items:center;gap:8px;min-height:44px;font-size:14px;color:#f5faef;cursor:pointer}.staff-demo-option input:where(.twin-host,.twin-host *){width:18px;height:18px;accent-color:#a9cf78;margin:0}.staff-demo-option input:focus-visible:where(.twin-host,.twin-host *){outline:2px solid #b9e976;outline-offset:3px}.story-demo-meta .staff-login-btn:where(.twin-host,.twin-host *){min-height:44px;padding:8px 12px;border:1px solid #a9cf78;border-radius:5px;background:#10251e;color:#f5faef;font:500 13px/1.35 Gabarito,sans-serif;letter-spacing:0}.story-demo-meta .staff-panel:where(.twin-host,.twin-host *){position:fixed;top:calc(var(--demo-meta-top,0px) + var(--demo-meta-height,60px) + 10px);right:12px;box-sizing:border-box;max-height:calc(100dvh - var(--demo-meta-top,0px) - var(--demo-meta-height,60px) - 22px);overflow:auto;border-radius:8px}.story-demo-meta>button:where(.twin-host,.twin-host *){min-height:44px;padding:8px 0;border:0;background:#10251e;color:#c9d8c4;font:500 13px/1.35 Gabarito,sans-serif;cursor:pointer}.story-demo-meta>button:focus-visible:where(.twin-host,.twin-host *){outline:2px solid #b9e976;outline-offset:3px}.story-demo-meta [hidden]:where(.twin-host,.twin-host *){display:none}.story-demo-panel a:where(.twin-host,.twin-host *),.story-demo-panel button:where(.twin-host,.twin-host *){min-height:44px;min-width:0;box-sizing:border-box;padding:8px 0;border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;color:#b6c7bc;font:500 14px/1.35 Gabarito,sans-serif;text-align:left;cursor:pointer;white-space:normal;transition:color .15s,border-color .15s;text-decoration:none}.story-demo-panel a:hover:where(.twin-host,.twin-host *),.story-demo-panel button:hover:not(:disabled):where(.twin-host,.twin-host *){background:transparent;color:#f5faef}.story-demo-panel button[aria-pressed=true]:where(.twin-host,.twin-host *){background:transparent;border-bottom-color:#a9cf78;color:#e4f2d4;box-shadow:none}.story-demo-panel a:focus-visible:where(.twin-host,.twin-host *),.story-demo-panel button:focus-visible:where(.twin-host,.twin-host *){outline:2px solid #b9e976;outline-offset:3px}.story-demo-panel button:disabled:where(.twin-host,.twin-host *){opacity:.5;cursor:default}.story-demo-panel [hidden]:where(.twin-host,.twin-host *){display:none}.story-demo-meta .story-demo-close:where(.twin-host,.twin-host *),.story-demo-meta .story-demo-resume:where(.twin-host,.twin-host *){font-size:13px;color:#c9d8c4}.story-demo-meta .story-demo-close:where(.twin-host,.twin-host *){padding:9px 14px;border:1px solid #a9cf78;border-radius:5px;background:#10251e;color:#f5faef;box-shadow:0 4px 16px #0004}body.story-mode .story-visual>main:where(.twin-host,.twin-host *){box-sizing:border-box;padding-top:var(--demo-tools-height,120px)}html:has(body.story-controls):where(:has(.twin-host)){overflow:hidden;overscroll-behavior:none;scrollbar-gutter:auto}body.story-mode.story-controls:where(:has(.twin-host)){height:100dvh;overflow:hidden;overscroll-behavior:none}body.story-controls .story-track>.scroll-story:where(.twin-host,.twin-host *){position:fixed;inset:0;z-index:100;height:100dvh;background:#10251e}body.story-controls .g1-control-hub:where(.twin-host,.twin-host *),body.story-controls .story-demo-close:where(.twin-host,.twin-host *),body.story-controls .story-demo-panel:where(.twin-host,.twin-host *){display:none}body.story-controls .story-tools:where(.twin-host,.twin-host *){display:none}body.story-controls .scroll-story>.app-column:where(.twin-host,.twin-host *){grid-template-rows:auto minmax(0,1fr) auto;padding-top:16px}body.story-controls .app-column>.story-demo-meta:where(.twin-host,.twin-host *){position:relative;inset:auto;align-self:start;justify-content:flex-start;width:100%;max-width:none;padding:0;gap:8px}body.story-controls .story-demo-resume:where(.twin-host,.twin-host *){display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:0;min-height:44px;padding:8px 12px;border:1px solid #a9cf78;border-radius:5px;text-align:left;white-space:normal}body.story-controls .story-demo-meta #staff-login:where(.twin-host,.twin-host *){position:static}body.story-controls .story-demo-meta .staff-panel:where(.twin-host,.twin-host *){position:absolute;top:calc(100% + 8px);left:0;right:auto;width:100%;max-height:var(--staff-panel-height,60dvh)}body.story-controls:not(.staff-demo):not(.staff-manual) .app-column>.story-demo-meta:where(.twin-host,.twin-host *){display:flex;align-items:center;justify-content:flex-start;gap:12px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}body.story-controls:not(.staff-demo):not(.staff-manual) .demo-host .story-demo-meta #staff-login:not([hidden]):where(.twin-host,.twin-host *){display:grid;grid-template-columns:minmax(0,1fr);gap:10px}body.story-controls:not(.staff-demo):not(.staff-manual) .story-demo-meta .staff-login-btn:where(.twin-host,.twin-host *){justify-self:start}body.story-controls:not(.staff-demo):not(.staff-manual) .story-demo-meta .header-quality:where(.twin-host,.twin-host *){justify-content:space-between;width:100%;padding-top:10px;border-top:1px solid #c9dfbf30}body.story-controls:not(.staff-demo):not(.staff-manual) .story-demo-meta #render-quality-status:where(.twin-host,.twin-host *){font-size:12px;line-height:1.4;color:#adbfaa}body.story-controls:not(.staff-demo):not(.staff-manual) .story-demo-meta .story-demo-resume:where(.twin-host,.twin-host *){width:min(100%,380px);min-height:48px;margin:0 auto;padding:12px 20px;border-color:#c9dfbf40;text-align:center}body.story-controls .story-visual>main:where(.twin-host,.twin-host *){padding-top:0}body.loxone-live.story-controls .scroll-story:where(.twin-host,.twin-host *){grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}body.loxone-live.story-controls .scroll-story>.app-column:where(.twin-host,.twin-host *){display:grid!important;position:absolute;inset:16px auto auto 24px;width:min(380px,calc(100% - 48px));height:auto;grid-template-rows:auto;gap:0;padding:0;overflow:visible;background:transparent}body.loxone-live.story-controls .app-column>.phone-slot:where(.twin-host,.twin-host *),body.loxone-live.story-controls .app-disclaimer:where(.twin-host,.twin-host *){display:none}body.story-controls .app-disclaimer:where(.twin-host,.twin-host *){display:block;font-size:14px;line-height:1.5;color:#b6c7bc;margin:12px 0 16px}body.loxone-live.story-controls .view-tools:where(.twin-host,.twin-host *),body.story-controls .view-tools:where(.twin-host,.twin-host *){top:24px;right:24px;justify-content:flex-end}body.loxone-live.story-controls .view-tools:where(.twin-host,.twin-host *){left:24px}.scene-control-hint:where(.twin-host,.twin-host *){position:absolute;inset:0 0 0 var(--story-panel,36%);z-index:40;display:grid;place-items:center;padding:24px;background:rgba(10,24,20,.87);backdrop-filter:blur(4px);overflow:auto;overscroll-behavior:contain;pointer-events:auto;touch-action:pan-y}@media(min-width:1025px),(min-width:601px) and (max-width:1024px) and (max-height:600px){body.story-mode .scene-loading:where(.twin-host,.twin-host *){left:calc((100% + var(--story-panel,36%))/2);width:min(340px,calc(100% - var(--story-panel,36%) - 48px))}body:is(.staff-demo,.loxone-live).story-controls:not(.staff-demo-playing) .scene-loading:where(.twin-host,.twin-host *){left:50%;width:min(340px,calc(100% - 48px))}}.scene-control-hint[hidden]:where(.twin-host,.twin-host *){display:none!important}.scene-control-hint__inner:where(.twin-host,.twin-host *){width:min(100%,860px);text-align:center;color:#f3f7ed;letter-spacing:0}.scene-control-hint__inner h2:where(.twin-host,.twin-host *){font:500 36px/1.15 Gabarito,sans-serif;letter-spacing:0;margin:0 32px 24px}.scene-control-hint button:where(.twin-host,.twin-host *){min-height:44px;border-radius:6px;font:500 15px/1.4 Gabarito,sans-serif;letter-spacing:0;cursor:pointer}.scene-control-hint button:focus-visible:where(.twin-host,.twin-host *){outline:2px solid #d1f98a;outline-offset:4px}.scene-control-hint__close:where(.twin-host,.twin-host *){position:absolute;top:14px;right:14px;width:44px;display:grid;place-items:center;background:transparent;border:0;color:#f3f7ed}.scene-control-hint__close svg:where(.twin-host,.twin-host *){width:24px;height:24px}.scene-control-hint__modes:where(.twin-host,.twin-host *){display:inline-flex;padding:4px;border:1px solid #8aab9566;border-radius:8px;gap:4px}.scene-control-hint__modes button:where(.twin-host,.twin-host *){min-width:110px;padding:8px 20px;background:transparent;color:#cbd7cb;border:0}.scene-control-hint__modes button[aria-pressed=true]:where(.twin-host,.twin-host *){background:#d1f98a;color:#173227}.scene-control-hint__gestures:where(.twin-host,.twin-host *){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:34px 0}.scene-gesture:where(.twin-host,.twin-host *){min-width:0}.scene-gesture h3:where(.twin-host,.twin-host *){font:500 22px/1.2 Gabarito,sans-serif;letter-spacing:0;margin:12px 0 8px}.scene-gesture p:where(.twin-host,.twin-host *){font:400 15px/1.5 Gabarito,sans-serif;color:#c5d6ca;margin:0;min-height:3em;text-wrap:balance}.scene-gesture__stage:where(.twin-host,.twin-host *){position:relative;height:160px;isolation:isolate}.scene-gesture__target:where(.twin-host,.twin-host *){position:absolute;inset:22px 18% 32px;border:1px solid #acd2b84d;background:repeating-linear-gradient(0deg,transparent 0 23px,#acd2b817 24px),repeating-linear-gradient(90deg,transparent 0 23px,#acd2b817 24px);transform:perspective(260px) rotateX(35deg);border-radius:4px}.scene-gesture__direction:where(.twin-host,.twin-host *){position:absolute;top:0;left:calc(50% - 12px);color:#adc9bb}.scene-gesture__direction svg:where(.twin-host,.twin-host *){width:24px;height:24px}.scene-gesture__finger:where(.twin-host,.twin-host *),.scene-gesture__mouse:where(.twin-host,.twin-host *){position:absolute;top:56px;left:calc(50% - 24px);width:48px;height:64px;color:#e1f7c1;filter:drop-shadow(0 6px 6px #0008)}.scene-gesture__finger svg:where(.twin-host,.twin-host *),.scene-gesture__mouse svg:where(.twin-host,.twin-host *){width:48px;height:64px;stroke-width:1.5;fill:#183a2d}.scene-gesture__mouse:where(.twin-host,.twin-host *):after{content:"";position:absolute;top:13px;left:14px;width:8px;height:17px;background:#d1f98a;border-radius:5px 0 0 0}[data-gesture=pan] .scene-gesture__mouse:where(.twin-host,.twin-host *):after{left:26px;border-radius:0 5px 0 0;background:#85d8df}[data-gesture=zoom] .scene-gesture__mouse:where(.twin-host,.twin-host *):after{left:22px;width:4px;height:9px;border-radius:3px;animation:gesture-wheel 2.8s ease-in-out infinite}.scene-gesture__finger:where(.twin-host,.twin-host *){display:none}[data-mode=touch] .scene-gesture__mouse:where(.twin-host,.twin-host *){display:none}[data-mode=touch] .scene-gesture__finger--first:where(.twin-host,.twin-host *),[data-mode=touch] [data-gesture=pan] .scene-gesture__finger--second:where(.twin-host,.twin-host *),[data-mode=touch] [data-gesture=zoom] .scene-gesture__finger--second:where(.twin-host,.twin-host *){display:block}[data-mode=touch] [data-gesture=pan] .scene-gesture__finger--first:where(.twin-host,.twin-host *){margin-left:-18px}[data-mode=touch] [data-gesture=pan] .scene-gesture__finger--second:where(.twin-host,.twin-host *){margin-left:18px;color:#85d8df}.scene-gesture__finger:where(.twin-host,.twin-host *):after{content:"";position:absolute;top:3px;left:15px;width:12px;height:12px;border:2px solid;border-radius:50%;box-shadow:0 0 0 5px #d1f98a18}[data-gesture=rotate] :is(.scene-gesture__mouse,.scene-gesture__finger):where(.twin-host,.twin-host *){animation:gesture-drag 3.6s ease-in-out infinite}[data-gesture=rotate] .scene-gesture__target:where(.twin-host,.twin-host *){animation:gesture-turn 3.6s ease-in-out infinite}[data-gesture=pan] :is(.scene-gesture__mouse,.scene-gesture__finger,.scene-gesture__target):where(.twin-host,.twin-host *){animation:gesture-pan 3.6s ease-in-out infinite}[data-gesture=zoom] .scene-gesture__target:where(.twin-host,.twin-host *){animation:gesture-scale 2.8s ease-in-out infinite}[data-gesture=zoom] .scene-gesture__finger--first:where(.twin-host,.twin-host *){animation:gesture-pinch-left 2.8s ease-in-out infinite}[data-gesture=zoom] .scene-gesture__finger--second:where(.twin-host,.twin-host *){animation:gesture-pinch-right 2.8s ease-in-out infinite;color:#85d8df}.scene-control-hint__start:where(.twin-host,.twin-host *){padding:12px 32px;background:#d1f98a;color:#173227;border:1px solid #d1f98a}.view-tools .scene-control-help:where(.twin-host,.twin-host *){display:none;width:44px;min-height:44px;padding:10px;place-items:center}.scene-control-help svg:where(.twin-host,.twin-host *){width:22px;height:22px}body.story-controls .scene-control-help:where(.twin-host,.twin-host *){display:grid}body.staff-demo-playing .scene-control-hint:where(.twin-host,.twin-host *){display:none}@keyframes gesture-drag{0%,15%,to{transform:translateX(-28px)}50%,65%{transform:translateX(28px)}}@keyframes gesture-turn{0%,15%,to{transform:perspective(260px) rotateX(35deg) rotate(-14deg)}50%,65%{transform:perspective(260px) rotateX(35deg) rotate(14deg)}}@keyframes gesture-pan{0%,15%,to{transform:translate(-15px,10px)}50%,65%{transform:translate(15px,-10px)}}@keyframes gesture-scale{0%,15%,to{transform:scale(.8)}50%,65%{transform:scale(1.15)}}@keyframes gesture-wheel{0%,to{transform:translateY(-3px);opacity:.5}50%{transform:translateY(4px);opacity:1}}@keyframes gesture-pinch-left{0%,15%,to{transform:translateX(-9px)}50%,65%{transform:translateX(-38px)}}@keyframes gesture-pinch-right{0%,15%,to{transform:translateX(9px)}50%,65%{transform:translateX(38px)}}@media(max-width:1024px){.scene-control-hint:where(.twin-host,.twin-host *){inset:0;padding:18px}.scene-control-hint__inner h2:where(.twin-host,.twin-host *){font-size:26px;margin-bottom:14px}.scene-control-hint__gestures:where(.twin-host,.twin-host *){gap:12px;margin:18px 0}.scene-gesture__stage:where(.twin-host,.twin-host *){height:120px}.scene-gesture h3:where(.twin-host,.twin-host *){font-size:18px}.scene-gesture p:where(.twin-host,.twin-host *){font-size:13px}.scene-gesture__target:where(.twin-host,.twin-host *){inset-inline:8%}}@media(max-width:480px){.scene-control-hint:where(.twin-host,.twin-host *){padding:52px 14px 20px}.scene-control-hint__inner h2:where(.twin-host,.twin-host *){font-size:24px;margin-inline:0}.scene-control-hint__gestures:where(.twin-host,.twin-host *){grid-template-columns:1fr;gap:14px}.scene-gesture:where(.twin-host,.twin-host *){display:grid;grid-template-columns:110px minmax(0,1fr);column-gap:16px;text-align:left;align-items:center}.scene-gesture__stage:where(.twin-host,.twin-host *){grid-row:1/3;height:100px}.scene-gesture__finger:where(.twin-host,.twin-host *),.scene-gesture__mouse:where(.twin-host,.twin-host *){top:30px}.scene-gesture h3:where(.twin-host,.twin-host *){align-self:end;margin:0 0 6px}.scene-gesture p:where(.twin-host,.twin-host *){align-self:start;min-height:0;text-wrap:wrap}.scene-gesture__target:where(.twin-host,.twin-host *){inset-block:14px 10px}.scene-control-hint__start:where(.twin-host,.twin-host *){width:100%}}@media(prefers-reduced-motion:reduce){.scene-control-hint :where(.twin-host,.twin-host *),.scene-control-hint :where(.twin-host,.twin-host *):after{animation:none!important}.scene-gesture__finger--first:where(.twin-host,.twin-host *){transform:translateX(-18px)}.scene-gesture__finger--second:where(.twin-host,.twin-host *){transform:translateX(18px)}}.story-copy .story-integrations-note:where(.twin-host,.twin-host *){font-size:13px;line-height:1.6;margin:12px 0}body.staff-demo.story-controls .scroll-story:where(.twin-host,.twin-host *){grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}body.staff-demo-playing.story-controls .scroll-story:where(.twin-host,.twin-host *){--staff-edge:clamp(64px,calc((100vw - var(--page-max-width,1240px))/2),160px);--staff-copy:440px;--staff-gap:32px;--story-panel:min(calc(var(--staff-edge) + var(--staff-copy) + var(--staff-gap)),46%)}body.staff-demo.story-controls .scroll-story:where(.twin-host,.twin-host *):before{display:none}body.staff-demo-playing.story-controls .story-visual:where(.twin-host,.twin-host *):after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#10251ee6 0,#10251edb var(--staff-edge),#10251ecc calc(var(--story-panel) - var(--staff-gap)),#10251e70 calc(var(--story-panel) + 80px),transparent calc(var(--story-panel) + 280px))}body.staff-demo.story-controls .scroll-story>.app-column:where(.twin-host,.twin-host *){display:grid!important;position:absolute;inset:16px auto auto 24px;width:min(380px,calc(100% - 48px));height:auto;grid-template-rows:auto;gap:0;padding:0;overflow:visible;background:transparent}body.staff-demo.story-controls .app-disclaimer:where(.twin-host,.twin-host *),body.staff-demo.story-controls .phone-slot:where(.twin-host,.twin-host *){display:none}body.staff-demo.story-controls .story-visual:where(.twin-host,.twin-host *){position:absolute;grid-area:1/1/-1/-1;inset:0;width:100%;height:100%;min-height:0}body.staff-demo-playing.story-controls .scroll-story>.story-copy:where(.twin-host,.twin-host *){display:flex;flex-direction:column;position:absolute;grid-area:1/1/-1/-1;inset:calc(var(--control-options-height,148px) + 40px) auto var(--staff-gap) 0;z-index:6;width:var(--story-panel);height:auto;min-height:0;box-sizing:border-box;padding:0 var(--staff-gap) 0 var(--staff-edge);overflow-y:auto;overscroll-behavior:contain}body.staff-demo-playing .story-copy>section:not([hidden]):where(.twin-host,.twin-host *){display:block;flex-shrink:0;height:auto!important;min-height:0!important;max-height:none;max-width:none;margin-block:auto;padding:0!important;opacity:1;overflow:visible;background:transparent;border:0;border-radius:0;box-shadow:none;backdrop-filter:none}body.staff-demo-playing .story-copy .story-sticky-copy:where(.twin-host,.twin-host *){position:static!important;inset:auto;transform:none;width:100%;max-width:none;padding:0}body.staff-demo-playing .story-copy h2:where(.twin-host,.twin-host *){font-size:56px;line-height:1.12;letter-spacing:0;margin:20px 0 24px;text-wrap:balance}body.staff-demo-playing .story-copy p:where(.twin-host,.twin-host *){font-size:24px;line-height:1.5;letter-spacing:0;margin-bottom:20px}body.staff-demo-playing .story-copy .story-integrations-note:where(.twin-host,.twin-host *){font-size:16px;line-height:1.5}body.staff-demo-playing .story-copy .story-number:where(.twin-host,.twin-host *){font-size:14px;margin-bottom:0;letter-spacing:0}body.staff-demo-playing .story-copy .story-number:where(.twin-host,.twin-host *):before{display:none}body.staff-demo-playing :is(.intro-actions>button,.story-step-actions>button,.story-choice-actions,.view-tools):where(.twin-host,.twin-host *){display:none!important}body.staff-demo-playing .story-animation-progress:where(.twin-host,.twin-host *){opacity:1;margin:12px 0 0}body.staff-demo-playing .story-animation-progress i:where(.twin-host,.twin-host *){transition:none}body:not(.staff-demo-playing) .staff-only-progress:where(.twin-host,.twin-host *){display:none}body.staff-demo-paused .booking-introduction :where(.twin-host,.twin-host *){animation-play-state:paused!important}body.staff-demo .story-copy :is(p:has(a[href]),a[href],.visit-actions):where(.twin-host,.twin-host *){display:none!important}body.staff-demo .intro-software summary:where(.twin-host,.twin-host *){list-style:none;pointer-events:none;cursor:default}body.staff-demo .intro-software summary:where(.twin-host,.twin-host *)::-webkit-details-marker{display:none}body.staff-demo.story-controls .story-scene-label:where(.twin-host,.twin-host *){display:none}body.staff-demo.story-controls:not(.staff-demo-playing) .view-tools:where(.twin-host,.twin-host *){left:428px}body:is(.staff-demo,.staff-manual).story-controls .scroll-story>.story-demo-meta:where(.twin-host,.twin-host *){position:absolute;inset:20px auto auto 50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 40px);flex-wrap:nowrap;justify-content:center;gap:12px;padding:10px 14px;border:1px solid #c9dfbf40;border-radius:8px;background:#10251ef0;box-shadow:0 8px 28px #0004;backdrop-filter:blur(16px);transition:opacity .2s,visibility .2s}body:is(.staff-demo,.staff-manual).story-controls .demo-host .story-demo-meta #staff-login:not([hidden]):where(.twin-host,.twin-host *){display:contents}body:is(.staff-demo,.staff-manual) .story-demo-meta #render-quality-status:where(.twin-host,.twin-host *){display:none}body:is(.staff-demo,.staff-manual) .story-demo-meta .header-quality:where(.twin-host,.twin-host *){gap:10px;padding-inline:12px;border-inline:1px solid #c9dfbf30}.staff-demo-route:where(.twin-host,.twin-host *){order:-1;width:190px;max-width:100%;height:40px;padding:0 28px 0 10px;border:1px solid #90af7890;border-radius:5px;background:#173522;color:#f5faef;font:500 14px/1.4 Gabarito,sans-serif;cursor:pointer}.staff-demo-route:focus-visible:where(.twin-host,.twin-host *){outline:2px solid #b9e976;outline-offset:2px}body.staff-demo .story-demo-meta .staff-demo-option:where(.twin-host,.twin-host *){gap:10px;white-space:nowrap;padding-right:12px}body.staff-demo .story-demo-meta .staff-demo-option input:where(.twin-host,.twin-host *){appearance:none;position:relative;width:36px;height:22px;border:1px solid #91b978;border-radius:20px;background:#354a3c;flex-shrink:0;cursor:pointer}body.staff-demo .story-demo-meta .staff-demo-option input:checked:where(.twin-host,.twin-host *){background:#b5df87;border-color:#b5df87}body.staff-demo .story-demo-meta .staff-demo-option input:where(.twin-host,.twin-host *):after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#f5faef}body.staff-demo .story-demo-meta .staff-demo-option input:checked:where(.twin-host,.twin-host *):after{left:17px;background:#173522}body:is(.staff-demo,.staff-manual) .story-demo-meta .story-demo-resume:where(.twin-host,.twin-host *){border-color:#c9dfbf40;white-space:nowrap}.staff-playback:where(.twin-host,.twin-host *){display:flex;align-items:center;gap:4px;padding-inline:10px;border-inline:1px solid #c9dfbf30}.staff-playback button:where(.twin-host,.twin-host *){display:grid;place-items:center;width:40px;height:40px;flex-shrink:0;padding:0;border:1px solid transparent;border-radius:5px;background:transparent;color:#e4efd9;cursor:pointer}.staff-playback button:hover:where(.twin-host,.twin-host *){background:#ffffff12;border-color:#c9dfbf40}.staff-playback button:focus-visible:where(.twin-host,.twin-host *){outline:2px solid #b9e976;outline-offset:2px}.staff-playback button[data-staff-action=pause]:where(.twin-host,.twin-host *){background:#b5df87;color:#173522}.staff-slide-count:where(.twin-host,.twin-host *){display:block;width:64px;text-align:center;font-size:13px;line-height:1.4;font-variant-numeric:tabular-nums;color:#bfceb7}body:is(.staff-demo,.staff-manual).story-controls .story-demo-meta .staff-panel:where(.twin-host,.twin-host *){left:auto;right:0;width:min(440px,calc(100vw - 40px));max-height:calc(100dvh - var(--control-options-height,80px) - 40px)}body.staff-manual.story-controls .scroll-story>.app-column:where(.twin-host,.twin-host *){padding-top:calc(var(--control-options-height,80px) + 36px);grid-template-rows:minmax(0,1fr) auto}body.staff-manual.story-controls .view-tools:where(.twin-host,.twin-host *){top:calc(var(--control-options-height,80px) + 36px)}body.staff-demo-playing.story-controls .scroll-story>.story-copy:where(.twin-host,.twin-host *){top:100px}body.staff-demo.staff-controls-hidden .scroll-story>.story-demo-meta:where(.twin-host,.twin-host *){opacity:0;visibility:hidden;pointer-events:none}body.staff-demo.staff-controls-hidden :where(.twin-host,.twin-host *),body.staff-demo.staff-controls-hidden:where(:has(.twin-host)){cursor:none!important}body.staff-demo.staff-controls-hidden .view-tools:where(.twin-host,.twin-host *){opacity:0;visibility:hidden;pointer-events:none}@media(prefers-reduced-motion:reduce){body.staff-demo .scroll-story>.story-demo-meta:where(.twin-host,.twin-host *){transition:none}}@media(min-width:1025px){body.staff-demo-playing.story-controls .booking-journey.booking-introduction:where(.twin-host,.twin-host *){inset:32px 32px 32px calc(var(--story-panel) + 24px)}body.staff-demo-playing .booking-introduction>.bv-player:where(.twin-host,.twin-host *){max-width:1200px;margin-inline:auto}body.staff-demo-playing .booking-introduction.bv-scroll-opening .bv-phone:where(.twin-host,.twin-host *){width:360px}body.staff-demo-playing .booking-introduction.bv-scroll-opening .bv-planner:where(.twin-host,.twin-host *){width:380px}body.staff-demo-playing .visit-annotations>.visit-slide-explanations .visit-slide-explanation:where(.twin-host,.twin-host *){flex-basis:280px;max-width:360px;border-radius:8px}body.staff-demo-playing .visit-annotations .visit-slide-explanation>strong:where(.twin-host,.twin-host *){font-size:18px}body.staff-demo-playing .visit-annotations .visit-slide-explanation>span:where(.twin-host,.twin-host *){font-size:16px}body.staff-demo-playing .visit-booking-progress-labels:where(.twin-host,.twin-host *){font-size:16px}}@media(min-width:1025px) and (max-width:1599px){body.staff-demo-playing .story-software-logos li:where(.twin-host,.twin-host *){height:40px;padding:6px}body.staff-demo-playing .story-software-logos img:where(.twin-host,.twin-host *){height:28px}}@media(min-width:1600px) and (min-height:900px){body.staff-demo-playing.story-controls .scroll-story:where(.twin-host,.twin-host *){--staff-copy:520px}body.staff-demo-playing .story-copy h2:where(.twin-host,.twin-host *){font-size:64px}body.staff-demo-playing .story-copy p:where(.twin-host,.twin-host *){font-size:28px}body.staff-demo-playing .story-copy .story-integrations-note:where(.twin-host,.twin-host *){font-size:18px}body.staff-demo-playing .story-copy .story-number:where(.twin-host,.twin-host *){font-size:16px}}@media(min-width:3000px) and (min-height:1600px){body.staff-demo-playing.story-controls .scroll-story:where(.twin-host,.twin-host *){--staff-edge:320px;--staff-copy:1040px;--staff-gap:64px}body.staff-demo-playing .story-copy h2:where(.twin-host,.twin-host *){font-size:128px;margin:40px 0 48px}body.staff-demo-playing .story-copy p:where(.twin-host,.twin-host *){font-size:56px;margin-bottom:40px}body.staff-demo-playing .story-copy .story-integrations-note:where(.twin-host,.twin-host *){font-size:36px}body.staff-demo-playing .story-copy .story-number:where(.twin-host,.twin-host *){font-size:32px}body.staff-demo-playing .story-software-logos:where(.twin-host,.twin-host *){grid-template-columns:repeat(auto-fit,minmax(min(172px,100%),1fr));gap:16px;margin-top:36px}body.staff-demo-playing .story-software-logos li:where(.twin-host,.twin-host *){height:108px;padding:20px}body.staff-demo-playing .story-software-logos img:where(.twin-host,.twin-host *){height:64px}body.staff-demo-playing .booking-introduction>.bv-player:where(.twin-host,.twin-host *){max-width:2400px}body.staff-demo-playing .booking-introduction.bv-scroll-opening .bv-phone:where(.twin-host,.twin-host *){width:360px;transform:translateY(-50%) rotate(-3deg) scale(2);transform-origin:left center}body.staff-demo-playing .booking-introduction.bv-scroll-opening .bv-planner:where(.twin-host,.twin-host *){width:380px;transform:translateY(-50%) rotate(2deg) scale(2);transform-origin:right center}body.staff-demo-playing .booking-introduction.bv-scroll-opening .bv-access-phone:where(.twin-host,.twin-host *){transform:translateY(-50%) scale(calc(2 * var(--access-phone-scale,1)))}body.staff-demo-playing .visit-annotations>.visit-slide-explanations:where(.twin-host,.twin-host *){gap:24px;max-height:460px!important}body.staff-demo-playing .visit-annotations>.visit-slide-explanations .visit-slide-explanation:where(.twin-host,.twin-host *){flex-basis:420px;max-width:600px;padding:24px 24px 24px 76px;border-radius:8px}body.staff-demo-playing .visit-annotations>.visit-slide-explanations .visit-slide-explanation:where(.twin-host,.twin-host *):before{left:24px;top:24px;width:36px;height:36px;font-size:22px}body.staff-demo-playing .visit-annotations .visit-slide-explanation>strong:where(.twin-host,.twin-host *){font-size:32px;margin-bottom:10px}body.staff-demo-playing .visit-annotations .visit-slide-explanation>span:where(.twin-host,.twin-host *){font-size:26px}body.staff-demo-playing .visit-booking-progress-labels:where(.twin-host,.twin-host *){font-size:28px;top:20px}body.staff-demo-playing .visit-sunset-marker b:where(.twin-host,.twin-host *){font-size:24px;top:-38px}body.staff-demo-playing .visit-booking-progress:where(.twin-host,.twin-host *){height:12px;margin-bottom:72px}}@media(max-width:1024px){body:is(.staff-demo,.staff-manual).story-controls .scroll-story>.story-demo-meta:where(.twin-host,.twin-host *){top:12px;max-width:calc(100% - 24px);flex-wrap:wrap;gap:8px 12px;padding:8px 12px}body:is(.staff-demo,.staff-manual) .story-demo-meta .header-quality:where(.twin-host,.twin-host *){padding-inline:8px;border-right:0}body.staff-demo .story-demo-meta .staff-demo-option:where(.twin-host,.twin-host *){padding-right:0}body.staff-demo .staff-playback:where(.twin-host,.twin-host *){order:-1;justify-content:center;flex-basis:100%;padding:0 0 8px;border:0;border-bottom:1px solid #c9dfbf30}body.staff-demo-playing.story-controls .scroll-story>.story-copy:where(.twin-host,.twin-host *){top:calc(var(--control-options-height,120px) + 28px);bottom:calc(53dvh + 12px);width:100%;padding-inline:16px}body.staff-demo-playing.story-controls .story-visual:where(.twin-host,.twin-host *){inset:47dvh 0 0;height:53dvh}body.staff-demo-playing .story-copy h2:where(.twin-host,.twin-host *){font-size:28px;margin:12px 0 16px}body.staff-demo-playing .story-copy p:where(.twin-host,.twin-host *){font-size:16px;margin-bottom:16px}body.staff-demo-playing.story-controls .story-visual:where(.twin-host,.twin-host *):after{display:none}body.staff-demo.story-controls:not(.staff-demo-playing) .view-tools:where(.twin-host,.twin-host *){left:16px;top:calc(var(--control-options-height,44px) + 32px)}}@media(min-width:601px) and (max-width:1024px) and (max-height:600px){body.staff-demo-playing.story-controls .scroll-story:where(.twin-host,.twin-host *){--story-panel:42%}body.staff-demo-playing.story-controls .scroll-story>.story-copy:where(.twin-host,.twin-host *){width:42%;bottom:16px}body.staff-demo-playing.story-controls .story-visual:where(.twin-host,.twin-host *){inset:0;height:100%}body.staff-demo-playing.story-controls .story-visual:where(.twin-host,.twin-host *):after{display:block;background:linear-gradient(90deg,#10251e,#10251e 36%,transparent 60%)}body.staff-demo-playing.story-controls .booking-journey.booking-introduction:where(.twin-host,.twin-host *){inset:14px 12px 16px calc(42% + 12px)}}.story-copy .story-integrations-note a:where(.twin-host,.twin-host *){display:inline;font-size:inherit;text-decoration:underline;text-underline-offset:3px}.story-copy .story-step-actions:where(.twin-host,.twin-host *){display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px;margin-top:22px}.story-animation-progress:where(.twin-host,.twin-host *){display:block;flex-basis:100%;width:100%;height:8px;margin:8px 0 29px;overflow:hidden;border-radius:999px;background:#294334;opacity:0;transition:opacity .2s ease}.intro-actions:has(.story-continue:disabled) .story-animation-progress:where(.twin-host,.twin-host *),.story-step-actions:has(.story-continue:disabled) .story-animation-progress:where(.twin-host,.twin-host *){opacity:1}.story-animation-progress.is-active:where(.twin-host,.twin-host *){opacity:1}.story-animation-progress i:where(.twin-host,.twin-host *){display:block;width:0;height:100%;border-radius:inherit;background:#d1f98a;transition:width .2s ease-out}.story-copy [data-step=booking] .story-animation-progress:where(.twin-host,.twin-host *),.story-copy [data-step=tennis] .story-animation-progress:where(.twin-host,.twin-host *){display:none}.story-copy .story-step-actions .story-continue:where(.twin-host,.twin-host *){align-self:flex-start;min-height:44px;margin-top:0;padding:12px 16px;border:1px solid #83b827;border-radius:5px;background:#83b827;color:#10251e;font:500 15px/1.4 Gabarito,sans-serif;cursor:pointer}.story-copy .story-step-actions .story-continue:hover:where(.twin-host,.twin-host *){background:#96c943;border-color:#96c943}.intro-actions .story-continue:where(.twin-host,.twin-host *),.intro-actions .story-replay:where(.twin-host,.twin-host *),.story-copy .story-replay:where(.twin-host,.twin-host *),.story-copy .story-step-actions .story-continue:where(.twin-host,.twin-host *){height:50px;min-height:50px;box-sizing:border-box}.intro-actions .story-replay:where(.twin-host,.twin-host *),.story-copy .story-replay:where(.twin-host,.twin-host *){display:inline-flex;align-items:center;min-height:44px;padding:10px 12px;border:1px solid #415b49;border-radius:5px;background:transparent;color:#c5d6bc;font:500 13px/1.4 Gabarito,sans-serif;cursor:pointer}.story-copy .story-replay:hover:where(.twin-host,.twin-host *){color:#e1fdbb}.story-copy .story-replay:disabled:where(.twin-host,.twin-host *){opacity:.45;color:#a8b8a3;cursor:wait}.story-copy .visit-actions [data-visit-action=replay]:where(.twin-host,.twin-host *){display:none}.site-demo-options .demo-page-link:where(.twin-host,.twin-host *){display:block;width:fit-content;min-height:44px;margin-top:16px;font:500 15px/1.5 Gabarito,sans-serif;text-decoration:underline;text-underline-offset:5px}@media(min-width:1025px){body.loxone-live.story-controls .view-tools:where(.twin-host,.twin-host *){left:max(428px,calc(var(--story-panel,36%) + 20px))}body.story-mode:not(.story-controls) .demo-intro+.story-track .story-tools:where(.twin-host,.twin-host *){width:var(--story-panel,36%)}body.story-mode:not(.story-controls) .demo-intro+.story-track .story-demo-panel:where(.twin-host,.twin-host *){padding-left:calc(var(--story-edge,0px) + var(--site-gutter));padding-right:24px}body.story-mode:not(.story-controls) .demo-intro+.story-track .story-visual>main:where(.twin-host,.twin-host *){padding-top:0}}@media(max-width:1024px){.story-tools:where(.twin-host,.twin-host *){grid-column:1}body.story-controls .view-tools:where(.twin-host,.twin-host *){top:10px}body.loxone-live.story-controls .view-tools:where(.twin-host,.twin-host *){top:calc(var(--control-options-height,44px) + 32px)}.demo-intro+.story-track .story-demo-panel:where(.twin-host,.twin-host *){padding:calc(var(--demo-meta-height,60px) + 8px) 12px 10px}body.story-mode:not(.story-controls) .story-visual:where(.twin-host,.twin-host *){height:calc(var(--story-mobile-visual-height,340px) + var(--demo-tools-height,120px))}.story-demo-panel:where(.twin-host,.twin-host *){padding:10px 12px}.story-demo-meta:where(.twin-host,.twin-host *){padding:10px 12px 10px 8px}.story-demo-routes:where(.twin-host,.twin-host *){gap:14px}.story-demo-routes button:where(.twin-host,.twin-host *){padding:8px 0;font-size:13px}.story-copy .story-step-actions button:where(.twin-host,.twin-host *){min-height:44px;padding:12px 16px;font:500 15px/1.4 Gabarito,sans-serif;border:1px solid #ffffff50;border-radius:5px;background:transparent;color:#fff}.story-copy .story-step-actions .story-continue:where(.twin-host,.twin-host *){background:#83b827;color:#10251e;border-color:#83b827}}@media(min-width:601px) and (max-width:1024px) and (max-height:600px){.story-tools:where(.twin-host,.twin-host *){grid-column:2}}@media(max-width:760px){.site-intro.demo-intro:where(.twin-host,.twin-host *){padding-block:32px 24px}.site-footer.demo-outro:where(.twin-host,.twin-host *){grid-template-columns:1fr;gap:24px}.demo-intro .demo-actions:where(.twin-host,.twin-host *){gap:8px}.demo-intro .demo-actions button:where(.twin-host,.twin-host *){padding:10px 12px;font-size:14px;min-height:44px}.demo-outro .demo-actions:where(.twin-host,.twin-host *){justify-content:flex-start}}