#offer{overflow:clip;background:#fff;padding-top:120px;padding-bottom:100px}
#offer .head{display:grid;grid-template-columns:1.2fr 1fr;gap:18px 8%;align-items:end;margin-bottom:70px}
#offer .head .label{grid-column:1/-1}#offer .head h2{font-size:clamp(55px,6.5vw,96px);line-height:1.02;margin:0;max-width:12ch}#offer .head .lede{margin:0;padding-bottom:5px}
#offer .systems{gap:34px;perspective:1400px;isolation:isolate}
#offer .split-system{border:1px solid #d3d2cf;border-radius:10px;overflow:hidden;background:#f7f6f3;transform-origin:center 35%;will-change:transform;box-shadow:0 15px 45px #0000000a}
#offer .sys .vis{height:365px;padding-top:30px;background:#ebeae6;border:0;position:relative}
#offer .sys .phone{height:335px;width:270px;background:#fff;border:1px solid #aaa;box-shadow:0 10px 35px #00000015;padding:22px 16px 0}
#offer .sys:nth-child(2){background:#151515;color:#fff;border-color:#333;--grey:#b0b0b0;--ink:#fff}
#offer .sys:nth-child(2) .vis{background:#242424}
#offer .sys:nth-child(2) .phone{background:#101010;border-color:#555;color:#fff;--paper:#101010;--panel:#303030;--ink:#fff}
#offer .sys:nth-child(2) .notif.red{background:#bd2b25;color:white}#offer .sys:nth-child(2) .notif.red b{color:#fffc}
#offer .sys .txt{padding:25px 30px 32px}#offer .sys h3{font-size:clamp(30px,3vw,43px)}#offer .sys .for{font-size:16px;line-height:1.6;margin-bottom:18px}
#offer .sys .chip{display:inline-block;margin-bottom:5px;border-color:#cac9c5}#offer .sys:nth-child(2) .chip{border-color:#505050;color:#ddd}#offer .sys:nth-child(2) a.more{color:white}#offer .sys .ch{font-size:13px}
.demo-controls{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 30px;border-bottom:1px solid #8884;font-size:11px;letter-spacing:.025em}
.system-replay{font:inherit;color:inherit;background:transparent;border:1px solid #8888;border-radius:30px;padding:10px 14px;min-height:44px;cursor:pointer}.system-replay:hover{border-color:currentColor}.system-replay:focus-visible{outline:2px solid #e43b32;outline-offset:4px}
#offer .sys .bub,#offer .sys .qr,#offer .sys .notif{will-change:transform,opacity}
body.systems-in-view>.wa{visibility:hidden;pointer-events:none}
@media(max-width:900px){#offer{padding:75px 0}#offer .head{display:block;margin-bottom:35px}#offer .head h2{font-size:56px;margin:18px 0}#offer .head .lede{font-size:17px}#offer .systems{grid-template-columns:1fr;gap:35px}#offer .sys .txt{padding:25px}#offer .sys .vis{height:365px}.demo-controls{padding:12px 25px}#offer .sys h3{font-size:35px}}
@media(prefers-reduced-motion:reduce){#offer .split-system{transform:none!important;will-change:auto}.system-replay{display:none}#offer .sys .bub,#offer .sys .qr,#offer .sys .notif{transform:none!important;opacity:1!important}}