.examples-page{--ex-bg:#0e141b;--ex-bg-2:#131b24;--ex-panel:#18222c;--ex-line:#34414d;--ex-text:#f7f8fa;--ex-muted:#a6afb8;--ex-lime:#c2fa5e;--ex-purple:#9663ff;--ex-blue:#58b9f1;background:var(--ex-bg);color:var(--ex-text)}
.examples-hero{padding:105px 0 110px;background:radial-gradient(circle at 50% 38%,#6b45aa36,transparent 35%),linear-gradient(180deg,#151d26,#0e141b);overflow:hidden}.examples-hero-copy{display:flex;align-items:center;flex-direction:column;text-align:center}.examples-hero h1{max-width:1040px;margin:26px auto 25px;font-size:clamp(62px,7vw,105px);line-height:.94;letter-spacing:-.068em}.examples-hero h1 em,.examples-hotspot h2 em{color:#ba9aff;font-style:normal}.examples-hero-copy>p{max-width:760px;color:var(--ex-muted);font-size:17px;line-height:1.72}.examples-hero-actions{display:flex;gap:12px;margin-top:33px}.examples-hero-actions .button{gap:13px}.examples-notes{display:flex;gap:25px;flex-wrap:wrap;margin-top:25px;color:#c5ccd2;font-size:11px}.examples-notes span{display:flex;align-items:center;gap:7px}.examples-notes i{color:var(--ex-lime);font-style:normal}.examples-choice{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:85px}.examples-choice>a{position:relative;min-height:365px;padding:34px;border:1px solid var(--ex-line);border-radius:25px;background:var(--ex-panel);overflow:hidden}.examples-choice>a:first-child{background:radial-gradient(circle at 85% 65%,#7251a05c,transparent 31%),var(--ex-panel)}.examples-choice>a:last-child{background:radial-gradient(circle at 82% 60%,#79a9493f,transparent 35%),var(--ex-panel)}.examples-choice>a>span{color:#929da7;font-size:9px;font-weight:800;letter-spacing:.1em}.examples-choice>a>strong{display:block;margin-top:37px;font-size:38px;line-height:1.06}.examples-choice>a>small{position:absolute;left:34px;bottom:34px;color:#b6bec5;font-size:11px}.examples-choice>a>small i{margin-left:7px;color:var(--ex-lime);font-style:normal}.examples-choice-phones{position:absolute;right:20px;bottom:-55px;width:260px;height:230px}.examples-choice-phones b{position:absolute;bottom:0;width:100px;height:205px;border:5px solid #11171d;border-radius:22px;background:linear-gradient(#d4bb91 0 32%,#f7f5f0 32%);box-shadow:0 15px 35px #0005}.examples-choice-phones b:nth-child(1){left:0;transform:rotate(-10deg)}.examples-choice-phones b:nth-child(2){left:50px;transform:rotate(-3deg);background:linear-gradient(#292929 0 32%,#3a3938 32%)}.examples-choice-phones b:nth-child(3){left:105px;transform:rotate(4deg);background:linear-gradient(#d9b069 0 32%,#fff 32%)}.examples-choice-phones b:nth-child(4){left:150px;transform:rotate(11deg);background:linear-gradient(#445b4c 0 32%,#fff 32%)}.examples-choice-signal{position:absolute;right:40px;bottom:15px;width:210px;height:210px}.examples-choice-signal i{position:absolute;border:1px solid #c2fa5e55;border-radius:50%}.examples-choice-signal i:nth-child(1){inset:0}.examples-choice-signal i:nth-child(2){inset:32px}.examples-choice-signal i:nth-child(3){inset:65px}.examples-choice-signal b{position:absolute;inset:82px;display:grid;border-radius:50%;background:var(--ex-lime);place-items:center;color:#152016;font-size:21px}
.examples-qr{background:var(--ex-bg)}.examples-section-head{display:grid;grid-template-columns:1fr .72fr;gap:85px;align-items:end;margin-bottom:55px}.examples-section-head h2{margin-top:22px;font-size:clamp(48px,5.2vw,72px);line-height:1.02;letter-spacing:-.05em}.examples-section-head>p{color:var(--ex-muted);font-size:15px;line-height:1.72}.examples-theme-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.examples-theme-card{min-width:0}.examples-theme-visual{position:relative;height:470px;padding:27px 18px 0;border:1px solid var(--ex-line);border-radius:22px;background:#1a2330;overflow:hidden}.examples-theme-card:nth-child(2) .examples-theme-visual{background:#29291f}.examples-theme-card:nth-child(3) .examples-theme-visual{background:#1e2b29}.examples-theme-card:nth-child(4) .examples-theme-visual{background:#28213c}.examples-theme-visual img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 22px 28px #05080c80);transition:transform .35s ease}.examples-theme-card:hover .examples-theme-visual img{transform:translateY(-8px) scale(1.015)}.examples-theme-visual>span{position:absolute;z-index:2;left:15px;bottom:14px;padding:7px 9px;border-radius:7px;background:#10161de8;color:#d6dde2;font-size:8px;font-weight:800;letter-spacing:.1em}.examples-theme-visual>i{position:absolute;right:15px;top:15px;padding:6px 9px;border-radius:99px;background:#c2fa5e;color:#172018;font-size:8px;font-style:normal;font-weight:800}.examples-theme-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:19px}.examples-theme-caption h3{font-size:21px}.examples-theme-caption p{margin-top:6px;color:var(--ex-muted);font-size:11px}.examples-theme-caption>b{flex-shrink:0;color:#d4dae0;font-size:10px}.examples-theme-caption>b i{margin-left:6px;color:var(--ex-lime);font-style:normal}.examples-section-foot{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:35px;padding-top:25px;border-top:1px solid var(--ex-line);color:#8d98a2;font-size:11px}.examples-section-foot a{color:#d1d8dd}.examples-section-foot a i{margin-left:7px;color:var(--ex-lime);font-style:normal}
.examples-hotspot{background:var(--ex-bg-2)}.hotspot-demo-link{display:block}.hotspot-browser{overflow:hidden;border:1px solid #3b4854;border-radius:27px;background:#f8f9fa;box-shadow:0 35px 90px #03060965;transition:transform .3s ease,border-color .3s ease}.hotspot-demo-link:hover .hotspot-browser{border-color:#718b4a;transform:translateY(-5px)}.hotspot-browser>header{height:53px;display:flex;align-items:center;gap:8px;padding:0 18px;border-bottom:1px solid #303d49;background:#18212b;color:#8f9aa5}.hotspot-browser>header>div{display:flex;gap:6px}.hotspot-browser>header i{display:block;width:8px;height:8px;border-radius:50%;background:#ef826b}.hotspot-browser>header i:nth-child(2){background:#eec760}.hotspot-browser>header i:nth-child(3){background:#67c78d}.hotspot-browser>header>span{margin-left:7px;font-size:9px}.hotspot-browser>header>b{margin-left:auto;padding:6px 9px;border-radius:7px;background:#c2fa5e14;color:var(--ex-lime);font-size:8px}.hotspot-demo-surface{display:grid;grid-template-columns:1.05fr .95fr;min-height:620px}.hotspot-cover{position:relative;display:flex;align-items:flex-end;padding:50px;overflow:hidden;background:linear-gradient(180deg,#1118201a,#101612e8),radial-gradient(circle at 70% 18%,#d6c69b4d,transparent 30%),linear-gradient(135deg,#7f5738,#233127 55%,#111820);color:#fff}.hotspot-cover:before,.hotspot-cover:after{content:"";position:absolute;border:1px solid #ffffff14;border-radius:50%}.hotspot-cover:before{right:-80px;top:20px;width:360px;height:360px}.hotspot-cover:after{right:10px;top:110px;width:180px;height:180px}.hotspot-logo{position:absolute;z-index:2;top:46px;left:50px;padding:19px 20px;border-radius:17px;background:#fff;color:#1789db;font-size:19px;font-weight:900}.hotspot-logo span{color:#1b2c56}.hotspot-cover>div{position:relative;z-index:1}.hotspot-cover small{color:#d2ff91;font-size:9px;font-weight:800;letter-spacing:.1em}.hotspot-cover h3{margin:14px 0;font-size:46px;line-height:1.02}.hotspot-cover p{max-width:500px;color:#d2d7d3;font-size:14px;line-height:1.6}.hotspot-form{display:flex;flex-direction:column;padding:48px 55px;color:#1d242b}.hotspot-form>strong{margin-bottom:17px;font-size:15px}.hotspot-form>span{margin-bottom:11px;padding:17px;border:1px solid #d8dee3;border-radius:12px;color:#8f98a0;font-size:12px}.hotspot-form>b{padding:17px;border-radius:12px;background:#1469c4;color:#fff;font-size:12px;text-align:center}.hotspot-form-links{display:flex;justify-content:space-between;margin:17px 0;color:#1471bf}.hotspot-form-links i{font-size:11px;font-style:normal}.hotspot-form article{margin-top:8px;padding:11px;border:1px solid #dce1e5;border-radius:14px;background:#fff}.hotspot-campaign-image{position:relative;height:120px;border-radius:10px;background:linear-gradient(105deg,#141c1ce6,#141c1c05),radial-gradient(circle at 75% 40%,#d0ba876b,transparent 24%),linear-gradient(135deg,#48342a,#1c352d);overflow:hidden}.hotspot-campaign-image:before{content:"";position:absolute;right:17%;bottom:-27px;width:115px;height:115px;border:17px solid #dfc99b52;border-radius:50%}.hotspot-campaign-image i{position:absolute;right:21%;bottom:22px;width:56px;height:32px;border-radius:0 0 28px 28px;background:#fff9}.hotspot-form article h4{margin:13px 0 5px;font-size:13px}.hotspot-form article p{color:#626c74;font-size:10px}.hotspot-form>small{margin-top:auto;color:#a0a8ae;font-size:9px;text-align:center}.hotspot-form>small b{color:#758089}.hotspot-demo-caption{display:flex;align-items:center;justify-content:space-between;gap:25px;padding-top:24px}.hotspot-demo-caption>div span,.hotspot-demo-caption>div strong,.hotspot-demo-caption>div small{display:block}.hotspot-demo-caption>div span{color:var(--ex-lime);font-size:8px;font-weight:800;letter-spacing:.1em}.hotspot-demo-caption>div strong{margin-top:7px;font-size:22px}.hotspot-demo-caption>div small{margin-top:5px;color:var(--ex-muted);font-size:10px}.hotspot-demo-caption>b{padding:14px 18px;border:1px solid var(--ex-line);border-radius:99px;color:#eef1f3;font-size:11px}.hotspot-demo-caption>b i{margin-left:8px;color:var(--ex-lime);font-style:normal}.hotspot-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:65px;border-block:1px solid var(--ex-line)}.hotspot-benefits article{padding:32px;border-left:1px solid var(--ex-line)}.hotspot-benefits article:last-child{border-right:1px solid var(--ex-line)}.hotspot-benefits article>span{color:var(--ex-lime);font-size:9px}.hotspot-benefits h3{margin:24px 0 10px;font-size:23px}.hotspot-benefits p{color:var(--ex-muted);font-size:12px;line-height:1.65}
.hotspot-demo-visual{position:relative;min-height:700px;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 48%,#7a50a24d,transparent 31%),radial-gradient(circle at 50% 100%,#a9e85424,transparent 36%),linear-gradient(135deg,#111922,#1b2530)}.hotspot-demo-visual:before,.hotspot-demo-visual:after{content:"";position:absolute;border:1px solid #ffffff12;border-radius:50%}.hotspot-demo-visual:before{width:570px;height:570px}.hotspot-demo-visual:after{width:760px;height:760px}.hotspot-demo-visual img{position:relative;z-index:2;width:auto;max-width:92%;height:640px;object-fit:contain;filter:drop-shadow(0 30px 45px #0009);transition:transform .35s ease}.hotspot-demo-link:hover .hotspot-demo-visual img{transform:translateY(-5px) scale(1.01)}.hotspot-demo-tag{position:absolute;z-index:3;padding:16px 18px;border:1px solid #ffffff18;border-radius:14px;background:#121a23db;box-shadow:0 18px 45px #0005;color:#8e9aa5;font-size:8px;letter-spacing:.09em;backdrop-filter:blur(12px)}.hotspot-demo-tag b{display:block;margin-top:6px;color:#f5f7f8;font-size:13px;letter-spacing:0}.hotspot-demo-tag-left{left:7%;top:24%}.hotspot-demo-tag-right{right:7%;bottom:23%}
.examples-page .hotspot-benefits article{display:block;grid-template-columns:none}.examples-page .hotspot-benefits p{width:100%;max-width:390px;margin:0;color:var(--ex-muted)}
.examples-closing{background:var(--ex-bg)}.examples-closing-card{display:grid;grid-template-columns:1fr auto;gap:70px;align-items:center;padding:52px;border:1px solid #684e8e;border-radius:27px;background:radial-gradient(circle at 85% 50%,#7343b65c,transparent 27%),linear-gradient(125deg,#20182e,#17222b)}.examples-closing-card>div>span{color:#c2a9f4;font-size:9px;font-weight:800;letter-spacing:.1em}.examples-closing h2{margin:16px 0;font-size:42px;line-height:1.05}.examples-closing p{max-width:650px;color:var(--ex-muted);font-size:14px}.examples-closing .button{gap:11px}
.example-demo-dialog{width:min(1180px,calc(100% - 40px));max-width:none;padding:0;border:0;border-radius:25px;background:#111820;color:#f7f8fa;box-shadow:0 40px 120px #000b;overflow:hidden}.example-demo-dialog::backdrop{background:#070a0dcc;backdrop-filter:blur(9px)}.example-demo-shell>header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;height:66px;padding:0 22px;border-bottom:1px solid #303c48;background:#17212b}.example-demo-heading strong,.example-demo-heading span{display:block}.example-demo-heading strong{font-size:15px}.example-demo-heading span{margin-top:3px;color:#8f99a3;font-size:9px}.example-demo-actions{display:flex;align-items:center;justify-content:flex-end;gap:16px}.example-demo-actions a{color:#c8d0d6;font-size:10px}.example-demo-actions>button{width:35px;height:35px;border:1px solid #3b4855;border-radius:50%;background:transparent;color:#fff;font-size:23px;cursor:pointer}.example-demo-device-switch{display:flex;padding:3px;border:1px solid #344351;border-radius:99px;background:#10171e}.example-demo-device-switch button{min-width:72px;padding:8px 14px;border:0;border-radius:99px;background:transparent;color:#89949e;font:inherit;font-size:10px;font-weight:700;cursor:pointer}.example-demo-device-switch button.is-active{background:#c2fa5e;color:#132016}.example-demo-stage{position:relative;height:min(78vh,900px);display:grid;place-items:center;padding:18px;background:radial-gradient(circle at 50% 50%,#cfd5dc,#e8ebee 62%);overflow:hidden}.example-demo-stage>span{position:absolute;z-index:4;left:50%;top:50%;padding:9px 13px;border-radius:99px;background:#fff;color:#67717b;font-size:11px;box-shadow:0 8px 25px #1d293533;transform:translate(-50%,-50%)}.example-demo-viewport{position:relative;z-index:2;overflow:hidden;transition:width .3s ease,height .3s ease,border-radius .3s ease,padding .3s ease}.example-demo-stage.is-mobile .example-demo-viewport{width:min(420px,100%);height:100%;padding:17px 9px 9px;border:1px solid #333b43;border-radius:42px;background:#171b20;box-shadow:0 22px 65px #26313c45}.example-demo-stage.is-mobile .example-demo-viewport:before{content:"";position:absolute;z-index:3;top:7px;left:50%;width:74px;height:20px;border-radius:99px;background:#07090b;transform:translateX(-50%);pointer-events:none}.example-demo-stage.is-mobile iframe{border-radius:31px}.example-demo-stage.is-desktop{padding:0}.example-demo-stage.is-desktop .example-demo-viewport{width:100%;height:100%;padding:0;border-radius:0;background:#fff}.example-demo-stage iframe{display:block;width:100%;height:100%;border:0;background:#fff;opacity:1;transition:opacity .25s}.example-demo-stage.is-loading iframe{opacity:0}
html[data-theme="light"] .examples-page{--ex-bg:#fff;--ex-bg-2:#f3f5f7;--ex-panel:#fff;--ex-line:#d9e1e7;--ex-text:#1e252c;--ex-muted:#66717a;background:#fff;color:var(--ex-text)}html[data-theme="light"] .examples-hero{background:radial-gradient(circle at 50% 38%,#dfd1f4,transparent 35%),#f2f5f6}html[data-theme="light"] .examples-notes{color:#4f5962}html[data-theme="light"] .examples-choice>a{box-shadow:0 20px 60px #26344312}html[data-theme="light"] .examples-choice>a:first-child{background:radial-gradient(circle at 85% 65%,#d8c6ef,transparent 31%),#fff}html[data-theme="light"] .examples-choice>a:last-child{background:radial-gradient(circle at 82% 60%,#d6e9b7,transparent 35%),#fff}html[data-theme="light"] .examples-theme-visual{border-color:#cfd8df}html[data-theme="light"] .examples-theme-caption>b,html[data-theme="light"] .examples-section-foot a,html[data-theme="light"] .hotspot-demo-caption>b{color:#39444d}html[data-theme="light"] .examples-hotspot{background:#f3f5f7}html[data-theme="light"] .examples-closing{background:#fff}html[data-theme="light"] .examples-closing-card{color:#fff}html[data-theme="light"] .examples-closing-card p{color:#c9c1d3}
@media(max-width:1050px){.examples-theme-grid{grid-template-columns:1fr 1fr}.examples-theme-visual{height:540px}.hotspot-demo-surface{min-height:560px}.hotspot-cover,.hotspot-form{padding:38px}.hotspot-cover h3{font-size:38px}}
@media(max-width:780px){.examples-hero{padding:75px 0 85px}.examples-choice,.examples-section-head{grid-template-columns:1fr}.examples-choice{margin-top:65px}.examples-section-head{gap:25px}.hotspot-demo-surface{grid-template-columns:1fr}.hotspot-cover{min-height:460px}.hotspot-form{min-height:560px}.hotspot-demo-visual{min-height:620px}.hotspot-demo-visual img{height:570px}.hotspot-demo-tag{display:none}.hotspot-benefits{grid-template-columns:1fr}.hotspot-benefits article{border-top:1px solid var(--ex-line);border-right:1px solid var(--ex-line)}.hotspot-benefits article:first-child{border-top:0}.examples-closing-card{grid-template-columns:1fr;gap:30px}.examples-closing-card .button{justify-self:start}}
@media(max-width:560px){.examples-hero h1{font-size:43px}.examples-hero-copy>p{font-size:15px}.examples-hero-actions{width:100%;flex-direction:column}.examples-hero-actions .button{width:100%}.examples-notes{align-items:flex-start;flex-direction:column;gap:8px}.examples-choice>a{min-height:330px;padding:26px}.examples-choice>a>strong{font-size:31px}.examples-choice>a>small{left:26px;bottom:25px}.examples-choice-phones{right:-30px;width:220px}.examples-choice-signal{right:-5px;bottom:25px;width:175px;height:175px}.examples-choice-signal b{inset:68px}.examples-section-head h2{font-size:39px}.examples-theme-grid{grid-template-columns:1fr}.examples-theme-visual{height:515px;padding-inline:28px}.examples-theme-caption h3{font-size:20px}.examples-section-foot,.hotspot-demo-caption{align-items:flex-start;flex-direction:column}.hotspot-browser>header>span{display:none}.hotspot-demo-surface{display:block}.hotspot-cover{min-height:390px;padding:30px 24px}.hotspot-logo{left:24px;top:28px}.hotspot-cover h3{font-size:35px}.hotspot-form{min-height:535px;padding:32px 22px}.hotspot-demo-visual{min-height:545px}.hotspot-demo-visual img{height:510px}.hotspot-demo-caption>b{width:100%;text-align:center}.hotspot-benefits{margin-top:45px}.examples-closing-card{padding:29px 23px}.examples-closing h2{font-size:34px}.examples-closing .button{width:100%;font-size:11px;text-align:center}.example-demo-dialog{width:100%;height:100%;border-radius:0}.example-demo-stage{height:calc(100vh - 66px)}}
.example-demo-stage.is-mobile .example-demo-viewport{width:min(390px,calc(38.22vh - 15px),calc(100% - 24px));height:min(720px,calc(100% - 24px))}
.example-demo-dialog{transition:width .3s ease}.example-demo-dialog.is-mobile-preview{width:min(500px,calc(100% - 30px))}.example-demo-dialog.is-mobile-preview .example-demo-shell>header{height:104px;grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:8px 14px;padding:11px 16px}.example-demo-dialog.is-mobile-preview .example-demo-heading{grid-column:1;grid-row:1}.example-demo-dialog.is-mobile-preview .example-demo-actions{grid-column:2;grid-row:1}.example-demo-dialog.is-mobile-preview .example-demo-device-switch{grid-column:1/-1;grid-row:2;justify-self:center}.example-demo-dialog.is-mobile-preview .example-demo-stage{height:min(75vh,780px);padding:12px}.example-demo-dialog.is-mobile-preview .example-demo-stage.is-mobile .example-demo-viewport{width:min(390px,calc(36.75vh - 14px),calc(100% - 18px));height:min(720px,calc(100% - 18px))}
.example-demo-stage.is-mobile iframe{position:absolute;top:17px;left:9px;width:430px;height:932px;transform:scale(var(--device-scale,1));transform-origin:top left}.example-demo-stage.is-desktop iframe{position:static;width:100%;height:100%;transform:none}
.example-demo-stage.is-mobile .example-demo-viewport{max-width:calc(100% - 24px);max-height:calc(100% - 24px);border-radius:clamp(34px,11%,42px)}.example-demo-stage.is-mobile .example-demo-viewport:before{width:clamp(58px,22%,74px)}
.example-demo-stage:not(.is-loading)>span{display:none}