:root{--ground:#F4F2EE;--panel:#FBFAF7;--ink:#15181C;--muted:#5D6168;--line:#D6D1C7;--accent:#0F6F6A;--accent2:#6FD6CC;--night:#0E1113;--scan:#8FF0B4;--scan-d:rgba(143,240,180,.14);--amber:#C98A2B;
  --display:Michroma,"Arial Black",sans-serif;--ui:"Public Sans","Helvetica Neue",system-ui,sans-serif;--mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;color-scheme:light}
*{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;background:var(--ground);color:var(--ink);font:16px/1.55 var(--ui);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
img{max-width:100%}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--accent);color:#fff;padding:10px 16px;border-radius:999px;font-weight:700;text-decoration:none}.skip:focus{top:12px}

/* nav */
.nav{position:fixed;inset:0 0 auto 0;z-index:60;display:flex;align-items:center;gap:20px;padding:14px clamp(16px,4vw,40px);transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
.nav.solid{background:rgba(244,242,238,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom-color:var(--line)}
.nav .logo{display:flex;align-items:center;height:22px}
.nav .logo img{height:22px;width:auto;filter:invert(1);transition:filter .3s}
.nav.solid .logo img{filter:none}
.nav ul{display:flex;gap:22px;list-style:none;margin:0 0 0 auto;padding:0}
.nav ul a{text-decoration:none;font-size:14px;font-weight:500;color:#fff;transition:color .3s}
.nav.solid ul a{color:var(--ink)}
.nav .cta{margin-left:8px;text-decoration:none;font-weight:600;font-size:14px;background:var(--accent);color:#fff;padding:10px 16px;border-radius:999px;white-space:nowrap}
@media(max-width:980px){.nav ul{display:none}.nav .cta{margin-left:auto}}

/* stages */
.film,.walk{position:relative}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--night)}
.stage.light{background:var(--ground)}
.box{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);will-change:transform}
.box video,.box>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,17,19,.4) 0%,rgba(14,17,19,0) 30%,rgba(14,17,19,0) 55%,rgba(14,17,19,.6) 100%);pointer-events:none}
.cap{position:absolute;left:clamp(16px,6vw,96px);bottom:12vh;width:min(680px,calc(100% - 32px));color:#fff;pointer-events:none;text-shadow:0 2px 28px rgba(0,0,0,.45)}
.cap p{margin:0;position:absolute;bottom:0;left:0;width:100%;font:400 clamp(24px,3.8vw,52px)/1.14 var(--display);text-wrap:balance;opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease}
.cap p small{display:block;font:500 12px/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;margin-bottom:12px;opacity:.85}
.cap p.on{opacity:1;transform:none}
.hint{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);font:500 11px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.85);transition:opacity .4s;display:flex;flex-direction:column;align-items:center;gap:8px}
.hint i{width:1px;height:28px;background:linear-gradient(#fff,transparent);animation:drip 1.8s ease-in-out infinite}
@keyframes drip{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* walk-through */
.box img.hand{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;will-change:transform,opacity;z-index:1}
.wbg,.abg{position:absolute;inset:-60px;background:var(--night) center/cover no-repeat;filter:blur(38px) saturate(1.1) brightness(.55);transform:scale(1.08)}
.abg{opacity:0;background-image:url(/site/home/living.jpg)}
@media(max-width:860px){.wbg,.abg{display:none}.box img.hand{-webkit-mask-image:linear-gradient(180deg,transparent,#000 16%,#000 84%,transparent),linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(180deg,transparent,#000 16%,#000 84%,transparent),linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-composite:intersect}}
.room{position:absolute;inset:0;opacity:0;will-change:opacity,transform}
.room>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.room svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.room .sweep{position:absolute;left:0;right:0;top:0;height:16%;background:linear-gradient(180deg,rgba(143,240,180,0),rgba(143,240,180,.16) 70%,rgba(143,240,180,.85) 100%);mix-blend-mode:screen;opacity:0;pointer-events:none}
.fb{fill:var(--scan-d);stroke:var(--scan);stroke-width:2.4;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 6px rgba(143,240,180,.85)) drop-shadow(0 0 16px rgba(143,240,180,.45));opacity:0;transition:opacity .5s ease}
.fb.on{opacity:1}
.fb.draw{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);transition:stroke-dashoffset 1s cubic-bezier(.4,0,.2,1),opacity .3s}
.fb.draw.on{stroke-dashoffset:0}
.fl{position:absolute;transform:translate(-50%,0) translateY(8px);opacity:0;transition:opacity .45s ease .25s,transform .45s ease .25s;display:grid;gap:2px;padding:10px 14px;border-radius:12px;background:rgba(26,38,33,.82);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(143,240,180,.35);color:#fff;box-shadow:0 14px 34px -12px rgba(0,0,0,.55);white-space:nowrap;pointer-events:none}
.fl b{font:600 15px/1.25 var(--ui)}
.fl span{font:500 11px/1.3 var(--mono);letter-spacing:.06em;color:#BFEFD0}
.fl.on{opacity:1;transform:translate(-50%,0)}
.fl.up{transform:translate(-50%,-100%) translateY(-8px)}.fl.up.on{transform:translate(-50%,-100%)}
.wshade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,17,19,.72) 0%,rgba(14,17,19,.28) 30%,rgba(14,17,19,0) 50%),linear-gradient(0deg,rgba(14,17,19,.55),rgba(14,17,19,0) 30%);pointer-events:none}
.wcopy{position:absolute;left:clamp(16px,5vw,80px);transition:left .5s ease,right .5s ease;bottom:clamp(90px,14vh,140px);width:min(420px,calc(100% - 32px));color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.4)}
.wcopy .wk{display:inline-block;font:500 11px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--scan);margin-bottom:10px}
.wcopy h2{margin:0;font:400 clamp(24px,2.8vw,40px)/1.14 var(--display);text-wrap:balance}
.wcopy p{margin:12px 0 0;font-size:17px;line-height:1.5;color:#E2E7E5}
.wcopy.swap h2,.wcopy.swap p,.wcopy.swap .wk{animation:wIn .55s ease}
@keyframes wIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.wrail{position:absolute;left:clamp(16px,5vw,80px);bottom:clamp(24px,5vh,44px);display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0;right:16px}
.wrail button{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:7px;font:500 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#C9D1D4;padding:8px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:rgba(14,17,19,.5);backdrop-filter:blur(6px)}
.wrail button i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.3)}
.wrail button.seen i{background:var(--scan)}
.wrail button.on{color:#0E1113;background:var(--scan);border-color:transparent}
.wrail button.on i{background:#0E1113}
.wrail button:focus-visible{outline:2px solid var(--scan);outline-offset:2px}
.todo{position:absolute;inset:0;display:grid;place-items:center;padding:80px 16px 40px;background:rgba(14,17,19,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);opacity:0;pointer-events:none;transition:opacity .5s ease}
.todo.on{opacity:1}
.todo.on .todo-card{pointer-events:auto}
.todo-card{width:min(980px,100%);background:var(--panel);border-radius:22px;padding:clamp(22px,3vw,38px);box-shadow:0 40px 100px -30px rgba(0,0,0,.6);transform:translateY(20px);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.todo.on .todo-card{transform:none}
.todo-k{font:500 11px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.todo-card h3{margin:10px 0 22px;font:400 clamp(22px,2.4vw,32px)/1.15 var(--display)}
.todo-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.todo-cols b{display:inline-flex;align-items:center;gap:8px;font:600 12px var(--mono);letter-spacing:.1em;text-transform:uppercase}
.todo-cols b::before{content:"";width:9px;height:9px;border-radius:50%}
.t-soon::before{background:#D9532B}.t-plan::before{background:var(--amber)}.t-watch::before{background:var(--accent)}
.todo-cols ul{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}
.todo-cols li{font-size:15px;line-height:1.4;padding:10px 12px;border-radius:10px;background:#fff;border:1px solid var(--line)}
.todo-n{margin:18px 0 0;color:var(--muted);font-size:14.5px}

/* see the fix */
#fix .box img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.after{position:absolute;inset:0;clip-path:inset(0 0 0 var(--w,100%));will-change:clip-path}
.wipe{position:absolute;top:0;bottom:0;left:var(--w,100%);width:0;pointer-events:none}
.wipe i{position:absolute;top:0;bottom:0;left:-1px;width:2px;background:#fff;box-shadow:0 0 18px rgba(255,255,255,.8)}
.wipe span{position:absolute;top:50%;font:600 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#0E1113;background:#fff;padding:7px 10px;border-radius:999px;transform:translateY(-50%);white-space:nowrap}
.wipe span:first-child{right:14px}.wipe span:last-of-type{left:14px}
.fcopy{position:absolute;left:clamp(16px,5vw,80px);top:clamp(84px,14vh,140px);width:min(440px,calc(100% - 32px));color:#fff;padding:22px 24px;border-radius:18px;background:rgba(14,17,19,.6);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.fcopy h2{margin:12px 0 10px;font:400 clamp(22px,2.4vw,34px)/1.15 var(--display);text-wrap:balance}
.fcopy p{margin:0;color:#DDE3E1;font-size:16px}
.pp{display:inline-flex;align-items:center;gap:6px;font:500 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#F1C27D;border:1px solid rgba(232,177,90,.45);background:rgba(232,177,90,.12);padding:6px 9px;border-radius:999px}
.pp::before{content:"";width:6px;height:6px;border-radius:50%;background:#E8B15A}
.sec .pp{color:#8A5A12;border-color:rgba(201,138,43,.45);background:rgba(201,138,43,.1)}
.sec .pp::before{background:var(--amber)}

/* book a pro */
.appstage{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:clamp(20px,4vw,72px);padding:72px clamp(16px,5vw,80px) 24px}
.acopy{max-width:38ch;justify-self:end}
.acopy .k{font:500 12px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0}
.acopy h2{font:400 clamp(24px,2.7vw,38px)/1.16 var(--display);margin:14px 0 12px;text-wrap:balance}
.acopy p{margin:0;color:var(--muted);font-size:17px}
.acopy.swap>*{animation:wIn .5s ease}
.asteps{list-style:none;margin:0;padding:0;display:grid;gap:4px;justify-self:start}
.asteps button{all:unset;cursor:pointer;display:block;font:500 13px var(--mono);letter-spacing:.04em;color:var(--muted);padding:8px 0 8px 16px;border-left:2px solid var(--line);transition:color .3s,border-color .3s}
.asteps button.on{color:var(--ink);border-left-color:var(--accent)}
.asteps button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.phone{position:relative;width:var(--pw,min(36vh,340px));aspect-ratio:390/844;border-radius:calc(var(--pw,340px)*.15);background:#0d0f12;padding:10px;box-shadow:0 50px 100px -30px rgba(21,24,28,.45),0 0 0 1px rgba(255,255,255,.06) inset}
.phone .glass{position:relative;width:100%;height:100%;border-radius:38px;overflow:hidden;background:#fff}
.phone .glass::before{content:"";position:absolute;top:10px;left:50%;width:28%;height:22px;margin-left:-14%;border-radius:12px;background:#0d0f12;z-index:2}
.scr{position:absolute;inset:0;padding:48px 16px 18px;display:flex;flex-direction:column;gap:10px;opacity:0;transform:translateX(14px);transition:opacity .45s ease,transform .45s ease;font-family:var(--ui);color:var(--ink)}
.scr.on{opacity:1;transform:none}
.a-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.a-top span{font-weight:800;font-size:19px;letter-spacing:-.02em}
.a-top em{font-style:normal;font:500 9.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--accent);background:rgba(15,111,106,.1);padding:5px 8px;border-radius:999px;white-space:nowrap}
.a-ph{height:31%;border-radius:14px;background-size:330%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}
.a-t{margin:2px 0 0;font-weight:700;font-size:14px}
.a-d{margin:-4px 0 0;font-size:12.5px;line-height:1.45;color:var(--muted)}
.a-l{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.a-l li{display:flex;gap:8px;align-items:center;font-size:12.5px}
.a-l li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent);flex:none}
.a-b{margin-top:auto;text-align:center;padding:12px;border-radius:999px;background:var(--accent);color:#fff;font-weight:700;font-size:13.5px}
.a-b.ghost{background:transparent;border:1px solid var(--line);color:var(--ink)}
.a-slots{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.a-slots span{padding:12px 10px;border-radius:12px;border:1px solid var(--line);font-size:12.5px;font-weight:600;text-align:center}
.a-slots span.on{border-color:var(--accent);background:rgba(15,111,106,.08);color:var(--accent)}
.a-card{display:grid;gap:3px;padding:11px 12px;border-radius:12px;background:var(--ground);border:1px solid var(--line)}
.a-card b{font-size:12.5px}.a-card span{font-size:12px;color:var(--muted);line-height:1.4}
.a-card.ok{background:#fff;position:relative;padding-left:38px}
.a-card.ok::before{content:"";position:absolute;left:11px;top:12px;width:18px;height:18px;border-radius:50%;background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.3l3 3 6-6.2' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat}
.a-pro{display:flex;gap:12px;align-items:center;padding:12px;border-radius:14px;background:var(--ground);border:1px solid var(--line)}
.a-pro i{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:700;color:#fff;background:#232C5F;flex:none}
.a-pro b{display:block;font-size:13.5px}.a-pro span{font-size:11.5px;color:var(--muted)}
.a-track{list-style:none;margin:4px 0 0;padding:0 0 0 6px;display:grid;gap:12px}
.a-track li{position:relative;padding-left:22px;font-size:13px;color:var(--muted)}
.a-track li::before{content:"";position:absolute;left:0;top:4px;width:11px;height:11px;border-radius:50%;border:2px solid var(--line);background:#fff}
.a-track li.d{color:var(--ink)}.a-track li.d::before{background:var(--accent);border-color:var(--accent)}
.a-track li.n{color:var(--ink);font-weight:700}.a-track li.n::before{border-color:var(--accent);box-shadow:0 0 0 5px rgba(15,111,106,.15)}
.a-pair{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.a-pair div{position:relative;height:120px;border-radius:12px;background-size:250%;background-position:52% 18%}
.a-pair em{position:absolute;left:6px;bottom:6px;font-style:normal;font:600 9.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;background:rgba(14,17,19,.75);color:#fff;padding:4px 7px;border-radius:999px}

/* your designer */
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
#style .box img.lay{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;will-change:opacity}
#style .box img.lay[data-lay]{opacity:0}
#style .box .sweep{height:14%}
.dz-meas{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.dz-meas .ml{fill:none;stroke:var(--scan);stroke-width:2;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-dasharray:var(--len,1000);stroke-dashoffset:var(--len,1000);filter:drop-shadow(0 0 6px rgba(143,240,180,.8));opacity:0;transition:stroke-dashoffset .9s cubic-bezier(.4,0,.2,1),opacity .3s}
.dz-meas .ml.on{stroke-dashoffset:0;opacity:1}
#style .fl{z-index:3}
#style .fl.m b{font:600 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#BFEFD0}
#style .fl.m span{font:700 15px var(--ui);letter-spacing:0;color:#fff}
#style .fl[data-dtag]{border-color:rgba(255,255,255,.28);background:rgba(21,24,28,.78)}
#style .fl[data-dtag] span{color:#D9DEDC;font:500 11.5px var(--ui);letter-spacing:0}
.dshade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,17,19,.35) 0%,rgba(14,17,19,0) 28%,rgba(14,17,19,0) 55%,rgba(14,17,19,.62) 100%);pointer-events:none}
#style .cap{width:min(620px,calc(100% - 32px - clamp(220px,21vw,310px) - 6vw))}
#style .cap p em{display:block;font:400 clamp(14px,1.3vw,18px)/1.4 var(--ui);font-style:normal;margin-top:14px;color:#E2E7E5}
.dock{position:absolute;right:clamp(16px,6vw,96px);top:50%;transform:translateY(-50%);z-index:5;opacity:0;transition:opacity .5s ease}
.dock.on{opacity:1}
.dock .phone{--pw:clamp(200px,18vw,300px)}
#style .dock{right:clamp(16px,4vw,80px)}
#style .chips{position:absolute;left:clamp(16px,6vw,96px);bottom:5vh;display:flex;flex-wrap:wrap;gap:6px;margin:0;width:min(620px,calc(100% - 32px))}
.chips span{font-size:12.5px;font-weight:600;padding:7px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.25);background:rgba(21,24,28,.6);color:#fff;backdrop-filter:blur(8px);opacity:0;transform:translateY(6px);transition:opacity .4s,transform .4s}
.chips.on span{opacity:1;transform:none}
.chips.on span:nth-child(2){transition-delay:.06s}.chips.on span:nth-child(3){transition-delay:.12s}.chips.on span:nth-child(4){transition-delay:.18s}.chips.on span:nth-child(5){transition-delay:.24s}.chips.on span:nth-child(6){transition-delay:.3s}.chips.on span:nth-child(7){transition-delay:.36s}
@media(max-width:860px){
  #style .cap{width:calc(100% - 32px);top:38vh;bottom:auto}
  #style .cap p{font-size:21px}
  #style .dock{right:50%}
  .dshade{background:linear-gradient(180deg,rgba(14,17,19,.2) 0%,rgba(14,17,19,.55) 22%,rgba(14,17,19,.55) 40%,rgba(14,17,19,.1) 56%,rgba(14,17,19,.55) 100%)}
  #style .cap p em{font-size:13px;margin-top:8px}
  #style .fl[data-dtag]{display:block;padding:6px 9px}#style .fl[data-dtag] span{display:none}
  #style .fl.m{display:block;padding:5px 8px}#style .fl.m b{font-size:9px}#style .fl.m span{display:block;font-size:12px}
  .dock{right:50%;top:auto;bottom:14px;transform:translateX(50%)}
  .dock .phone{--pw:min(44vw,190px)!important}
  #style .chips{display:none}
}
/* designer app screens */
.ets .dz-cam{position:absolute;inset:0;background:#0E1113}
.ets .dz-cam img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;max-width:none;display:block}
.ets .dz-vf{position:absolute;left:28px;right:28px;top:140px;bottom:230px;pointer-events:none}
.ets .dz-vf i{position:absolute;width:28px;height:28px;border:3px solid #fff;border-radius:3px}
.ets .dz-vf i:nth-child(1){left:0;top:0;border-right:0;border-bottom:0}.ets .dz-vf i:nth-child(2){right:0;top:0;border-left:0;border-bottom:0}.ets .dz-vf i:nth-child(3){left:0;bottom:0;border-right:0;border-top:0}.ets .dz-vf i:nth-child(4){right:0;bottom:0;border-left:0;border-top:0}
.ets .dz-ctop{position:absolute;left:22px;right:22px;top:70px;display:flex;justify-content:space-between;align-items:center}
.ets .dz-pill{display:inline-flex;align-items:center;gap:6px;background:rgba(21,24,28,.7);color:#fff;border-radius:999px;padding:7px 12px;font:600 12px var(--ets-sans);backdrop-filter:blur(6px)}
.ets .dz-pill.live{background:rgba(15,111,106,.92)}
.ets .dz-pill.live::before{content:"";width:7px;height:7px;border-radius:50%;background:#8FF0B4;box-shadow:0 0 8px #8FF0B4}
.ets .dz-mz{position:absolute;left:22px;right:22px;bottom:150px;background:rgba(21,24,28,.72);backdrop-filter:blur(8px);border-radius:14px;padding:12px 14px;color:#fff}
.ets .dz-mz b{display:block;font:800 10.5px var(--ets-sans);letter-spacing:.08em;text-transform:uppercase;color:#8FF0B4;margin-bottom:6px}
.ets .dz-mz div{display:flex;flex-wrap:wrap;gap:6px}
.ets .dz-mz span{font:600 12px var(--ets-mono);background:rgba(255,255,255,.12);padding:5px 8px;border-radius:7px}
.ets .dz-shut{position:absolute;left:50%;bottom:52px;width:70px;height:70px;margin-left:-35px;border-radius:50%;border:4px solid #fff;background:rgba(255,255,255,.25)}
.ets .dz-shut::after{content:"";position:absolute;inset:5px;border-radius:50%;background:#fff}
.ets .dz-wrap{position:absolute;inset:0;padding:54px 22px 30px;display:flex;flex-direction:column;background:var(--ets-ground)}
.ets .dz-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.ets .dz-chat{display:flex;flex-direction:column;gap:10px;flex:1}
.ets .dz-me{align-self:flex-end;max-width:82%;background:var(--ets-ink);color:#fff;border-radius:16px 16px 4px 16px;padding:11px 14px;font:500 13.5px/1.4 var(--ets-sans)}
.ets .dz-ai{align-self:flex-start;max-width:92%;background:#fff;border:1px solid var(--ets-line);border-radius:16px 16px 16px 4px;padding:11px 14px;font:400 13.5px/1.45 var(--ets-sans);color:var(--ets-ink)}
.ets .dz-ai b{font-weight:700}
.ets .dz-dirs{display:grid;gap:8px;margin-top:4px}
.ets .dz-dir{display:flex;align-items:center;gap:11px;background:#fff;border:1.5px solid var(--ets-line);border-radius:12px;padding:10px 12px}
.ets .dz-dir.on{border-color:var(--ets-accent);background:var(--ets-tint)}
.ets .dz-sw{display:grid;grid-template-columns:repeat(2,14px);gap:2px;flex:none}
.ets .dz-sw i{width:14px;height:14px;border-radius:3px}
.ets .dz-dir b{display:block;font:700 13px var(--ets-sans)}.ets .dz-dir span{display:block;font:400 11px var(--ets-sans);color:var(--ets-muted);margin-top:1px}
.ets .dz-dir em{margin-left:auto;font:800 10px var(--ets-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ets-accent);font-style:normal}
.ets .dz-in{margin-top:auto;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--ets-line);border-radius:999px;padding:8px 8px 8px 16px;font:400 13px var(--ets-sans);color:var(--ets-muted)}
.ets .dz-in i{margin-left:auto;width:34px;height:34px;border-radius:50%;background:var(--ets-accent);flex:none;display:grid;place-items:center}
.ets .dz-card{background:#fff;border:1px solid var(--ets-line);border-radius:12px;padding:13px 14px;margin-bottom:10px;box-shadow:0 1px 2px rgba(21,24,28,.08)}
.ets .dz-card.acc{border:1.5px solid var(--ets-accent)}
.ets .dz-k{font:800 10.5px var(--ets-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ets-accent);margin-bottom:6px}
.ets .dz-t{font:400 20px/1.2 var(--ets-display);color:var(--ets-ink);margin-bottom:6px}
.ets .dz-p{font:400 12.5px/1.45 var(--ets-sans);color:var(--ets-ink2)}
.ets .dz-dims{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}
.ets .dz-dims span{font:500 12px var(--ets-mono);background:var(--ets-ground);border-radius:7px;padding:7px 9px;color:var(--ets-ink)}
.ets .dz-dims span b{display:block;font:800 9.5px var(--ets-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ets-muted);margin-bottom:2px}
.ets .dz-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ets .dz-list li{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--ets-line);border-radius:11px;padding:9px 11px;font:600 12.5px var(--ets-sans);color:var(--ets-muted);transition:border-color .3s,color .3s}
.ets .dz-list li i{flex:none;width:18px;height:18px;border-radius:50%;border:2px solid var(--ets-line);transition:background .3s,border-color .3s}
.ets .dz-list li em{margin-left:auto;font:500 10.5px var(--ets-mono);color:var(--ets-muted);font-style:normal}
.ets .dz-list li.on{color:var(--ets-ink);border-color:rgba(15,111,106,.4)}
.ets .dz-list li.on i{background:var(--ets-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.3l3 3 6-6.2' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat;border-color:var(--ets-accent)}
.ets .dz-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}
.ets .dz-it{background:#fff;border:1px solid var(--ets-line);border-radius:11px;overflow:hidden}
.ets .dz-th{height:64px;background-size:var(--z,300%);background-repeat:no-repeat}
.ets .dz-it div{padding:7px 9px 9px}
.ets .dz-it b{display:block;font:700 11.5px/1.25 var(--ets-sans);color:var(--ets-ink)}
.ets .dz-it span{display:inline-flex;align-items:center;gap:4px;margin-top:4px;font:700 9.5px var(--ets-sans);letter-spacing:.04em;text-transform:uppercase;color:var(--ets-accent)}
.ets .dz-it span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--ets-accent)}
.ets .dz-row{display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--ets-line);border-radius:12px;padding:10px 12px;margin-bottom:8px}
.ets .dz-row i{flex:none;width:30px;height:30px;border-radius:50%;background:var(--ets-tint);display:grid;place-items:center;color:var(--ets-accent)}
.ets .dz-row b{display:block;font:700 12.5px var(--ets-sans)}.ets .dz-row span{display:block;font:400 11px var(--ets-sans);color:var(--ets-muted);margin-top:1px}
.ets .dz-row.done i{background:var(--ets-accent);color:#fff}
.ets .dz-tot{display:flex;justify-content:space-between;align-items:baseline;padding:4px 2px 10px;font:600 12px var(--ets-sans);color:var(--ets-muted)}
.ets .dz-tot strong{font:800 18px var(--ets-sans);color:var(--ets-ink);letter-spacing:-.02em}
.ets .dz-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;padding:15px 20px;font:600 15px var(--ets-sans);background:var(--ets-accent);color:#fff;margin-top:auto}
.ets .dz-note{font:400 10.5px var(--ets-sans);color:var(--ets-muted);text-align:center;margin-top:8px}

/* keeps watching */
#watch .box img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.xshade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,17,19,.75) 0%,rgba(14,17,19,.25) 40%,rgba(14,17,19,.1) 60%,rgba(14,17,19,.5) 100%);pointer-events:none}
.xcopy{position:absolute;left:clamp(16px,5vw,80px);top:50%;transform:translateY(-50%);width:min(460px,calc(100% - 32px));color:#fff}
.xcopy h2{margin:14px 0 12px;font:400 clamp(24px,2.8vw,40px)/1.14 var(--display);text-wrap:balance}
.xcopy p{margin:0;color:#DDE3E1;font-size:17px}
.alerts{position:absolute;right:clamp(16px,5vw,80px);top:50%;transform:translateY(-50%);width:min(380px,calc(100% - 32px));display:grid;gap:12px}
.al{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:16px;background:rgba(251,250,247,.95);color:var(--ink);box-shadow:0 24px 60px -24px rgba(0,0,0,.6);opacity:0;transform:translateX(30px);transition:opacity .5s ease,transform .5s ease}
.al.on{opacity:1;transform:none}
.al i{width:36px;height:36px;border-radius:10px;flex:none;background:var(--accent) center/20px no-repeat}
.al b{display:block;font-size:14.5px;line-height:1.3}.al span{display:block;margin-top:3px;font-size:13px;line-height:1.45;color:var(--muted)}
.i-storm{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 15a4 4 0 1 1 1-7.9A5 5 0 0 1 18 9a3 3 0 0 1 0 6'/%3E%3Cpath d='M9 18l-1 2M13 18l-1 2M17 18l-1 2'/%3E%3C/svg%3E")}
.i-age{background-color:var(--amber)!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 8v4l3 2'/%3E%3C/svg%3E")}
.i-recall{background-color:#D9532B!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4l9 16H3z'/%3E%3Cpath d='M12 10v4M12 17v.5'/%3E%3C/svg%3E")}
.i-season{background-color:#232C5F!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='5' width='16' height='15' rx='2'/%3E%3Cpath d='M4 10h16M9 3v4M15 3v4'/%3E%3C/svg%3E")}

/* static sections */
.wrap{max-width:1180px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}
.sec{padding:clamp(72px,10vw,128px) 0}
.sec.soft{background:var(--panel);border-top:1px solid var(--line)}
.eyebrow{font:500 12px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 14px}
.eyebrow.on-dark{color:#7FD0C6}
.h2{font:400 clamp(28px,3.6vw,46px)/1.14 var(--display);margin:0 0 16px;text-wrap:balance;max-width:24ch}
.lead{color:var(--muted);font-size:18px;max-width:60ch;margin:0}
.pp-line{margin:20px 0 0}
.rec{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,5vw,80px);align-items:center}
.pass{background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px;box-shadow:0 40px 90px -40px rgba(21,24,28,.35)}
.pass-h{display:flex;gap:12px;align-items:center;padding-bottom:16px;border-bottom:1px solid var(--line)}
.pass-h img{width:34px;height:34px}
.pass-h b{display:block;font-size:16px}.pass-h span{font-size:13px;color:var(--muted)}
.pass-l{list-style:none;margin:6px 0 0;padding:0}
.pass-l li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:start;padding:12px 0;border-bottom:1px solid #EEEBE5;opacity:0;transform:translateY(10px);transition:opacity .5s,transform .5s}
.pass.on .pass-l li{opacity:1;transform:none}
.pass-l li:nth-child(2){transition-delay:.08s}.pass-l li:nth-child(3){transition-delay:.16s}.pass-l li:nth-child(4){transition-delay:.24s}.pass-l li:nth-child(5){transition-delay:.32s}.pass-l li:nth-child(6){transition-delay:.4s}
.pass-l i{width:10px;height:10px;border-radius:50%;margin-top:6px}
.d-fix{background:var(--accent)}.d-sys{background:#232C5F}.d-chk{background:var(--amber)}
.pass-l b{display:block;font-size:14.5px}.pass-l span{font-size:13px;color:var(--muted)}
.pass-l em{font-style:normal;font:500 11px var(--mono);letter-spacing:.06em;color:var(--muted);white-space:nowrap;padding-top:3px}
.pass-f{margin-top:14px;font-size:13px;color:var(--muted)}
.yi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:28px}
.yi>div{border-top:1px solid var(--line);padding-top:16px}
.yi b{display:block;font-size:17px;margin-bottom:6px}
.yi span{color:var(--muted);line-height:1.55}
.end{background:var(--night);color:#fff}
.end .h2{color:#fff}
.end .lead{color:#AEB6BB}
.start{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(30px,5vw,72px);align-items:start}
.steps-list{margin:28px 0 0;padding:0;list-style:none;display:grid;gap:10px;max-width:56ch;color:#D7DCDF}
.steps-list li{display:flex;gap:12px}
.steps-list li::before{content:"";flex:none;width:8px;height:8px;margin-top:9px;border-radius:50%;background:#6FD6CC}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;font:600 15px var(--ui);padding:14px 22px;border-radius:999px;background:var(--accent);color:#fff;border:0;cursor:pointer}
.btn[disabled]{opacity:.6;cursor:progress}
.hf,.fok{background:#161A1E;border:1px solid #262C31;border-radius:22px;padding:clamp(18px,2.4vw,28px);display:grid;gap:14px}
.hf label{display:grid;gap:7px;font-size:13px;font-weight:600;color:#C9D0D3}
.hf label em{font-style:normal;font-weight:400;color:#8D979C}
.hf .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hf .row.three{grid-template-columns:1.4fr .8fr .8fr}
.hf input,.hf select{width:100%;height:46px;padding:0 13px;border-radius:12px;border:1px solid #30373D;background:#0E1113;color:#fff;font:500 15px var(--ui);outline:none;appearance:none;-webkit-appearance:none}
.hf select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23AEB8BF' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;background-size:12px;padding-right:34px}
.hf select option{background:#161A1E}
.hf input:focus,.hf select:focus{border-color:#6FD6CC;box-shadow:0 0 0 4px rgba(111,214,204,.15)}
.hf .bad{border-color:#E06A4A!important}
.hf .btn{height:50px;margin-top:4px}
.fmsg{margin:0;min-height:1.2em;font-size:13.5px;color:#F09A80}
.fok{justify-items:start}
.fok[hidden]{display:none}
.fok i{width:52px;height:52px;border-radius:50%;background:#2FA39A url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.3l3 3 6-6.2' fill='none' stroke='%2306110F' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/32px no-repeat}
.fok h3{margin:6px 0 0;font-size:24px}.fok p{margin:0;color:#AEB6BB}
footer{background:var(--night);color:#8D979C;border-top:1px solid #23282c;font-size:14px}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;padding-top:28px;padding-bottom:40px}
footer a{color:#C9D0D3;text-decoration:none}
footer img{height:18px;filter:invert(1);margin-right:auto}

@media(max-width:860px){
  .cap{bottom:auto;top:16vh}
  #arrive .cap{top:auto;bottom:12vh}
  .wshade{background:linear-gradient(0deg,rgba(14,17,19,.94) 0%,rgba(14,17,19,.85) 38%,rgba(14,17,19,0) 62%)}
  .wcopy{bottom:84px}
  .wcopy p{font-size:15px}
  .fl{padding:6px 9px;border-radius:9px}.fl b{font-size:11.5px}.fl span{display:none}
  .todo-cols{grid-template-columns:minmax(0,1fr);gap:14px}
  .todo-cols ul{grid-template-columns:1fr 1fr;gap:6px}.todo-cols li{font-size:12.5px;padding:8px}
  .todo-card{padding:18px;max-height:calc(100svh - 100px);overflow:auto}
  .fcopy{top:auto;bottom:16px;padding:16px 18px}.fcopy p{font-size:14px}
  .appstage{grid-template-columns:1fr;grid-template-rows:auto 1fr;justify-items:center;align-content:start;gap:12px;padding-top:64px;text-align:center}
  .acopy{justify-self:center;order:-1}.acopy h2{font-size:21px;margin:8px 0 6px}.acopy p{font-size:14px}
  .asteps{display:none}
  .phone{--pw:min(52vh,280px)!important}
  .xcopy{top:76px;transform:none}.xcopy p{font-size:15px}
  .alerts{top:auto;bottom:16px;transform:none;left:16px;right:16px;width:auto;gap:8px}
  .al{padding:10px 12px}.al span{display:none}.al i{width:30px;height:30px;background-size:16px}
  .rec,.start{grid-template-columns:minmax(0,1fr)}
  .yi{grid-template-columns:minmax(0,1fr)}
  .hf .row,.hf .row.three{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){
  .film,.walk{height:auto!important}
  .stage{position:relative;height:auto;min-height:100vh}
  .cap p,.fl,.fb,.al,.chips span,.pass-l li,.hint i{transition:none;animation:none}
}

@media(min-width:861px){
  .copy-right .wcopy{left:auto;right:clamp(16px,5vw,80px);text-align:left}
  .copy-right .wshade{background:linear-gradient(270deg,rgba(14,17,19,.72) 0%,rgba(14,17,19,.28) 30%,rgba(14,17,19,0) 50%),linear-gradient(0deg,rgba(14,17,19,.55),rgba(14,17,19,0) 30%)}
}

.wlist{display:none;list-style:none;margin:12px 0 0;padding:0;gap:6px}
.wlist li{display:flex;flex-direction:column;padding:8px 10px 8px 28px;border-radius:10px;background:rgba(26,38,33,.7);border:1px solid rgba(143,240,180,.25);position:relative;opacity:.35;transition:opacity .4s}
.wlist li::before{content:"";position:absolute;left:10px;top:13px;width:8px;height:8px;border-radius:50%;background:var(--scan);box-shadow:0 0 8px rgba(143,240,180,.8)}
.wlist li.on{opacity:1}
.wlist b{font-size:13.5px;font-weight:600}
.wlist span{font:500 10.5px var(--mono);letter-spacing:.05em;color:#BFEFD0}
@media(max-width:860px){
  .fl{display:none}
  .wlist{display:grid}
  .wcopy{top:calc(72px + 56.25vw + 14px);bottom:auto}
  .wcopy h2{font-size:21px}
  .wcopy p{font-size:14px;margin-top:6px}
  .wshade{background:linear-gradient(180deg,rgba(14,17,19,0) 0,rgba(14,17,19,0) calc(72px + 56.25vw),var(--night) calc(72px + 56.25vw + 1px))}
  .wrail{bottom:14px}.wrail button{padding:6px 9px;font-size:10px}
}

/* label scans in the walk-through */
.fb.scan{stroke-dasharray:4 3;fill:rgba(143,240,180,.12)}
.laser{position:absolute;overflow:hidden;opacity:0;pointer-events:none;transition:opacity .4s;border-radius:4px}
.laser.on{opacity:1}
.laser i{position:absolute;left:-10%;right:-10%;height:2px;top:0;background:#8FF0B4;box-shadow:0 0 10px 3px rgba(143,240,180,.9);animation:laser 1.3s ease-in-out infinite alternate}
@keyframes laser{from{top:6%}to{top:92%}}
.fl.sc em{font:600 9.5px/1.2 var(--mono);font-style:normal;letter-spacing:.14em;text-transform:uppercase;color:#8FF0B4}
@media (prefers-reduced-motion:reduce){.laser i{animation:none;top:50%}}
@media(max-width:860px){.fl.sc em{display:none}}
@media(max-width:860px){
  .wlist.many{grid-template-columns:1fr 1fr}
  .wlist.many li{padding:7px 8px 7px 22px}
  .wlist.many li::before{left:8px;top:12px;width:7px;height:7px}
  .wlist.many b{font-size:12px;line-height:1.25}
  .wlist.many span{font-size:9.5px}
}

/* moving in */
.mshade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,17,19,.78) 0%,rgba(14,17,19,.5) 38%,rgba(14,17,19,.2) 62%,rgba(14,17,19,.55) 100%);pointer-events:none}
.mstage .acopy .k{color:var(--accent2)}
.mstage .acopy h2{color:#fff}
.mstage .acopy p{color:#D3D8DB}
.mstage .asteps{padding:12px 16px 12px 12px;border-radius:16px;background:rgba(14,17,19,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.mstage .asteps button{color:#C9D0D3;border-left-color:rgba(255,255,255,.22)}
.mstage .asteps button.on{color:#fff;border-left-color:var(--accent2)}
.m-prog{display:flex;gap:12px;align-items:center;padding:12px;border-radius:14px;background:var(--ground);border:1px solid var(--line)}
.m-prog b{display:block;font-size:13.5px}.m-prog span{font-size:11.5px;color:var(--muted)}
.m-ring{flex:none;width:58px;height:58px;border-radius:50%;display:grid;place-content:center;text-align:center;background:radial-gradient(closest-side,var(--ground) 76%,transparent 77%),conic-gradient(var(--accent) calc(var(--v)*1%),#E2DED6 0)}
.m-ring b{font:800 18px/1 var(--ui)}.m-ring small{font:600 8.5px var(--mono);color:var(--muted)}
.m-chk{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.m-chk li{position:relative;padding:9px 10px 9px 32px;border-radius:11px;border:1px solid var(--line);font-size:12.5px;font-weight:600}
.m-chk li::before{content:"";position:absolute;left:10px;top:50%;width:14px;height:14px;margin-top:-7px;border-radius:5px;border:2px solid var(--line);background:#fff}
.m-chk li.d{color:var(--muted)}.m-chk li.d::before{background:var(--accent);border-color:var(--accent)}
.m-chk li.n{border-color:var(--accent);background:rgba(15,111,106,.06)}.m-chk li.n::before{border-color:var(--accent)}
.m-clicks{display:grid;gap:8px;padding:12px;border-radius:14px;background:var(--ground);border:1px solid var(--line)}
.m-dots{display:grid;grid-template-columns:repeat(8,1fr);gap:5px}
.m-dots i{height:8px;border-radius:4px;background:#E2DED6;transition:background .25s}
.m-dots i.on{background:var(--accent)}
.m-clicks b{font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.m-ut{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.m-ut li{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:12px;border:1px solid var(--line);transition:border-color .3s,background .3s}
.m-ut i{flex:none;width:20px;height:20px;border-radius:50%;border:2px solid var(--line);transition:background .3s,border-color .3s}
.m-ut div{flex:1;min-width:0}.m-ut b{display:block;font-size:12.5px}.m-ut span{display:block;font-size:10.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m-ut em{font-style:normal;font:600 9px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);opacity:.5;transition:opacity .3s,color .3s}
.m-ut li.on{border-color:rgba(15,111,106,.45);background:rgba(15,111,106,.05)}
.m-ut li.on i{background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.3l3 3 6-6.2' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;border-color:var(--accent)}
.m-ut li.on em{opacity:1;color:var(--accent)}
.a-b.ok{background:#1E7A55}
.m-q{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;border-radius:12px;border:1px solid var(--line)}
.m-q b{display:block;font-size:13px}.m-q span{font-size:11px;color:var(--muted)}
.m-q strong{font:800 18px/1 var(--ui);letter-spacing:-.02em}.m-q strong small{font:500 10px var(--ui);color:var(--muted);margin-left:2px}
.m-q.best{border-color:var(--accent);background:rgba(15,111,106,.06);position:relative}
.m-q.best::after{content:"Best rate";position:absolute;top:-8px;right:10px;font:600 8.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;background:var(--accent);color:#fff;padding:3px 6px;border-radius:999px}
.m-f{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.m-f li{padding:8px 10px;border-radius:11px;background:var(--ground);border:1px solid var(--line)}
.m-f b{display:block;font-size:12.5px}.m-f span{font-size:11px;color:var(--muted)}
@media(max-width:860px){
  .mshade{background:linear-gradient(180deg,rgba(14,17,19,.82) 0%,rgba(14,17,19,.55) 34%,rgba(14,17,19,.35) 100%)}
}
@media (prefers-reduced-motion:reduce){.m-dots i,.m-ut li,.m-ut i,.m-ut em{transition:none}}
.scr{text-align:left}
@media(max-width:860px){
  .mstage{padding-top:82px;gap:8px}
  .mstage .acopy h2{font-size:19px;margin:6px 0 4px}
  .mstage .acopy p{font-size:13px;line-height:1.45}
  .mstage .phone{--pw:min(40vh,236px)!important}
  .mstage .scr{padding:40px 12px 14px;gap:8px}
}
/* real ETCH Home app screens, 390x844, scaled into the phone glass */
.phone .glass[data-appglass]{background:#F4F2EE}
.phone .glass .ascr{position:absolute;left:0;top:0;width:390px;height:844px;transform-origin:0 0;opacity:0;transition:opacity .45s ease}
.phone .glass .ascr.on{opacity:1}
.phone .glass[data-appglass]::before{display:none}
@media (prefers-reduced-motion:reduce){.phone .glass .ascr{transition:none}}
/* alerts as ETCH Home push notifications */
.al{border-radius:20px;background:rgba(250,250,247,.97);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);padding:13px 15px;gap:12px}
.al .al-ic{width:38px;height:38px;border-radius:9px;flex:none;display:block}
.al .al-h{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 1px}
.al .al-h strong{font:700 12.5px var(--ui);letter-spacing:.01em;color:var(--ink)}
.al .al-h small{font:500 11px var(--mono);color:var(--muted)}
.al b{font-size:14px}
@media(max-width:900px){.al .al-ic{width:30px;height:30px;border-radius:7px}.al .al-h{margin-bottom:0}}

@media(max-width:860px){#style .fl[data-dtag],#style .fl[data-mlab="0"]{display:none}}
