*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:#10202a;color:#fff;font-family:Tahoma,Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #77ffdf;outline-offset:5px}#world{position:absolute;width:100%;height:100%;inset:0}.veil{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(4,13,19,.48),transparent 55%,rgba(4,13,19,.42))}header{position:absolute;top:38px;left:5%;right:5%;display:flex;justify-content:space-between;align-items:center;direction:ltr}.brand{color:white;text-decoration:none;letter-spacing:4px;font-size:23px;font-weight:bold}.brand span{font-size:10px;letter-spacing:2px;font-weight:normal;color:#bcc9c9}.chapter{font-size:15px;color:#7ce2c7;direction:rtl}.chapter span{color:#d7dfdf}main{position:absolute;inset:0;pointer-events:none}.intro{position:absolute;right:7%;top:29%;width:32%;pointer-events:auto;animation:copy 2s 3s both}.eyebrow{font-size:14px;color:#84efd0}h1{font-size:clamp(42px,5.4vw,82px);line-height:1.4;font-weight:400;margin:12px 0 20px;letter-spacing:-3px}.intro>p:not(.eyebrow){font-size:16px;line-height:1.8;color:#c3cdce}.legend{display:flex;gap:10px;align-items:center;margin-top:32px;font-size:13px;color:#e1eeea}.legend i{width:6px;height:6px;background:#6aedc2;border-radius:50%}.phone{position:absolute;left:25%;top:50%;width:268px;height:554px;border-radius:43px;background:linear-gradient(115deg,#adb3b6,#2f383f 12%,#869094 85%,#252d30);padding:7px;box-shadow:18px 22px 65px #0009,-2px 0 0 #c5c9c9;transform:translate(-50%,-50%) rotateY(-9deg) rotateZ(-3deg);pointer-events:auto;opacity:0}.phone.ready{animation:arrival 3.5s cubic-bezier(.2,.6,.25,1) both}.screen{position:relative;border:5px solid #080e11;border-radius:37px;height:100%;background:#edf4f2;padding:16px 18px;color:#162d2c;overflow:hidden}.edge{position:absolute;left:-3px;top:100px;width:3px;height:56px;border-radius:2px;background:#adb8ba}.statusbar{display:flex;justify-content:space-between;font-size:10px;font-weight:bold;direction:ltr;margin:0 -2px 24px}.island{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:73px;height:20px;border-radius:20px;background:#080e11}.app-head{display:flex;align-items:center;gap:8px;font-size:14px}.app-logo{font-size:25px}.app-head small{display:block;font-size:8px;letter-spacing:1.1px;color:#69807b;margin-top:4px}.avatar{margin-right:auto;width:25px;height:25px;border-radius:50%;background:#d7e5df;text-align:center;padding-top:6px;font-size:10px}h2{font-size:23px;margin:21px 0 6px;font-weight:normal}.app-sub{font-size:10px;color:#6a807c;margin:0 0 17px}.climate{background:#173d37;color:white;border-radius:17px;padding:13px 15px;position:relative;height:77px}.climate>span{font-size:11px}.climate strong{font-size:34px;font-weight:normal;position:absolute;left:15px;top:14px}.climate small{display:block;font-size:9px;color:#b1d9c8;margin-top:12px}.section-label{font-size:13px;margin:20px 0 10px;display:flex;justify-content:space-between}.section-label>span{font-size:9px;color:#678079}.devices{display:grid;gap:7px}.devices button{border:1px solid #dce8e3;background:#fff;border-radius:13px;display:flex;align-items:center;gap:10px;padding:10px 9px;text-align:right;height:51px;color:#253c37;font-size:12px}.devices small{display:block;font-size:9px;color:#638d7b;margin-top:4px}.icon{font-size:21px;background:#e4f5eb;color:#378464;border-radius:9px;width:30px;height:30px;text-align:center;padding-top:1px}.toggle{width:29px;height:17px;background:#398269;border-radius:15px;margin-right:auto;position:relative}.toggle:after{content:'';position:absolute;width:11px;height:11px;top:3px;right:3px;border-radius:50%;background:white;transition:.25s}.devices button[aria-pressed=false] .toggle{background:#b6c4c0}.devices button[aria-pressed=false] .toggle:after{right:15px}.devices button[aria-pressed=false] .icon{color:#83958e;background:#eef2ef}.all{width:100%;margin-top:11px;border:0;border-radius:10px;padding:9px;background:#dbe9e3;color:#36574b;font-size:10px}.app-bottom{display:flex;justify-content:space-around;margin-top:13px;color:#6b8279;font-size:17px}.app-bottom span:first-child{color:#286d54}.app-bottom small{display:block;font-size:8px;margin-top:3px;text-align:center}.homebar{position:absolute;width:80px;height:4px;border-radius:6px;bottom:6px;left:50%;transform:translateX(-50%);background:#21322b}footer{position:absolute;bottom:26px;left:5%;right:5%;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#c3cfcf}footer button{border:1px solid #ffffff30;background:#13232888;color:#eaf2ef;border-radius:50px;padding:10px 17px;font-size:12px}#loading{position:absolute;inset:0;background:#10202a;display:grid;place-items:center;font-size:16px;transition:opacity .5s}#loading.hidden{opacity:0;pointer-events:none}@keyframes arrival{0%{opacity:1;transform:translate(-100%,85%) scale(.18) rotateZ(19deg) rotateY(65deg)}25%{opacity:1;transform:translate(-95%,20%) scale(.3) rotateZ(12deg) rotateY(30deg)}65%{opacity:1;transform:translate(-50%,-60%) scale(.95) rotateZ(-8deg) rotateY(-15deg)}100%{opacity:1;transform:translate(-50%,-50%) rotateY(-9deg) rotateZ(-3deg)}}@keyframes copy{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(max-width:700px){header{top:22px}.brand{font-size:18px}.brand span{display:none}.chapter{font-size:12px}.intro{top:13%;right:7%;width:86%;animation-delay:2s}.intro h1{font-size:32px;line-height:1.2;letter-spacing:-1px;margin:8px 0}.intro h1 br{display:none}.intro>p:not(.eyebrow){font-size:12px;margin:8px 0}.eyebrow{font-size:11px;margin:0}.legend{display:none}.phone{left:50%;top:61%;width:242px;height:502px}.screen{padding:13px 15px}.statusbar{margin-bottom:18px}h2{margin-top:14px;font-size:21px}.app-sub{margin-bottom:12px}.climate{height:68px}.section-label{margin-top:13px}.devices button{height:46px}.all{padding:7px}.app-bottom{margin-top:8px}footer{bottom:12px;font-size:10px}footer>span:first-child{display:none}.hint{font-size:10px}footer button{font-size:10px;padding:8px 10px}}@media(max-height:740px) and (min-width:701px){.phone{transform:translate(-50%,-50%) scale(.86)}.phone.ready{animation:arrival 3.5s both;zoom:.86;top:58%;left:29%}}@media(prefers-reduced-motion:reduce){.phone.ready{animation:none;opacity:1}.intro{animation:none}}

