
:root{--ink:#142039;--muted:#687081;--gold:#c7a76c;--paper:#f9f7f1;--line:#e7e4de;--dark:#101a2a}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Manrope,Arial,sans-serif;background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased}button,a{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid #c9ab71;outline-offset:3px}.site-shell{overflow:hidden}.header{height:84px;max-width:1440px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:0 6vw}.brand{display:flex;align-items:center;gap:11px;font-size:18px;font-weight:800;letter-spacing:-.7px}.brand small{font-size:14px;font-weight:600;color:#8f826e}.brand-mark{background:var(--ink);color:white;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;font-weight:800;font-size:22px}.head-right{display:flex;align-items:center;gap:24px}.head-note{font-size:12px;color:#656d7a}.live-dot{display:inline-block;width:7px;height:7px;background:#6db69c;border-radius:50%;margin-right:7px;box-shadow:0 0 0 4px #6db69c22}.head-contact{font-size:13px;font-weight:800;border-bottom:1px solid var(--gold);padding:8px 0}.head-contact span{color:var(--gold)}.intro{max-width:1440px;margin:0 auto;display:grid;grid-template-columns:1.02fr 1fr;min-height:630px;padding:0 6vw 65px}.intro-art{grid-column:2;grid-row:1;position:relative;overflow:hidden;border-radius:12px;min-height:590px}.intro-art img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;animation:heroDrift 18s ease-in-out infinite alternate}.intro-art-shade{position:absolute;inset:0;background:linear-gradient(180deg,#0007,transparent 23%,transparent 70%,#0007)}.top-art-label{position:absolute;top:28px;left:25px;color:#fff;font-size:11px;letter-spacing:2.1px;font-weight:800}.intro-photo-caption{position:absolute;bottom:28px;left:28px;color:#fff;font-size:13px}.intro-pulse{display:inline-block;width:8px;height:8px;background:#b9e2c7;border-radius:50%;margin-right:8px}.intro-text{grid-column:1;grid-row:1;display:flex;flex-direction:column;justify-content:center;padding:30px 10% 20px 0}.eyebrow,.section-eyebrow{font-size:11px;color:#a78b59;letter-spacing:2.2px;font-weight:800}.eyebrow-line{width:24px;height:1px;background:var(--gold);display:inline-block;vertical-align:middle;margin-right:8px}.intro h1{font-size:clamp(39px,4.25vw,70px);line-height:1.13;letter-spacing:-3.2px;margin:32px 0 24px;font-weight:800}.intro h1 em,.section-top h2 em,.after-copy h2 em,.products-heading h2 em,.final-cta h2 em{font-style:normal;color:#b69a6b}.intro p{font-size:15px;line-height:1.95;color:var(--muted);max-width:485px}.intro-actions{display:flex;align-items:center;gap:25px;flex-wrap:wrap;margin-top:25px}.btn{border:0;display:inline-flex;align-items:center;justify-content:center;gap:42px;border-radius:6px;padding:19px 23px;font-size:13px;font-weight:800;transition:transform .25s,background .25s}.btn:hover{transform:translateY(-3px)}.btn-dark{background:var(--ink);color:#fff}.btn-dark:hover{background:#283c5c}.btn span{font-size:20px;font-weight:400}.intro-time{font-size:12px;color:#84888e}.scroll-helper{margin-top:80px;font-size:11px;color:#8c9096;display:flex;gap:18px;align-items:center}.scroll-helper span{font-size:20px;color:#a99270;animation:point 1.8s ease-in-out infinite}.experience{background:#fff;padding:105px max(6vw,calc((100vw - 1267px)/2)) 110px}.section-top{display:flex;justify-content:space-between;align-items:flex-end;gap:20px}.section-top h2,.after-copy h2,.products-heading h2{font-size:clamp(30px,3.7vw,53px);letter-spacing:-2.2px;line-height:1.2;margin:20px 0}.section-top p,.products-heading p{max-width:620px;color:var(--muted);line-height:1.75;font-size:14px}.experience-total{display:flex;align-items:center;gap:14px;flex-shrink:0;padding-bottom:14px}.experience-total strong{font-size:54px;color:#bca274;font-weight:500;line-height:1}.experience-total span{font-size:11px;line-height:1.6;color:#777b84}.chapter-strip{display:flex;gap:9px;overflow-x:auto;padding:34px 0 28px;scrollbar-width:none}.chapter-strip::-webkit-scrollbar{display:none}.chapter-tab{border:1px solid #e8e5de;border-radius:999px;background:#fff;padding:11px 17px;white-space:nowrap;font-size:12px;font-weight:700;color:#6c7480;transition:all .3s}.chapter-tab span{color:#b79d70;margin-right:8px}.chapter-tab.active,.chapter-tab:hover{background:var(--ink);border-color:var(--ink);color:#fff}.story-layout{display:grid;grid-template-columns:minmax(0,1.27fr) minmax(330px,.83fr);gap:45px;align-items:start}.story-visual{min-width:0}.scene{position:relative;overflow:hidden;border-radius:9px;aspect-ratio:1.14/1;background:#222b39;isolation:isolate;touch-action:pan-y}.scene-layer{position:absolute;inset:0;background-position:center;background-size:cover}.scene-prev{opacity:0}.scene-current{opacity:1;transition:opacity .85s cubic-bezier(.2,.7,.2,1),transform 5s ease;transform:scale(1.025)}.scene.is-changing .scene-current{opacity:0}.scene-tint{position:absolute;inset:0;background:linear-gradient(180deg,#07111c70,transparent 30%,transparent 42%,#081321b8);pointer-events:none}.scene-topline{position:absolute;top:25px;left:26px;right:26px;display:flex;justify-content:space-between;align-items:center;gap:12px;color:#fff;font-size:10px;font-weight:800;letter-spacing:1.1px}.scene-demo{background:#ffffff30;border:1px solid #ffffff55;padding:7px 10px;border-radius:99px;backdrop-filter:blur(10px);font-size:9px}.scene-caption{position:absolute;bottom:53px;left:30px;right:30px;color:#fff}.scene-event{font-size:12px;color:#f1d6a6;margin-bottom:6px;font-weight:700}.scene-caption strong{font-size:clamp(25px,3vw,43px);letter-spacing:-1.5px;line-height:1.25;display:block}.scene-caption p{font-size:12px;color:#ffffffe5;line-height:1.65;max-width:420px}.scene-bottom-rail{position:absolute;bottom:22px;left:30px;right:30px;display:flex;align-items:center;gap:18px}.progress-bars{display:flex;gap:7px;flex:1}.progress-bar{display:block;flex:1;height:3px;background:#ffffff60;border-radius:3px;cursor:pointer;transition:background .3s}.progress-bar.filled{background:#e3c491}.scene-count{color:#fff;font-size:10px;letter-spacing:1px}.scene-center-tip{position:absolute;top:47%;left:50%;transform:translate(-50%,-50%);background:#101a2abf;color:white;font-size:12px;padding:11px 16px;border:1px solid #ffffff40;border-radius:30px;white-space:nowrap;transition:opacity .4s;pointer-events:none}.scene-center-tip.hidden{opacity:0}.scene-controls{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:20px}.round-arrow{width:46px;height:46px;border:1px solid #e2e1dd;background:#fff;border-radius:50%;font-size:19px;transition:background .2s}.round-arrow:hover{background:#ece7db}.play-scenario{min-width:220px;border:0;background:var(--ink);color:#fff;border-radius:99px;padding:16px 24px;font-size:12px;font-weight:800;display:flex;gap:14px;align-items:center;justify-content:center;transition:background .2s,transform .2s}.play-scenario:hover{background:#304566;transform:translateY(-1px)}.play-symbol{font-size:12px;color:#dcc292}.gesture-hint{text-align:center;font-size:10px;color:#a2a3a5;margin-top:14px}.story-content{padding:8px 0}.story-index{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:11px;letter-spacing:1.1px;font-weight:800;color:#b29b72}.story-index span:last-child{color:#969aa1;font-size:10px}.story-content h3{font-size:clamp(31px,3.15vw,47px);line-height:1.16;letter-spacing:-1.9px;margin:29px 0 17px}.story-lead{font-size:14px;line-height:1.85;color:#6e7480;max-width:400px}.story-timeline{margin-top:28px;border-top:1px solid #ece9e3}.timeline-item{display:flex;gap:17px;align-items:flex-start;width:100%;text-align:left;border:0;border-bottom:1px solid #ece9e3;background:#fff;padding:18px 7px 18px 0;transition:opacity .2s}.timeline-item .timeline-number{width:34px;height:34px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;font-size:10px;color:#b49b73;border:1px solid #e7dcc7}.timeline-item.active .timeline-number{background:#c4a870;color:#fff;border-color:#c4a870}.timeline-item b{display:block;font-size:13px;margin:0 0 7px;letter-spacing:-.2px}.timeline-item small{display:block;font-size:11px;line-height:1.65;color:#89909a;font-weight:500}.timeline-item:not(.active){opacity:.76}.timeline-item:hover{opacity:1}.reaction{display:flex;gap:13px;align-items:flex-start;margin-top:22px;padding:17px 18px;background:#f9f7f1;border-radius:6px}.reaction-spark{color:#b39865;font-size:23px;line-height:1}.reaction small{font-size:9px;font-weight:800;letter-spacing:1.3px;color:#ac9365}.reaction p{font-size:12px;line-height:1.7;color:#586273;margin:5px 0 0}.next-story{margin-top:24px;width:100%;border:0;background:transparent;padding:0;display:flex;align-items:center;justify-content:space-between;text-align:left}.next-story small{display:block;font-size:9px;letter-spacing:1.3px;font-weight:800;color:#ae9770;margin-bottom:7px}.next-story b{font-size:13px}.next-story-arrow{height:42px;width:42px;border:1px solid #e3ded5;border-radius:50%;display:grid;place-items:center;font-size:19px}.after-stories{max-width:1440px;margin:auto;padding:130px 6vw;display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}.after-copy h2{margin:25px 0;font-size:clamp(34px,3.5vw,52px)}.after-copy p{font-size:14px;line-height:1.95;color:#6f7781;max-width:500px}.benefits{display:flex;flex-direction:column;gap:15px;margin-top:33px;font-size:13px;font-weight:700}.benefits span{color:#334154}.after-image{min-height:480px;border-radius:9px;position:relative;overflow:hidden}.after-image img{position:absolute;width:100%;height:100%;object-fit:cover;inset:0}.after-sticker{position:absolute;left:25px;bottom:24px;background:#fffcf6ed;padding:16px 22px;color:#777;font-size:10px;letter-spacing:1.4px;line-height:2;border-radius:3px}.after-sticker b{font-size:14px;color:var(--ink);letter-spacing:.4px}.products-section{background:#efeee9;padding:90px max(6vw,calc((100vw - 1267px)/2)) 105px}.products-heading{display:flex;align-items:end;justify-content:space-between;gap:20px}.products-heading h2{margin:15px 0}.equipment-scenario{border:1px solid #d4c9b5;color:#967b51;border-radius:99px;padding:12px 18px;font-size:11px;font-weight:800;white-space:nowrap}.product-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:27px}.product-card{background:white;border:1px solid #e2dfd8;border-radius:8px;padding:15px 13px 17px;min-width:0;transition:transform .25s}.product-card:hover{transform:translateY(-5px)}.product-photo{height:150px;display:grid;place-items:center}.product-photo img{max-height:140px;max-width:100%;object-fit:contain}.product-card b{font-size:11px;line-height:1.5;display:block;min-height:34px}.product-card p{font-size:10px;color:#8d9298;line-height:1.5;margin-bottom:0}.product-footnote{font-size:11px;color:#949699;margin-top:19px}.final-cta{background:#172338;min-height:540px;position:relative;overflow:hidden;color:#fff;display:flex;align-items:center;justify-content:center;padding:90px 22px;text-align:center}.cta-body{position:relative;z-index:2;max-width:770px}.cta-mini{font-size:11px;font-weight:800;letter-spacing:2.6px;color:#d0b482}.final-cta h2{font-size:clamp(43px,5.2vw,76px);line-height:1.12;letter-spacing:-3px;margin:26px 0}.final-cta h2 em{color:#d5b883}.final-cta p{max-width:580px;margin:0 auto;color:#bec6d0;font-size:14px;line-height:1.9}.cta-buttons{display:flex;justify-content:center;align-items:center;gap:24px;margin-top:31px;flex-wrap:wrap}.btn-gold{background:#d0b57f;color:#182235}.btn-gold:hover{background:#e5cb98}.cta-secondary{font-size:13px;text-decoration:underline;text-underline-offset:5px}.cta-bottom{font-size:11px;letter-spacing:1px;margin-top:37px;color:#8693a6}.cta-orbit{position:absolute;border:1px solid #b3a6a122;border-radius:50%;width:800px;height:800px}.cta-orbit.one{left:-460px;top:-350px}.cta-orbit.two{right:-470px;bottom:-530px}footer{background:#101a2a;color:#b0b5bd;display:flex;justify-content:space-between;align-items:center;padding:35px 6vw;gap:20px;font-size:11px}footer a{color:#fff}.foot-brand{color:#fff;font-size:16px;font-weight:800}.foot-brand span{font-weight:400;color:#b99e72}@keyframes heroDrift{from{transform:scale(1)}to{transform:scale(1.075)}}@keyframes point{50%{transform:translateY(7px)}}@media(max-width:1050px){.intro{grid-template-columns:1fr 1fr}.intro h1{letter-spacing:-2px}.story-layout{gap:23px;grid-template-columns:1.1fr 1fr}.story-content h3{font-size:35px}.product-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}@media(max-width:760px){.header{height:66px;padding:0 20px}.brand{font-size:15px}.brand-mark{width:29px;height:29px;font-size:19px}.head-note{display:none}.head-contact{font-size:11px}.intro{display:flex;flex-direction:column;padding:0 18px 65px;min-height:0}.intro-art{order:0;min-height:310px;border-radius:8px}.intro-art img{object-position:center}.intro-text{order:1;padding:27px 3px 0}.intro h1{font-size:clamp(34px,8.8vw,53px);letter-spacing:-2.2px;margin:19px 0 15px}.intro p{font-size:13px;line-height:1.8}.intro-actions{margin-top:15px;gap:14px}.intro-time{font-size:10px}.btn{padding:16px 17px;gap:19px}.scroll-helper{margin-top:36px}.experience{padding:65px 17px 70px}.section-top h2,.after-copy h2,.products-heading h2{letter-spacing:-1.4px}.section-top p{font-size:12px}.experience-total{display:none}.chapter-strip{margin-right:-17px;padding:20px 17px 21px 0}.chapter-tab{padding:11px 13px;font-size:11px}.story-layout{display:flex;flex-direction:column;gap:27px}.story-visual,.story-content{width:100%}.scene{aspect-ratio:1/1.08}.scene-caption{left:21px;right:21px;bottom:45px}.scene-caption strong{font-size:32px}.scene-caption p{font-size:11px}.scene-topline{top:20px;left:19px;right:19px;font-size:9px}.scene-bottom-rail{left:21px;right:21px;bottom:19px}.story-content{padding:0 2px}.story-content h3{font-size:35px;margin:17px 0 9px}.story-lead{font-size:12px}.timeline-item{padding:14px 5px 14px 0}.reaction{margin-top:18px}.gesture-hint{font-size:9px}.after-stories{display:flex;flex-direction:column;padding:70px 19px;gap:32px;align-items:stretch}.after-copy p{font-size:12px}.benefits{font-size:12px}.after-image{min-height:360px}.products-section{padding:65px 18px}.products-heading{align-items:start;flex-direction:column}.products-heading p{font-size:12px}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.product-photo{height:130px}.product-card{padding:13px}.product-photo img{max-height:115px}.final-cta{padding:75px 20px;min-height:500px}.final-cta h2{letter-spacing:-1.8px}.final-cta p{font-size:12px}footer{flex-wrap:wrap;padding:25px 19px}footer>span:nth-child(2){display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition-duration:.01ms!important}}

/* interactive scene upgrade */
.interaction-copy{margin-top:20px;padding:18px 18px 16px;border:1px solid #ece5d8;border-radius:8px;background:linear-gradient(180deg,#fffcf7,#f8f5ee)}
.interaction-badge{display:inline-flex;align-items:center;gap:8px;font-size:10px;font-weight:800;letter-spacing:1.2px;color:#a6844f}
.interaction-badge::before{content:'';width:8px;height:8px;border-radius:50%;background:#c6a873;box-shadow:0 0 0 6px rgba(198,168,115,.15)}
.interaction-copy p{margin:10px 0 0;font-size:12px;line-height:1.7;color:#666f7c}
.hotspot-layer{position:absolute;inset:0;z-index:3}
.hotspot{position:absolute;transform:translate(-50%,-50%);border:0;background:transparent;color:#fff;padding:0;display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer;min-width:56px}
.hotspot-pulse{position:absolute;top:18px;left:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;background:rgba(227,196,145,.16);border:1px solid rgba(255,255,255,.34);backdrop-filter:blur(6px);animation:hotspotPulse 2.1s infinite}
.hotspot-core{position:relative;z-index:2;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(18,29,48,.86);border:1px solid rgba(255,255,255,.42);box-shadow:0 10px 25px rgba(0,0,0,.22);font-size:14px;transition:transform .2s ease,background .2s ease,border-color .2s ease}
.hotspot-label{position:relative;z-index:2;font-size:10px;font-weight:800;letter-spacing:.3px;padding:6px 9px;border-radius:999px;background:rgba(10,18,31,.58);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(8px);white-space:nowrap;max-width:110px;overflow:hidden;text-overflow:ellipsis}
.hotspot:hover .hotspot-core,.hotspot.is-active .hotspot-core{transform:scale(1.08);background:rgba(206,175,120,.96);color:#182235;border-color:rgba(255,255,255,.9)}
.hotspot.is-linked .hotspot-pulse{background:rgba(214,184,128,.28)}
.hotspot.is-active .hotspot-pulse{width:52px;height:52px}
.scene-hotspot-card{position:absolute;top:65px;right:24px;z-index:3;max-width:240px;background:rgba(249,247,241,.92);color:#1a2739;padding:15px 16px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.55);box-shadow:0 18px 45px rgba(4,15,29,.20);backdrop-filter:blur(10px)}
.scene-hotspot-top{font-size:10px;letter-spacing:1.3px;font-weight:800;color:#aa8852;text-transform:uppercase}
.scene-hotspot-card strong{display:block;margin-top:5px;font-size:14px;line-height:1.45;letter-spacing:-.2px}
.scene-hotspot-card p{margin:7px 0 0;font-size:11px;line-height:1.55;color:#57606d}
.device-dock{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:17px}
.device-chip{border:1px solid #e2ddd3;background:#fff;border-radius:18px;padding:10px 12px;display:flex;align-items:center;gap:10px;text-align:left;min-width:0;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.device-chip:hover{transform:translateY(-1px);border-color:#d2bc92}
.device-chip.active{border-color:#ccae76;box-shadow:0 8px 24px rgba(204,174,118,.16);background:#fffdf8}
.device-chip-icon{flex:0 0 34px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#1e2b3f;color:#dfc18d;font-size:14px}
.device-chip b{display:block;font-size:11px;line-height:1.35;color:#1a2739}
.device-chip small{display:block;margin-top:2px;font-size:10px;color:#8e939a;line-height:1.3}
@keyframes hotspotPulse{0%{transform:translate(-50%,-50%) scale(.92);opacity:.72}70%{transform:translate(-50%,-50%) scale(1.08);opacity:1}100%{transform:translate(-50%,-50%) scale(.92);opacity:.72}}
@media(max-width:760px){
  .scene-hotspot-card{left:16px;right:16px;top:auto;bottom:95px;max-width:none;padding:13px 14px;border-radius:12px}
  .hotspot-label{font-size:9px;padding:5px 7px;max-width:90px}
  .hotspot-pulse{width:38px;height:38px}
  .hotspot-core{width:30px;height:30px;font-size:12px}
  .device-dock{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}
  .device-chip{flex:0 0 auto;min-width:170px}
  .interaction-copy{padding:15px 14px}
}

/* QR entry screen */
body.gate-open{overflow:hidden}
.experience-gate{position:fixed;inset:0;z-index:9999;background:#101a2a;display:grid;grid-template-columns:1.12fr .88fr;color:#fff;transition:opacity .55s ease,transform .55s ease}
.experience-gate.is-closing{opacity:0;transform:scale(1.015);pointer-events:none}
.gate-photo{position:relative;overflow:hidden;min-height:100vh}
.gate-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:heroDrift 15s ease-in-out infinite alternate}
.gate-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,16,28,.08),rgba(8,16,28,.35)),linear-gradient(180deg,rgba(7,15,26,.22),rgba(7,15,26,.55))}
.gate-copy{display:flex;flex-direction:column;justify-content:center;padding:8vw;position:relative;overflow:hidden}
.gate-copy:before,.gate-copy:after{content:'';position:absolute;border:1px solid rgba(208,181,127,.12);border-radius:50%;width:520px;height:520px;right:-330px;top:-220px}
.gate-copy:after{width:340px;height:340px;right:-180px;top:auto;bottom:-150px}
.gate-brand{display:flex;align-items:center;gap:12px;font-size:18px;font-weight:800;margin-bottom:72px;position:relative;z-index:1}
.gate-brand small{font-size:13px;color:#d0b57f;font-weight:600}
.gate-kicker{font-size:10px;letter-spacing:2.5px;color:#d0b57f;font-weight:800;position:relative;z-index:1}
.gate-copy h1{font-size:clamp(43px,5.2vw,78px);line-height:1.06;letter-spacing:-3.5px;margin:24px 0 24px;position:relative;z-index:1}
.gate-copy h1 em{font-style:normal;color:#d4b984}
.gate-copy p{font-size:14px;line-height:1.9;color:#c0c7d1;max-width:520px;margin:0 0 34px;position:relative;z-index:1}
.gate-start{position:relative;z-index:1;border:0;border-radius:8px;background:#d0b57f;color:#142039;padding:18px 21px;display:flex;align-items:center;justify-content:space-between;gap:35px;max-width:320px;font-size:13px;font-weight:800;box-shadow:0 15px 40px rgba(0,0,0,.2);transition:transform .25s,background .25s}
.gate-start:hover{transform:translateY(-3px);background:#e1c996}
.gate-start span{font-size:20px;font-weight:400}
.gate-skip{position:relative;z-index:1;margin-top:17px;background:transparent;border:0;color:#8995a6;text-align:left;padding:0;font-size:11px;text-decoration:underline;text-underline-offset:5px}
.gate-hint{position:relative;z-index:1;margin-top:62px;font-size:11px;color:#8995a6;letter-spacing:.4px}
.gate-hint span{color:#d0b57f;margin-right:8px;text-shadow:0 0 14px #d0b57f}
.gate-ping{position:absolute;width:15px;height:15px;border-radius:50%;background:#e0c38e;box-shadow:0 0 0 7px rgba(224,195,142,.2),0 0 25px rgba(224,195,142,.65);z-index:2;animation:gatePing 2s infinite}
.gate-ping.p1{left:22%;top:30%}.gate-ping.p2{left:68%;top:47%;animation-delay:.5s}.gate-ping.p3{left:84%;top:73%;animation-delay:1s}
@keyframes gatePing{0%,100%{transform:scale(.85);box-shadow:0 0 0 6px rgba(224,195,142,.18),0 0 22px rgba(224,195,142,.45)}50%{transform:scale(1.08);box-shadow:0 0 0 14px rgba(224,195,142,.05),0 0 34px rgba(224,195,142,.8)}}

/* animated scene effects */
.scene-fx,.manual-dim-layer{position:absolute;inset:0;pointer-events:none;z-index:2;overflow:hidden}
.manual-dim-layer{background:#06101f;opacity:0;transition:opacity .12s linear;z-index:2}
.fx-light-orb{position:absolute;width:180px;height:180px;border-radius:50%;filter:blur(30px);opacity:.6;animation:softGlow 2.5s ease-in-out infinite alternate}
.fx-light-orb.morning{background:rgba(255,238,192,.55)}.fx-light-orb.warm{background:rgba(255,158,58,.38)}
.fx-light-orb.a{left:7%;top:4%}.fx-light-orb.b{right:5%;top:18%;animation-delay:.4s}
.fx-warm-wash{position:absolute;inset:0;background:radial-gradient(circle at 72% 32%,rgba(255,181,77,.24),transparent 38%),linear-gradient(180deg,rgba(255,157,60,.08),transparent 55%);animation:warmBreath 3s ease-in-out infinite alternate}
.fx-cinema-vignette{position:absolute;inset:0;box-shadow:inset 0 0 160px rgba(0,0,0,.62);animation:vignetteIn .8s ease both}
.fx-tv-glow{position:absolute;right:-4%;top:34%;width:30%;height:42%;background:rgba(75,151,255,.33);filter:blur(30px);animation:tvPulse 2.2s ease-in-out infinite alternate}
.fx-sparkle,.fx-tool-spark,.fx-evening-dot{position:absolute;color:#ffe7b1;text-shadow:0 0 15px currentColor;animation:floatSpark 2.1s ease-in-out infinite}
.fx-sparkle.s1{left:24%;top:18%}.fx-sparkle.s2{left:70%;top:22%;animation-delay:.8s}
.fx-caption-chip{position:absolute;left:50%;top:17%;transform:translateX(-50%);background:rgba(13,24,40,.76);color:#fff;border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(10px);padding:9px 13px;border-radius:99px;font-size:9px;font-weight:800;letter-spacing:1.2px;animation:chipIn .5s ease both}
.fx-caption-chip.danger{background:rgba(115,38,30,.78)}.fx-caption-chip.cool{background:rgba(30,82,118,.75)}
.fx-scan{position:absolute;width:92px;height:92px;border:2px solid rgba(128,255,189,.85);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 0 rgba(128,255,189,.25);animation:scanRing 1.8s infinite}
.fx-detect-label{position:absolute;left:50%;bottom:25%;transform:translateX(-50%);font-size:9px;font-weight:800;letter-spacing:1.1px;color:#d4ffe7;background:rgba(9,41,27,.68);padding:8px 11px;border-radius:99px;border:1px solid rgba(153,255,201,.25)}
.fx-phone-toast{position:absolute;right:6%;top:22%;width:220px;background:rgba(248,249,251,.94);color:#172338;border-radius:15px;padding:13px 14px;box-shadow:0 18px 42px rgba(0,0,0,.28);animation:toastIn .55s cubic-bezier(.2,.8,.2,1) both}
.fx-phone-toast b{display:block;font-size:11px}.fx-phone-toast small{display:block;margin-top:5px;font-size:10px;color:#616a78;line-height:1.4}.fx-phone-toast.danger{border-left:4px solid #c75b4b}
.fx-live-frame{position:absolute;left:10%;top:12%;right:10%;bottom:22%;border:1px solid rgba(255,255,255,.55);border-radius:18px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15);animation:frameIn .6s ease both}.fx-live-frame:before,.fx-live-frame:after,.fx-live-frame i:before,.fx-live-frame i:after{content:'';position:absolute;width:25px;height:25px;border-color:#fff;border-style:solid}.fx-live-frame:before{left:10px;top:10px;border-width:2px 0 0 2px}.fx-live-frame:after{right:10px;top:10px;border-width:2px 2px 0 0}.fx-live-frame i:before{left:10px;bottom:10px;border-width:0 0 2px 2px}.fx-live-frame i:after{right:10px;bottom:10px;border-width:0 2px 2px 0}.fx-live-frame b{position:absolute;top:14px;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:1.5px;color:#fff;background:#d94f4f;padding:5px 8px;border-radius:99px}
.fx-water-ring{position:absolute;left:49%;top:72%;width:90px;height:32px;border:2px solid rgba(100,193,255,.65);border-radius:50%;transform:translate(-50%,-50%);animation:waterRing 1.8s infinite}.fx-water-ring.r2{animation-delay:.7s}.fx-water-drop{position:absolute;color:#8fd0ff;font-size:32px;text-shadow:0 0 12px #70c7ff;animation:dropFall 1.3s infinite}.fx-water-drop.d1{left:46%;top:26%}.fx-water-drop.d2{left:52%;top:30%;animation-delay:.55s}
.fx-valve-ring{position:absolute;left:54%;top:34%;transform:translate(-50%,-50%);width:78px;height:78px;border:2px dashed rgba(255,227,167,.75);border-radius:50%;display:grid;place-items:center;color:#ffe0a6;font-size:31px;animation:spinValve 1.2s ease-in-out both}
.fx-temp-badge{position:absolute;left:8%;top:18%;background:rgba(26,36,52,.82);color:#fff;border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(10px);padding:10px 13px;border-radius:15px;font-size:27px;font-weight:800;line-height:1;animation:chipIn .5s ease both}.fx-temp-badge small{display:block;margin-top:7px;font-size:8px;font-weight:700;color:#efc7a6;letter-spacing:.5px}.fx-temp-badge.comfort{background:rgba(17,81,65,.78)}.fx-temp-badge.comfort small{color:#bff0d9}
.fx-air-line{position:absolute;left:48%;top:16%;width:44%;height:13%;border-top:3px solid rgba(173,225,255,.75);border-radius:50%;filter:drop-shadow(0 0 6px rgba(129,208,255,.6));animation:airFlow 1.6s ease-in-out infinite}.fx-air-line.l2{top:22%;animation-delay:.25s}.fx-air-line.l3{top:28%;animation-delay:.5s}
.fx-success-ring{position:absolute;right:9%;top:19%;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:rgba(88,170,126,.88);color:white;font-size:24px;box-shadow:0 0 0 8px rgba(88,170,126,.15);animation:successPop .5s ease both}.fx-success-ring.lock{right:17%;top:40%}
.fx-profile{position:absolute;top:23%;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#f7f3ea;color:#203049;font-size:11px;font-weight:800;box-shadow:0 8px 24px rgba(0,0,0,.18);animation:profileIn .5s ease both}.fx-profile.p1{left:28%}.fx-profile.p2{left:38%;animation-delay:.15s}.fx-profile.p3{left:48%;animation-delay:.3s}
.fx-unlock{position:absolute;left:78%;top:48%;transform:translate(-50%,-50%);width:92px;height:92px;border-radius:50%;display:grid;place-items:center;background:rgba(22,39,55,.77);color:#f0d39c;border:1px solid rgba(255,255,255,.28);font-size:35px;box-shadow:0 0 0 0 rgba(215,189,140,.28);animation:unlockPulse 1.6s infinite}.fx-unlock small{position:absolute;bottom:14px;font-size:7px;letter-spacing:1.2px;color:#fff}
.fx-welcome{position:absolute;left:50%;top:20%;transform:translateX(-50%);background:rgba(249,247,241,.90);color:#172338;padding:10px 14px;border-radius:99px;font-size:9px;font-weight:800;letter-spacing:1px;box-shadow:0 12px 35px rgba(0,0,0,.2);animation:toastIn .55s ease both;white-space:nowrap}
.fx-sunray{position:absolute;left:16%;top:-5%;width:12%;height:75%;background:linear-gradient(180deg,rgba(255,217,139,.55),rgba(255,217,139,0));transform:rotate(18deg);filter:blur(7px);animation:sunRay 2.5s ease-in-out infinite alternate}.fx-sunray.ray2{left:35%;animation-delay:.5s}
.fx-curtain{position:absolute;top:0;bottom:0;width:26%;background:linear-gradient(90deg,rgba(77,58,50,.15),rgba(84,63,53,.42));backdrop-filter:blur(1px);animation:curtainClose 1.2s cubic-bezier(.2,.75,.2,1) both}.fx-curtain.left{left:0;transform-origin:left}.fx-curtain.right{right:0;transform-origin:right}
.fx-evening-dot.e1{left:20%;top:22%}.fx-evening-dot.e2{right:16%;top:28%;animation-delay:.8s}
.fx-tool-spark.t1{left:28%;top:25%}.fx-tool-spark.t2{left:68%;top:42%;animation-delay:.7s}
.fx-network{position:absolute;width:17px;height:17px;border-radius:50%;background:#d8bb82;box-shadow:0 0 0 8px rgba(216,187,130,.13),0 0 22px rgba(216,187,130,.55);animation:networkPulse 1.7s infinite}.fx-network.n1{left:30%;top:35%}.fx-network.n2{left:53%;top:55%;animation-delay:.4s}.fx-network.n3{left:73%;top:31%;animation-delay:.8s}.fx-network-line{position:absolute;left:31%;top:38%;width:43%;height:24%;border-top:1px dashed rgba(255,224,166,.68);border-right:1px dashed rgba(255,224,166,.68);transform:skewY(-10deg)}
.fx-heart{position:absolute;right:13%;top:22%;font-size:38px;color:#e1c18a;text-shadow:0 0 25px rgba(225,193,138,.6);animation:heartBeat 1.4s infinite}
@keyframes softGlow{from{opacity:.35;transform:scale(.9)}to{opacity:.7;transform:scale(1.1)}}
@keyframes warmBreath{from{opacity:.55}to{opacity:1}}
@keyframes vignetteIn{from{opacity:0}to{opacity:1}}
@keyframes tvPulse{from{opacity:.35}to{opacity:.85}}
@keyframes floatSpark{50%{transform:translateY(-8px) scale(1.2);opacity:.65}}
@keyframes chipIn{from{opacity:0;transform:translate(-50%,-10px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes scanRing{0%{box-shadow:0 0 0 0 rgba(128,255,189,.28);opacity:1}100%{box-shadow:0 0 0 32px rgba(128,255,189,0);opacity:.65}}
@keyframes toastIn{from{opacity:0;transform:translateY(-12px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes frameIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
@keyframes waterRing{0%{transform:translate(-50%,-50%) scale(.55);opacity:.9}100%{transform:translate(-50%,-50%) scale(1.7);opacity:0}}
@keyframes dropFall{0%{transform:translateY(-7px);opacity:0}40%{opacity:1}100%{transform:translateY(80px);opacity:0}}
@keyframes spinValve{0%{opacity:0;transform:translate(-50%,-50%) rotate(-130deg) scale(.8)}100%{opacity:1;transform:translate(-50%,-50%) rotate(0deg) scale(1)}}
@keyframes airFlow{0%{transform:translateX(-16px);opacity:0}40%{opacity:1}100%{transform:translateX(34px);opacity:0}}
@keyframes successPop{0%{transform:scale(.5);opacity:0}70%{transform:scale(1.15)}100%{transform:scale(1);opacity:1}}
@keyframes profileIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes unlockPulse{0%,100%{box-shadow:0 0 0 6px rgba(215,189,140,.13)}50%{box-shadow:0 0 0 20px rgba(215,189,140,0)}}
@keyframes sunRay{from{opacity:.28;transform:rotate(18deg) translateX(-10px)}to{opacity:.72;transform:rotate(18deg) translateX(15px)}}
@keyframes curtainClose{from{width:5%;opacity:.2}to{width:26%;opacity:1}}
@keyframes networkPulse{50%{transform:scale(1.15);box-shadow:0 0 0 14px rgba(216,187,130,0),0 0 30px rgba(216,187,130,.65)}}
@keyframes heartBeat{0%,100%{transform:scale(1)}35%{transform:scale(1.18)}55%{transform:scale(.98)}}

/* tactile controls */
.live-control{margin-top:15px}
.live-control:empty{display:none}
.live-control-head{display:flex;justify-content:space-between;align-items:center;padding:0 3px 9px;font-size:10px;color:#90949a}.live-control-head span{letter-spacing:1.1px;text-transform:uppercase;color:#ad9368;font-weight:800}.live-control-head b{font-size:11px;color:#27374c}
.dimmer-box,.climate-control,.curtain-control{display:flex;align-items:center;gap:15px;border:1px solid #e5e1d8;background:#fbfaf6;border-radius:16px;padding:12px 14px;box-shadow:0 8px 25px rgba(20,32,57,.04)}
.switch-control{border:0;background:#18263a;color:white;border-radius:13px;padding:8px 10px;display:flex;align-items:center;gap:7px;min-width:74px;justify-content:center;font-size:10px}.switch-control span{width:9px;height:9px;border-radius:50%;background:#788392;box-shadow:0 0 0 4px rgba(255,255,255,.05)}.switch-control.is-on span{background:#ddb974;box-shadow:0 0 0 5px rgba(221,185,116,.16),0 0 10px rgba(221,185,116,.55)}
.dimmer-range{flex:1;display:flex;flex-direction:column;gap:8px;font-size:10px;color:#79808b}.dimmer-range>span{display:flex;justify-content:space-between}.dimmer-range output{font-weight:800;color:#1c2b40}
.dimmer-range input,.climate-control input,.curtain-control input{width:100%;accent-color:#bea06a;cursor:pointer}
.mini-scene-btn{border:1px solid #d9cfbc;background:white;border-radius:12px;padding:10px 13px;font-size:10px;font-weight:800;color:#2c3b4e}
.climate-control{display:grid;grid-template-columns:1fr auto;gap:8px 14px}.climate-control output{font-size:22px;font-weight:800;color:#1a2b40}.climate-control small{grid-column:1/-1;color:#8e9399;font-size:9px}.curtain-control span{font-size:10px;color:#7f858c;white-space:nowrap}.curtain-control input{flex:1}

@media(max-width:900px){
  .experience-gate{grid-template-columns:1fr}.gate-photo{position:absolute;inset:0;min-height:0}.gate-shade{background:linear-gradient(180deg,rgba(8,16,28,.38),rgba(8,16,28,.88) 62%,#101a2a 100%)}.gate-copy{min-height:100svh;padding:30px 24px;justify-content:flex-end}.gate-brand{margin-bottom:auto;padding-top:8px}.gate-copy h1{font-size:clamp(42px,12vw,66px);letter-spacing:-2.7px}.gate-copy p{font-size:12px;line-height:1.75}.gate-start{max-width:none;width:100%}.gate-skip{text-align:center;width:100%;padding:7px}.gate-hint{margin-top:28px;text-align:center;padding-bottom:max(0px,env(safe-area-inset-bottom))}
}
@media(max-width:760px){
  .fx-phone-toast{right:5%;top:17%;width:190px}.fx-caption-chip{top:14%;font-size:8px}.fx-temp-badge{top:16%;font-size:21px}.fx-welcome{top:16%;font-size:8px}.dimmer-box{gap:9px;padding:10px}.mini-scene-btn{padding:9px}.switch-control{min-width:68px}.live-control-head{padding-left:2px;padding-right:2px}.scene-hotspot-card{z-index:4}.hotspot-layer{z-index:5}
}
.scene-topline,.scene-caption,.scene-center-tip,.scene-bottom-rail{z-index:6}
.scene-hotspot-card{z-index:7}
.hotspot-layer{z-index:8}

