.header-actions>.pill,.hero-copy>.pill{justify-content:center;padding:14px 25px;gap:0}.header-actions>.pill.small{padding:12px 20px;min-height:42px}.about-contact .telegram-contact{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;flex:none}.about-contact .telegram-icon{width:38px;height:38px}.contact-form>.pill{width:max-content;max-width:100%;justify-self:center;justify-content:center;padding:14px 24px;min-height:48px;font-size:13px}.footer>p:last-child{margin-left:auto}.phone{overflow:visible;padding:8px;border-radius:39px;border:1px solid #a0a7b1;background:linear-gradient(112deg,#dce1e7 0%,#7f8996 1%,#353b45 2%,#11151c 5%,#0a0d12 87%,#747e8b 98%,#c4cbd2 100%);box-shadow:inset 0 0 0 2px #353d48,inset 0 0 0 4px #06090e,9px 5px 0 -3px #454c57,12px 6px 0 -3px #171d26,18px 23px 32px #11172433,4px 5px 8px #11172440;isolation:isolate}.phone:before{content:'';position:absolute;top:25%;left:-3px;width:3px;height:20%;border-radius:2px;background:linear-gradient(to bottom,#b6bec8 0 14%,transparent 14% 24%,#818b99 24% 53%,transparent 53% 66%,#818b99 66% 97%,transparent 97%);box-shadow:0 1px 1px #0003;pointer-events:none}.phone:after{inset:3px;border:1px solid #d1d9e54a;border-right-color:#edf3ff88;border-radius:36px;background:linear-gradient(110deg,#ffffff09 0%,transparent 27%,transparent 75%,#ffffff0b 100%);z-index:5;pointer-events:none}.phone-screen{border-radius:31px;box-shadow:inset 0 0 0 1px #0008}.phone-screen:after{content:'';position:absolute;width:29%;height:3px;border-radius:8px;background:currentColor;opacity:.65;bottom:5px;left:35.5%;pointer-events:none;z-index:4}.phone-notch{top:9px;left:32%;width:36%;height:18px;border-radius:16px;background:linear-gradient(#04060a,#12161d);box-shadow:0 0 0 1px #222833;z-index:4}.phone-notch:after{content:'';position:absolute;width:7px;height:7px;right:7px;top:5px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#254778,#101c32 45%,#05080d 75%);box-shadow:0 0 0 1px #303747}.phone-status{padding:14px 13px 10px;min-height:36px;align-items:center}.phone-status>span{letter-spacing:.4px}.hero-phone{transform:perspective(900px) rotateY(-11deg) rotateZ(-9deg);padding:8px;border-radius:39px}.hero-art:hover .hero-phone{transform:perspective(900px) rotateY(-7deg) rotateZ(-7deg) translateY(-5px)}.hero-phone .phone-screen{border-radius:31px}.bot-phone,.app-phone{padding:8px;border-radius:37px;box-shadow:inset 0 0 0 2px #3a4350,inset 0 0 0 4px #080b11,7px 3px 0 -3px #47505c,10px 5px 0 -3px #151c27,15px 20px 24px #11172430,3px 5px 8px #0003;transform:perspective(1100px) rotateY(-7deg) rotateZ(-1deg)}.app-phone{transform:perspective(1100px) rotateY(7deg) rotateZ(1deg)}.bot-phone .phone-screen,.app-phone .phone-screen{border-radius:29px}.bot-header{padding-top:9px}.phone-appbar{padding-top:8px}.move-phone{padding:8px;border-radius:37px}.move-phone .phone-screen{border-radius:29px}.flow-mini,.flow-auto{width:120px;height:116px;margin:-45px auto 0;padding:0;border:0;border-radius:0;outline:0;background:transparent;box-shadow:none;display:block}.flow-mini svg,.flow-auto svg{display:block;width:100%;height:100%;filter:drop-shadow(4px 7px 5px #17254412)}.integration-workflow{max-width:310px;margin:36px auto 22px;padding:17px 14px 14px;border:1px solid #d7deea;border-radius:19px;background:linear-gradient(145deg,#fff,#f3f5fa);box-shadow:7px 10px 0 -3px #dee3ed,12px 21px 27px #24335312;transform:perspective(700px) rotateY(-6deg) rotateZ(-3deg);color:#17213b}.workflow-topline{display:flex;align-items:center;gap:4px;padding-bottom:18px}.workflow-topline>span{width:5px;height:5px;border-radius:50%;background:#cbd3e0}.workflow-topline b{margin-left:auto;font-size:9px;font-weight:500;color:#6f7b91}.workflow-route{display:flex;align-items:center;justify-content:center;padding:10px 0 20px}.workflow-node{width:28%;display:flex;flex-direction:column;align-items:center;gap:9px}.workflow-node svg{width:46px;height:46px;padding:5px;border-radius:12px;background:#e7ecff}.workflow-node.is-primary svg{background:#2447d8}.workflow-node>span{font-size:9px;white-space:nowrap}.workflow-connector{width:10%;height:1px;background:#a8b6d5;margin-top:-21px}.workflow-result{display:flex;gap:8px;align-items:center;border-top:1px solid #dfe5ef;padding-top:12px;font-size:9px}.workflow-check{width:17px;height:17px;display:grid;place-items:center;border-radius:50%;background:#e2f3e9;color:#29895e;font-weight:bold}.workflow-status-dot{width:5px;height:5px;border-radius:50%;background:#48a67a;margin-left:auto}.auto-service .automation-details{margin-top:31px}.flow-status{min-height:1.5em}@media(min-width:801px){.service .integration-workflow{margin-top:55px;margin-bottom:35px}}@media(max-width:800px){.hero-phone{border-radius:36px}.hero-phone .phone-screen{border-radius:28px}.phone:after{border-radius:33px}.flow-mini,.flow-auto{width:103px;height:103px;margin-top:-44px}.footer>p:last-child{margin-left:0}.integration-workflow{margin:45px auto 29px}}@media(max-width:480px){.hero .pill{padding:13px 23px}.hero-phone{padding:7px;border-radius:32px}.hero-phone .phone-screen{border-radius:25px}.hero-phone:after{border-radius:29px}.hero-phone .phone-notch{top:8px;height:15px;left:30%;width:40%}.hero-phone .phone-notch:after{height:6px;width:6px;top:4px;right:6px}.hero-phone .phone-status{padding-top:12px;padding-bottom:8px;min-height:32px}.bot-phone,.app-phone{border-radius:37px}.flow-mini,.flow-auto{width:94px;height:94px;margin-top:-40px}.contact-form>.pill{padding:13px 20px;font-size:12px}.about-contact{gap:10px}.workflow-node svg{width:52px;height:52px}}
.auto-card{display:flex;align-items:center;gap:7px}.auto-card svg{display:block;width:16px;height:16px;flex:none}.auto-card:last-of-type svg{width:15px;height:15px}

/* Keep the device proportions independent of the hero composition height. */
.hero-phone{transform:perspective(1100px) translateY(14px) rotateY(-7deg) rotateZ(-1deg)}
.hero-art:hover .hero-phone{transform:perspective(1100px) translateY(14px) rotateY(-7deg) rotateZ(-1deg)}
@media(min-width:801px) and (max-width:1599px){.hero-phone{transform:perspective(1100px) translateY(8px) rotateY(-7deg) rotateZ(-1deg)}.hero-art:hover .hero-phone{transform:perspective(1100px) translateY(8px) rotateY(-7deg) rotateZ(-1deg)}}
@media(max-width:800px){.hero-phone{transform:perspective(1100px) translateY(0) rotateY(-7deg) rotateZ(-1deg)}.hero-art:hover .hero-phone{transform:perspective(1100px) translateY(0) rotateY(-7deg) rotateZ(-1deg)}}
.hero-phone{width:37%;max-width:260px;height:auto;max-height:none;aspect-ratio:9/19.5;top:5%}
.app-phone{transform:perspective(1100px) rotateY(-7deg) rotateZ(-1deg)}
.menu-screen{background:#fcfaf6;color:#2d251f;display:flex;flex-direction:column;padding-bottom:17px}
.menu-screen .phone-status{font-size:8px;flex:none}
.menu-appbar{display:flex;align-items:center;justify-content:space-between;padding:5px 13px 10px;font-size:18px}
.menu-appbar>b{font-size:17px;letter-spacing:-.065em;line-height:1}
.menu-appbar>b>span{display:block;font-size:6px;letter-spacing:.04em;font-weight:500;margin-top:4px;color:#8a7e72}
.menu-heading{padding:9px 13px 12px}
.menu-heading>small{display:block;font-size:7px;line-height:1.4;color:#8a7e72;margin-bottom:7px}
.menu-heading h2{font-size:27px;line-height:1.02;letter-spacing:-.055em;margin:0}
.menu-heading h3{font-size:26px;line-height:1;letter-spacing:-.05em;margin:0}
.menu-feature{position:relative;background:#ece2d5;border-radius:14px;margin:0 12px 10px;padding:7px 10px 10px;min-height:130px}
.menu-feature>svg{display:block;width:100%;height:99px}
.menu-feature>span{display:block;font-size:9px;font-weight:650}
.menu-feature>span>small{display:block;font-size:6px;color:#8a7e72;margin-top:3px;font-weight:400}
.menu-feature>b{position:absolute;right:10px;bottom:17px;font-size:9px}
.menu-categories{display:flex;gap:4px;padding:0 12px 10px;flex:none}
.menu-categories>span{flex:1;text-align:center;padding:7px 3px;font-size:7px;border:1px solid #e7e0d6;border-radius:20px;color:#817268}
.menu-categories>.is-selected{color:#fff;background:#352d28;border-color:#352d28}
.menu-products{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:0 12px 9px;flex:none}
.menu-product{background:#fff;border:1px solid #eee7de;border-radius:11px;padding:7px;position:relative}
.menu-product-art{background:#f0e9df;border-radius:7px;margin-bottom:7px}
.menu-product-art>svg{display:block;width:100%;height:58px}
.menu-product>b{display:block;font-size:9px}
.menu-product>small{display:block;font-size:6px;color:#918479;margin:4px 0 7px}
.menu-product>strong{font-size:10px;display:block}
.menu-order{display:flex;align-items:center;justify-content:space-between;margin:auto 13px 8px;font-size:9px}
.menu-order>span>small{display:block;font-size:6px;color:#918479;margin-top:3px}
.menu-order-button{background:#352d28;color:#fff;text-align:center;font-size:9px;font-weight:550;padding:11px 5px;border-radius:10px;margin:0 12px 5px}
.menu-actions{display:grid;gap:5px;margin:3px 12px 0}
.menu-actions>button{background:#f0e9df;border:1px solid #e7e0d6;border-radius:9px;padding:9px 10px;display:flex;justify-content:space-between;font-size:9px;text-align:left}
.menu-actions>button:hover{background:#e7dccd}
.menu-actions>button:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.menu-screen .app-feedback{padding:0 12px;margin:9px 0 0;color:#8a7e72;font-size:8px;line-height:1.45}
.auto-service .automation-details{margin-top:0}
@media(max-width:1100px) and (min-width:801px){.hero-phone{width:40%;top:1%}.menu-heading h2{font-size:24px}.hero-menu .menu-feature{min-height:112px}.hero-menu .menu-feature>svg{height:82px}.hero-menu .menu-product-art>svg{height:42px}}
@media(max-width:800px){.hero-phone{width:40%;top:0}.menu-feature{min-height:112px}.menu-feature>svg{height:82px}.hero-menu .menu-heading{padding-top:3px;padding-bottom:9px}.hero-menu .menu-heading h2{font-size:23px}.hero-menu .menu-products{display:none}.hero-menu .menu-order{margin-top:auto}.hero-menu .menu-categories>span{font-size:6px}.menu-screen .app-feedback{font-size:9px}}
@media(max-width:480px){.hero-phone{width:44%;top:5%}.hero-menu .menu-heading h2{font-size:23px}.hero-menu .menu-heading>small{font-size:6px}.hero-menu .menu-feature{min-height:105px}.hero-menu .menu-feature>svg{height:76px}.hero-menu .menu-appbar{padding-bottom:7px}.hero-menu .menu-order-button{padding:9px 4px;font-size:8px}.hero-menu .menu-feature>b{font-size:8px}.hero-menu .menu-feature>span{font-size:8px}.hero-menu .menu-feature>span>small{font-size:5px}.hero-menu .menu-categories{padding-bottom:9px}.app-phone .menu-product-art>svg{height:72px}.app-phone .menu-actions>button{font-size:10px;padding:10px}.app-phone .menu-heading{padding-top:12px;padding-bottom:15px}.app-phone .menu-heading h3{font-size:28px}}
.app-phone .menu-appbar{padding-top:0;padding-bottom:5px;line-height:1.1}
.app-phone .menu-heading{padding-top:3px;padding-bottom:7px}
.app-phone .menu-product-art>svg{height:44px}
.app-phone .menu-actions>button{padding:7px 10px}
.app-phone .app-feedback{min-height:24px;margin-top:6px}
@media(max-width:480px){.app-phone .menu-product-art>svg{height:56px}.app-phone .menu-actions>button{padding:8px 10px}}
@media(max-width:480px){.hero-menu{padding-bottom:14px}.hero-menu .menu-appbar{line-height:1;font-size:16px;padding-top:3px;padding-bottom:5px}.hero-menu .menu-appbar>b{font-size:15px}.hero-menu .menu-appbar>b>span{font-size:5px;margin-top:3px}.hero-menu .menu-heading{padding-bottom:7px}.hero-menu .menu-heading h2{font-size:21px}.hero-menu .menu-heading>small{font-size:5.8px;margin-bottom:3px}.hero-menu .menu-feature{min-height:94px}.hero-menu .menu-feature>svg{height:65px}.hero-menu .menu-categories>span{padding:5px 2px}.hero-menu .menu-order-button{padding:8px 4px}.app-phone .menu-product-art>svg{height:50px}.app-phone .menu-actions>button{padding:7px 10px}.app-phone .menu-heading h3{font-size:26px}}
.menu-screen{container-type:inline-size}
@container(max-width:195px){.hero-menu .menu-appbar{line-height:1;font-size:16px;padding-top:3px;padding-bottom:5px}.hero-menu .menu-appbar>b{font-size:15px}.hero-menu .menu-heading{padding-top:3px;padding-bottom:7px}.hero-menu .menu-heading>small{display:none}.hero-menu .menu-heading h2{font-size:21px}.hero-menu .menu-feature{min-height:84px}.hero-menu .menu-feature>svg{height:54px}.hero-menu .menu-categories>span{padding:5px 2px;font-size:6px}.hero-menu .menu-order-button{padding:8px 4px;font-size:8px}.app-phone .menu-product-art>svg{height:32px}.app-phone .menu-heading h3{font-size:23px}.app-phone .menu-actions>button{padding:6px 10px}}