.chapter{direction:ltr}.intro{text-align:left;right:6%;width:36%}.eyebrow{font-size:11px;letter-spacing:2px}h1{font-family:Arial,sans-serif;font-weight:500;line-height:1.05;letter-spacing:-3px}.screen{direction:ltr}.avatar{margin-right:0;margin-left:auto}.climate strong{left:auto;right:15px}.devices button{text-align:left}.toggle{margin-right:0;margin-left:auto}.app-head small{font-size:8px}.app-sub{font-size:10px}.legend{font-size:12px}@media(max-width:700px){.intro{right:7%;width:86%}.eyebrow{font-size:9px}h1{font-size:32px;letter-spacing:-1px}}

.adt-brand{display:block;width:138px;height:58px;background:white;border-radius:5px;overflow:hidden}.brand .logo-frame{display:block;width:100%;height:100%;position:relative}.logo-frame img{position:absolute;width:152px;height:152px;max-width:none;left:-7px;top:-48px;object-fit:contain}@media(max-width:700px){.adt-brand{width:112px;height:47px}.brand .logo-frame{display:block}.logo-frame img{width:124px;height:124px;left:-6px;top:-39px}}

html{height:auto;overflow-x:hidden;overflow-y:auto;scroll-behavior:smooth}body{height:220vh;overflow:visible}#world,.veil,header,main,footer{position:fixed}main{height:100vh}.adt-brand{background:transparent;width:152px;height:64px;border-radius:0}.logo-frame img{width:166px;height:166px;left:-7px;top:-50px}.brand .logo-frame{display:block}.home-panel{display:block}.door-panel{display:none}.at-entrance .home-panel{display:none}.at-entrance .door-panel{display:block}.intro{animation:none;transition:opacity .4s}.phone{z-index:3}.door-head{display:flex;justify-content:space-between;font-size:10px;color:#54776b;letter-spacing:1px;margin-top:5px}.live-tag{font-size:8px;background:#d2eade;border-radius:4px;padding:3px 5px;color:#297057}.door-panel h2{font-size:22px;margin-top:18px}.door-panel #call-status{font-size:10px;color:#53726c;min-height:24px;line-height:1.4}.camera-view{width:100%;aspect-ratio:1.08;overflow:hidden;border-radius:14px;background:#466679;position:relative}.camera-view canvas{width:100%;height:100%;display:block}.camera-view:after{content:'FRONT DOOR';position:absolute;bottom:8px;left:8px;font-size:8px;color:white;background:#142f3d88;padding:4px 6px;border-radius:3px}.visitor-label{margin:14px 0}.visitor-label strong{font-size:12px;font-weight:normal}.visitor-label small{display:block;font-size:9px;color:#69817a;margin-top:5px}.call-actions{display:flex;justify-content:space-between;padding:4px 3px 18px}.call-actions button{width:42px;height:42px;border-radius:50%;border:0;background:#dcece7;color:#2d725c;font-size:22px;position:relative}.call-actions button small{position:absolute;top:47px;left:50%;transform:translateX(-50%);font-size:9px;color:#567369}.call-actions #decline{background:#ed626d;color:white}.call-actions #answer{background:#369b78;color:white}.call-actions button:disabled{opacity:.5}.ring-again{width:100%;border:0;border-radius:9px;background:#e0ebe6;color:#436a5b;padding:9px;margin-top:15px;font-size:10px}.ringing #answer{animation:ring-pulse 1.3s infinite}@keyframes ring-pulse{50%{box-shadow:0 0 0 7px #359b7825}}#scroll-next{position:fixed;bottom:78px;left:50%;transform:translateX(-50%);border:0;background:#122b3480;border-radius:20px;color:#e4f2f0;padding:10px 16px;font-size:9px;letter-spacing:2px;z-index:5}#scroll-next span{display:block;font-size:19px;margin-top:6px}#scroll-next.hidden{opacity:0;pointer-events:none}.at-entrance .veil{background:linear-gradient(90deg,#0c28333d,transparent 55%,#0c283375)}.at-entrance footer>span:first-child{font-size:0}.at-entrance footer>span:first-child:after{content:'INTERACTIVE EXPERIENCE · CHAPTER 02';font-size:12px}@media(max-width:700px){.adt-brand{width:122px;height:50px}.logo-frame img{width:134px;height:134px;left:-6px;top:-40px}#scroll-next{bottom:48px;font-size:8px;padding:7px 12px}.door-panel h2{margin-top:12px;font-size:21px}.visitor-label{margin:10px 0}.ring-again{margin-top:11px;padding:7px}.camera-view{max-height:177px}.at-entrance .intro h1{font-size:28px}.at-entrance .intro h1 br{display:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ringing #answer{animation:none}}

body{height:400vh}.gate-panel{display:none}.at-gate .door-panel,.at-gate .home-panel{display:none}.at-gate .gate-panel{display:block}.gate-sub{font-size:10px;color:#58766d;line-height:1.6;margin-bottom:20px}.gate-visual{background:#173d37;border-radius:18px;padding:22px 14px;text-align:center;color:#e0f4ed;margin:18px 0}.gate-icon{font-size:65px;color:#7de5c2;display:block;transition:letter-spacing .2s}.gate-visual strong{font-size:16px;font-weight:normal;display:block;margin:10px 0 7px}.gate-visual small{font-size:9px;color:#a3c9bd}.gate-control{width:100%;background:#32866a;color:white;border:0;padding:13px;border-radius:12px;font-size:13px}.gate-panel #gate-feedback{font-size:10px;line-height:1.6;color:#57796b;min-height:33px;margin-top:13px}.gate-source{display:flex;justify-content:space-between;font-size:10px;border-top:1px solid #d4e3dc;padding:13px 0}.gate-source span{color:#6b837a}.gate-source strong{font-weight:normal}.at-gate footer>span:first-child:after{content:'INTERACTIVE EXPERIENCE · CHAPTER 03'}.at-gate .intro h1{font-size:clamp(40px,5.3vw,78px)}@media(max-width:700px){.at-gate .intro h1{font-size:30px}.gate-visual{padding:15px 12px;margin:12px 0}.gate-icon{font-size:53px}.gate-sub{margin-bottom:13px}}

@media(max-width:700px){.gate-panel .gate-visual{padding:10px 12px;margin:10px 0}.gate-panel #gate-feedback{margin:9px 0;min-height:27px}.gate-panel .gate-source{padding:9px 0}.gate-panel .ring-again{margin-top:4px}}

@media(max-width:700px){.phone{zoom:.72;left:69.45%;top:94.45%;width:242px;height:502px}.intro{top:12%;}.intro h1,.at-gate .intro h1{font-size:28px}.at-entrance .intro h1{font-size:25px}#scroll-next{left:auto;right:5%;bottom:105px;transform:none;max-width:120px;font-size:7px;letter-spacing:1px;background:#122b3499}.phone.ready{animation-name:arrival}.veil{background:linear-gradient(180deg,#04131b80,transparent 40%,#04131b30)}}
@media(max-width:700px) and (max-height:720px){.phone{zoom:.64;left:78.125%;top:106.25%}.intro{top:13%}.intro>p:not(.eyebrow){font-size:11px}.intro h1,.at-gate .intro h1{font-size:25px}}

.phone-dock{display:contents}@media(max-width:700px){.phone-dock{display:block;position:fixed;left:50%;top:68%;width:242px;height:502px;transform:translate(-50%,-50%) scale(.72);transform-origin:center;pointer-events:none}.phone{zoom:1;left:50%;top:50%;width:242px;height:502px}.phone.ready{zoom:1}}@media(max-width:700px) and (max-height:720px){.phone-dock{top:68%;transform:translate(-50%,-50%) scale(.64)}.phone{zoom:1;left:50%;top:50%}}

@media(max-width:700px){.at-entrance .phone-dock{top:31%;left:75%;transform:translate(-50%,-50%) scale(.54)}.at-entrance .intro{top:13%;right:auto;left:5%;width:40%}.at-entrance .intro h1,.at-gate .intro h1{font-size:23px;line-height:1.18}.at-entrance .intro h1 br{display:block}.at-entrance .intro .eyebrow{font-size:8px;line-height:1.6;letter-spacing:1px}.at-entrance .intro>p:not(.eyebrow){font-size:11px;line-height:1.6}.at-entrance .phone-dock{transition:top .55s ease,left .55s ease,transform .55s ease}.at-entrance footer .hint{font-size:9px}.at-gate .intro h1 br{display:block}}
@media(max-width:700px) and (max-height:720px){.at-entrance .phone-dock{top:32%;left:75%;transform:translate(-50%,-50%) scale(.48)}.at-entrance .intro h1,.at-gate .intro h1{font-size:21px}}