{"id":18,"date":"2026-07-01T23:37:02","date_gmt":"2026-07-01T20:37:02","guid":{"rendered":"https:\/\/www.staging.switchpoint.com.ua\/?page_id=18"},"modified":"2026-07-02T22:16:17","modified_gmt":"2026-07-02T19:16:17","slug":"%d0%b3%d0%be%d0%bb%d0%be%d0%b2%d0%bd%d0%b0","status":"publish","type":"page","link":"https:\/\/www.staging.switchpoint.com.ua\/","title":{"rendered":"\u0413\u043e\u043b\u043e\u0432\u043d\u0430"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"18\" class=\"elementor elementor-18\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4f2297b e-con e-atomic-element e-flexbox-base e-0de93eb \" data-id=\"4f2297b\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"4f2297b\">\n    \t\t<div class=\"elementor-element elementor-element-28aebd4 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"28aebd4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n     SWITCH POINT \u2014 \u0411\u043b\u043e\u043a: \u0411\u0430\u043d\u0435\u0440 (3 \u0441\u043b\u0430\u0439\u0434\u0438) \u2014 v2, \u0441\u043b\u0430\u0439\u0434-\u0442\u0440\u0430\u043d\u0437\u0438\u0448\u043d\r\n     \u0421\u043b\u0430\u0439\u0434 1: Slim Series \u00b7 \u0421\u043b\u0430\u0439\u0434 2: Ultra Slim Series \u00b7\r\n     \u0421\u043b\u0430\u0439\u0434 3: \u0417\u0440\u0443\u0447\u043d\u0430 \u043e\u043f\u043b\u0430\u0442\u0430 (Monobank \/ PrivatBank).\r\n\r\n     \u0429\u041e\u0411 \u0412\u0421\u0422\u0410\u0412\u0418\u0422\u0418 \u0424\u041e\u0422\u041e: \u0443 \u043a\u043e\u0436\u043d\u043e\u0433\u043e \u0441\u043b\u0430\u0439\u0434\u0443 \u0454 \u0441\u0432\u043e\u044f \u0441\u0442\u0440\u043e\u0447\u043a\u0430\r\n     style=\"background-image:url(...)\" \u043f\u0440\u044f\u043c\u043e \u0432 \u0442\u0435\u0437\u0456 <div class=\"sp-slide\" ...>\r\n     \u2014 \u0437\u0430\u043c\u0456\u043d\u0438 \u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_\u041d\u0410_\u0424\u041e\u0422\u041e_1\/2\/3 \u043d\u0430 \u0441\u0432\u043e\u044e \u0430\u0434\u0440\u0435\u0441\u0443 (\u0431\u0435\u0437 \u043b\u0430\u043f\u043e\u043a).\r\n\r\n     \u0429\u041e\u0411 \u0412\u0421\u0422\u0410\u0412\u0418\u0422\u0418 \u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f \u041a\u041d\u041e\u041f\u041a\u0418: \u043a\u043e\u0436\u0435\u043d \u0441\u043b\u0430\u0439\u0434 \u043f\u043e\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u043a\u043e\u043c\u0435\u043d\u0442\u0430\u0440\u0435\u043c\r\n     \"\u0421\u041b\u0410\u0419\u0414 1\/2\/3\" \u2014 \u0443\u0441\u0435\u0440\u0435\u0434\u0438\u043d\u0456 \u0448\u0443\u043a\u0430\u0439 href=\"\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_\u0414\u041b\u042f_\u041a\u041d\u041e\u041f\u041a\u0418_...\"\r\n     \u0456 \u0437\u0430\u043c\u0456\u043d\u0438 \u043d\u0430 \u043f\u043e\u0442\u0440\u0456\u0431\u043d\u0443 \u0430\u0434\u0440\u0435\u0441\u0443 (\u043d\u0430\u043f\u0440\u0438\u043a\u043b\u0430\u0434, \u043f\u043e\u0441\u0438\u043b\u0430\u043d\u043d\u044f \u043d\u0430 \u043a\u0430\u0442\u0430\u043b\u043e\u0433\/\u0440\u043e\u0437\u0434\u0456\u043b).\r\n     ============================================================ -->\r\n<div class=\"sp-banner-block\">\r\n<style>\r\n  .sp-banner-block {\r\n    --g-graphite: #252A30;\r\n    --g-blue: #248FD6;\r\n    --g-deep: #123E5D;\r\n    --side-pad: max(32px, calc((100vw - 1440px) \/ 2 + 32px));\r\n\r\n    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\r\n    width: 100vw;\r\n    margin-left: calc(50% - 50vw);\r\n    overflow-x: hidden;\r\n    position: relative;\r\n  }\r\n  .sp-banner-block *, .sp-banner-block *::before, .sp-banner-block *::after { box-sizing: border-box; }\r\n  .sp-banner-block h1 { font-family: 'Manrope', sans-serif; margin: 0; }\r\n  .sp-banner-block :focus-visible { outline: 2px solid var(--g-blue); outline-offset: 3px; }\r\n\r\n  .sp-btn { display: inline-flex; align-items: center; gap: 8px; background: var(--g-blue); color: #fff; font-weight: 600; font-size: 14px; padding: 13px 24px; border-radius: 6px; text-decoration: none; border: 1px solid var(--g-blue); transition: background .2s ease, transform .2s ease; white-space: nowrap; }\r\n  .sp-btn:hover { background: var(--g-deep); border-color: var(--g-deep); transform: translateY(-1px); }\r\n  .sp-btn--outline { background: transparent; color: #fff; border-color: rgba(255,255,255,0.6); }\r\n  .sp-btn--outline:hover { background: rgba(255,255,255,0.14); border-color: #fff; transform: none; }\r\n\r\n  \/* ---------- \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440 + \u0441\u043b\u0430\u0439\u0434-\u0442\u0440\u0435\u043a ---------- *\/\r\n  .sp-hero { position: relative; min-height: 560px; overflow: hidden; }\r\n  .sp-track {\r\n    display: flex;\r\n    min-height: 560px;\r\n    width: 300%; \/* 3 \u0441\u043b\u0430\u0439\u0434\u0438 \u00d7 100% *\/\r\n    transition: transform 0.9s cubic-bezier(.65,0,.35,1);\r\n    will-change: transform;\r\n  }\r\n  .sp-slide {\r\n    flex: 0 0 33.3334%;\r\n    width: 33.3334%;\r\n    min-height: 560px;\r\n    position: relative;\r\n    display: flex;\r\n    align-items: center;\r\n    background-size: cover;\r\n    background-position: center;\r\n  }\r\n  .sp-slide { background-color: #1c1d20; }\r\n\r\n  .sp-slide::before {\r\n    content: '';\r\n    position: absolute; inset: 0;\r\n    background: none;\r\n    z-index: 1;\r\n  }\r\n  .sp-slide__content { position: relative; z-index: 2; padding: 0 var(--side-pad); color: #fff; width: 100%; text-shadow: 0 2px 12px rgba(0,0,0,0.55), 0 1px 3px rgba(0,0,0,0.6); }\r\n  .sp-slide__kicker { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.85); }\r\n  .sp-slide__kicker i { width: 18px; height: 2px; background: var(--g-blue); }\r\n  .sp-slide__title { font-size: clamp(28px, 3.6vw, 46px); font-weight: 800; line-height: 1.16; margin-bottom: 16px; max-width: 560px; color: #fff !important; }\r\n  .sp-slide__text { font-size: 16px; line-height: 1.6; color: rgba(255,255,255,0.78); max-width: 440px; margin-bottom: 30px; }\r\n  .sp-slide__ctas { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }\r\n\r\n  .sp-bank-badges { display: flex; gap: 10px; margin-top: 22px; flex-wrap: wrap; }\r\n  .sp-bank-badge {\r\n    display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px;\r\n    background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.22);\r\n    border-radius: 8px; font-size: 13px; font-weight: 600; color: #fff;\r\n  }\r\n  .sp-bank-badge svg { width: 15px; height: 15px; color: var(--g-blue); display: block; }\r\n\r\n  \/* ---------- \u0441\u0442\u0440\u0456\u043b\u043a\u0438 \u2014 \u043f\u043e\u0432\u043d\u0438\u0439 \u0440\u0435\u0441\u0435\u0442 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043d\u0438\u0445 \u0441\u0442\u0438\u043b\u0456\u0432 \u043a\u043d\u043e\u043f\u043a\u0438 ---------- *\/\r\n  .sp-hero__arrow {\r\n    all: unset;\r\n    box-sizing: border-box;\r\n    position: absolute; top: 50%;\r\n    transform: translateY(-50%);\r\n    width: 44px; height: 44px;\r\n    border-radius: 50%;\r\n    background: rgba(10,11,13,0.4);\r\n    border: 1px solid rgba(255,255,255,0.35);\r\n    display: flex; align-items: center; justify-content: center;\r\n    cursor: pointer; color: #fff; z-index: 6;\r\n    transition: background .2s ease, border-color .2s ease;\r\n  }\r\n  .sp-hero__arrow svg { width: 18px; height: 18px; display: block; pointer-events: none; }\r\n  .sp-hero__arrow:hover { background: var(--g-blue); border-color: var(--g-blue); }\r\n  .sp-hero__arrow:focus-visible { outline: 2px solid var(--g-blue); outline-offset: 3px; }\r\n  .sp-hero__arrow--prev { left: 20px; }\r\n  .sp-hero__arrow--next { right: 20px; }\r\n\r\n  .sp-hero__dots { position: absolute; bottom: 26px; left: 0; right: 0; display: flex; justify-content: center; gap: 8px; z-index: 6; }\r\n  .sp-hero__dot { all: unset; box-sizing: border-box; width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.4); cursor: pointer; transition: width .2s ease, background .2s ease; }\r\n  .sp-hero__dot.is-active { background: var(--g-blue); width: 22px; border-radius: 4px; }\r\n\r\n  @media (max-width: 700px) {\r\n    .sp-hero { min-height: 500px; }\r\n    .sp-track { min-height: 500px; }\r\n    .sp-slide { min-height: 500px; align-items: flex-end; padding-bottom: 64px; }\r\n    .sp-slide[data-slide] { background-position: 65% center; }\r\n    .sp-slide::before {\r\n      background: none;\r\n    }\r\n    .sp-slide__content { padding: 0 20px; }\r\n    .sp-slide__title { max-width: 100%; font-size: clamp(24px, 6vw, 30px); margin-bottom: 12px; }\r\n    .sp-slide__text { max-width: 100%; font-size: 14px; margin-bottom: 22px; }\r\n    .sp-slide__kicker { margin-bottom: 12px; font-size: 11px; }\r\n    .sp-btn { width: 100%; justify-content: center; padding: 14px 20px; }\r\n    .sp-slide__ctas { flex-direction: column; align-items: stretch; gap: 10px; }\r\n    .sp-bank-badges { margin-top: 16px; }\r\n    .sp-bank-badge { font-size: 12px; padding: 7px 12px; }\r\n    .sp-hero__arrow { display: none; }\r\n    .sp-hero__dots { bottom: 18px; gap: 10px; }\r\n    .sp-hero__dot { width: 7px; height: 7px; padding: 8px; background-clip: content-box; box-sizing: content-box; margin: -8px; }\r\n    .sp-hero__dot.is-active { width: 18px; }\r\n  }\r\n  @media (max-width: 420px) {\r\n    .sp-hero { min-height: 460px; }\r\n    .sp-track { min-height: 460px; }\r\n    .sp-slide { min-height: 460px; padding-bottom: 56px; }\r\n    .sp-slide__title { font-size: 22px; }\r\n  }\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .sp-track { transition: none; }\r\n  }\r\n<\/style>\r\n\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@700;800&family=Inter:wght@400;500;600&display=swap\" rel=\"stylesheet\">\r\n\r\n<section class=\"sp-hero\" id=\"spHeroViewport\">\r\n  <div class=\"sp-track\" id=\"spTrack\">\r\n\r\n    <!-- ===== \u0421\u041b\u0410\u0419\u0414 1 \u2014 Slim Series ===== -->\r\n    <div class=\"sp-slide\" data-slide=\"0\" style=\"background-image:url(https:\/\/www.staging.switchpoint.com.ua\/wp-content\/uploads\/2026\/07\/3cce6d94-ba8c-43bb-afaf-121cef277be5.png);\">\r\n      <div class=\"sp-slide__content\">\r\n        <div class=\"sp-slide__kicker\"><i><\/i>Slim Series<\/div>\r\n        <h1 class=\"sp-slide__title\">\u0422\u043e\u043d\u043a\u0456 \u0440\u0430\u043c\u043a\u0438 \u0434\u043b\u044f \u0447\u0438\u0441\u0442\u0438\u0445 \u0456\u043d\u0442\u0435\u0440'\u0454\u0440\u0456\u0432<\/h1>\r\n        <p class=\"sp-slide__text\">\u041c\u0456\u043d\u0456\u043c\u0430\u043b\u044c\u043d\u0430 \u0442\u043e\u0432\u0449\u0438\u043d\u0430 \u0440\u0430\u043c\u043a\u0438 \u0442\u0430 \u0433\u0440\u0430\u0444\u0456\u0442\u043e\u0432\u0435 \u043f\u043e\u043a\u0440\u0438\u0442\u0442\u044f \u2014 \u0432\u0438\u043c\u0438\u043a\u0430\u0447\u0456, \u044f\u043a\u0456 \u043d\u0435 \u0432\u0456\u0434\u0432\u043e\u043b\u0456\u043a\u0430\u044e\u0442\u044c \u0443\u0432\u0430\u0433\u0443 \u0432\u0456\u0434 \u043f\u0440\u043e\u0441\u0442\u043e\u0440\u0443.<\/p>\r\n        <div class=\"sp-slide__ctas\">\r\n          <a href=\"\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_\u0414\u041b\u042f_\u041a\u041d\u041e\u041f\u041a\u0418_1\" class=\"sp-btn\">\u041f\u0435\u0440\u0435\u0433\u043b\u044f\u043d\u0443\u0442\u0438 \u043a\u043e\u043b\u0435\u043a\u0446\u0456\u044e<\/a>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- ===== \u0421\u041b\u0410\u0419\u0414 2 \u2014 Ultra Slim Series ===== -->\r\n    <div class=\"sp-slide\" data-slide=\"1\" style=\"background-image:url(https:\/\/www.staging.switchpoint.com.ua\/wp-content\/uploads\/2026\/07\/\u0414\u0438\u0437\u0430\u0439\u043d-\u0431\u0435\u0437-\u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f-3-scaled.jpg);\">\r\n      <div class=\"sp-slide__content\">\r\n        <div class=\"sp-slide__kicker\"><i><\/i>Ultra Slim Series<\/div>\r\n        <h1 class=\"sp-slide__title\">\u041c\u0456\u043d\u0456\u043c\u0430\u043b\u044c\u043d\u0430 \u0442\u043e\u0432\u0449\u0438\u043d\u0430, \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u0430 \u0447\u0456\u0442\u043a\u0456\u0441\u0442\u044c<\/h1>\r\n        <p class=\"sp-slide__text\">\u041d\u0430\u0439\u0442\u043e\u043d\u0448\u0438\u0439 \u043f\u0440\u043e\u0444\u0456\u043b\u044c \u0443 \u043b\u0456\u043d\u0456\u0439\u0446\u0456 \u0442\u0430 \u0431\u0435\u0437\u0448\u0443\u043c\u043d\u0438\u0439 \u043a\u043b\u0456\u043a-\u043c\u0435\u0445\u0430\u043d\u0456\u0437\u043c \u2014 \u0434\u043b\u044f \u043f\u0440\u043e\u0454\u043a\u0442\u0456\u0432, \u0434\u0435 \u0440\u0430\u043c\u043a\u0430 \u043c\u0430\u0439\u0436\u0435 \u0437\u043d\u0438\u043a\u0430\u0454 \u0437\u0456 \u0441\u0442\u0456\u043d\u0438.<\/p>\r\n        <div class=\"sp-slide__ctas\">\r\n          <a href=\"\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_\u0414\u041b\u042f_\u041a\u041d\u041e\u041f\u041a\u0418_2\" class=\"sp-btn\">\u041f\u0435\u0440\u0435\u0433\u043b\u044f\u043d\u0443\u0442\u0438 \u043a\u043e\u043b\u0435\u043a\u0446\u0456\u044e<\/a>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- ===== \u0421\u041b\u0410\u0419\u0414 3 \u2014 \u0417\u0440\u0443\u0447\u043d\u0430 \u043e\u043f\u043b\u0430\u0442\u0430 ===== -->\r\n    <div class=\"sp-slide\" data-slide=\"2\" style=\"background-image:url(https:\/\/www.staging.switchpoint.com.ua\/wp-content\/uploads\/2026\/07\/\u0414\u0438\u0437\u0430\u0439\u043d-\u0431\u0435\u0437-\u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f-2-scaled.jpg);\">\r\n      <div class=\"sp-slide__content\">\r\n        <div class=\"sp-slide__kicker\"><i><\/i>\u0417\u0440\u0443\u0447\u043d\u0430 \u043e\u043f\u043b\u0430\u0442\u0430<\/div>\r\n        <h1 class=\"sp-slide__title\">\u041e\u043f\u043b\u0430\u0442\u0430 \u0447\u0430\u0441\u0442\u0438\u043d\u0430\u043c\u0438 \u043d\u0430 3 \u043f\u043b\u0430\u0442\u0435\u0436\u0456<\/h1>\r\n        <p class=\"sp-slide__text\">\u041a\u0443\u043f\u0443\u0439\u0442\u0435 \u0437\u0430\u0440\u0430\u0437, \u043f\u043b\u0430\u0442\u0456\u0442\u044c \u0447\u0430\u0441\u0442\u0438\u043d\u0430\u043c\u0438 \u0431\u0435\u0437 \u043f\u0435\u0440\u0435\u043f\u043b\u0430\u0442 \u2014 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e \u0432\u0456\u0434 Monobank \u0442\u0430 PrivatBank.<\/p>\r\n        <div class=\"sp-bank-badges\">\r\n          <span class=\"sp-bank-badge\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><rect x=\"3\" y=\"5\" width=\"18\" height=\"14\" rx=\"2\"\/><path d=\"M3 10h18\"\/><\/svg>Monobank<\/span>\r\n          <span class=\"sp-bank-badge\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><rect x=\"3\" y=\"5\" width=\"18\" height=\"14\" rx=\"2\"\/><path d=\"M3 10h18\"\/><\/svg>PrivatBank<\/span>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div>\r\n\r\n  <button class=\"sp-hero__arrow sp-hero__arrow--prev\" id=\"spPrev\" aria-label=\"\u041f\u043e\u043f\u0435\u0440\u0435\u0434\u043d\u0456\u0439 \u0441\u043b\u0430\u0439\u0434\" type=\"button\">\r\n    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M15 18l-6-6 6-6\"\/><\/svg>\r\n  <\/button>\r\n  <button class=\"sp-hero__arrow sp-hero__arrow--next\" id=\"spNext\" aria-label=\"\u041d\u0430\u0441\u0442\u0443\u043f\u043d\u0438\u0439 \u0441\u043b\u0430\u0439\u0434\" type=\"button\">\r\n    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M9 18l6-6-6-6\"\/><\/svg>\r\n  <\/button>\r\n\r\n  <div class=\"sp-hero__dots\" id=\"spDots\">\r\n    <button class=\"sp-hero__dot is-active\" data-dot=\"0\" aria-label=\"\u0421\u043b\u0430\u0439\u0434 1\" type=\"button\"><\/button>\r\n    <button class=\"sp-hero__dot\" data-dot=\"1\" aria-label=\"\u0421\u043b\u0430\u0439\u0434 2\" type=\"button\"><\/button>\r\n    <button class=\"sp-hero__dot\" data-dot=\"2\" aria-label=\"\u0421\u043b\u0430\u0439\u0434 3\" type=\"button\"><\/button>\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\n  (function () {\r\n    var root = document.currentScript.closest('.sp-banner-block');\r\n    var track = root.querySelector('#spTrack');\r\n    var slides = root.querySelectorAll('.sp-slide');\r\n    var dots = root.querySelectorAll('.sp-hero__dot');\r\n    var total = slides.length;\r\n    var current = 0;\r\n    var timer = null;\r\n    var reduceMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n\r\n    function render() {\r\n      track.style.transform = 'translateX(-' + (current * (100 \/ total)) + '%)';\r\n      dots.forEach(function (d, i) { d.classList.toggle('is-active', i === current); });\r\n    }\r\n    function show(index) { current = (index + total) % total; render(); }\r\n    function next() { show(current + 1); }\r\n    function prev() { show(current - 1); }\r\n\r\n    root.querySelector('#spNext').addEventListener('click', function () { next(); restart(); });\r\n    root.querySelector('#spPrev').addEventListener('click', function () { prev(); restart(); });\r\n    dots.forEach(function (d) {\r\n      d.addEventListener('click', function () { show(parseInt(d.getAttribute('data-dot'), 10)); restart(); });\r\n    });\r\n\r\n    function start() { if (reduceMotion) return; timer = setInterval(next, 20000); }\r\n    function restart() { clearInterval(timer); start(); }\r\n\r\n    var viewport = root.querySelector('#spHeroViewport');\r\n    viewport.addEventListener('mouseenter', function () { clearInterval(timer); });\r\n    viewport.addEventListener('mouseleave', start);\r\n\r\n    var touchStartX = 0;\r\n    var touchEndX = 0;\r\n    viewport.addEventListener('touchstart', function (e) {\r\n      touchStartX = e.changedTouches[0].screenX;\r\n      clearInterval(timer);\r\n    }, { passive: true });\r\n    viewport.addEventListener('touchend', function (e) {\r\n      touchEndX = e.changedTouches[0].screenX;\r\n      var diff = touchStartX - touchEndX;\r\n      if (Math.abs(diff) > 40) {\r\n        if (diff > 0) { next(); } else { prev(); }\r\n      }\r\n      restart();\r\n    }, { passive: true });\r\n\r\n    render();\r\n    start();\r\n  })();\r\n<\/script>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-91eb240 e-con e-atomic-element e-flexbox-base e-91eb240-e649fca \" data-id=\"91eb240\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"91eb240\">\n    \t\t<div class=\"elementor-element elementor-element-2c7e433 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"2c7e433\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n     SWITCH POINT \u2014 \u0411\u043b\u043e\u043a: \u041a\u0430\u0442\u0435\u0433\u043e\u0440\u0456\u0457 \u0442\u043e\u0432\u0430\u0440\u0456\u0432 (\u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u0430 \u0441\u0442\u0440\u0456\u0447\u043a\u0430)\r\n     \u0421\u0442\u0440\u0456\u0447\u043a\u0430 \"\u0432\u0438\u043b\u0456\u0442\u0430\u0454\" \u0437\u0430 \u043f\u0440\u0430\u0432\u0438\u0439 \u043a\u0440\u0430\u0439 \u0435\u043a\u0440\u0430\u043d\u0430 (\u044f\u043a \u043d\u0430 CasaMania) \u2014\r\n     \u0437\u043b\u0456\u0432\u0430 \u0432\u0438\u0440\u0456\u0432\u043d\u044f\u043d\u0430 \u043f\u043e \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0443, \u0441\u043f\u0440\u0430\u0432\u0430 \u0431\u0435\u0437 \u0432\u0456\u0434\u0441\u0442\u0443\u043f\u0443.\r\n     \u041f\u0456\u0434 \u0441\u0442\u0440\u0456\u0447\u043a\u043e\u044e: \u0441\u0442\u0440\u0456\u043b\u043a\u0430 \u2190 \u0442\u043e\u0447\u043a\u0438 (\u043f\u043e \u0447\u0438\u0441\u043b\u0443 \u043a\u0430\u0440\u0442\u043e\u043a) \u2192 \u0441\u0442\u0440\u0456\u043b\u043a\u0430.\r\n\r\n     \u0429\u041e\u0411 \u0412\u0421\u0422\u0410\u0412\u0418\u0422\u0418 \u0424\u041e\u0422\u041e: \u0443 \u043a\u043e\u0436\u043d\u043e\u0457 \u043a\u0430\u0440\u0442\u043a\u0438 \u0441\u0432\u043e\u044f \u0441\u0442\u0440\u043e\u0447\u043a\u0430\r\n     style=\"background-image:url(...)\" \u2014 \u0437\u0430\u043c\u0456\u043d\u0438 \u043d\u0430 \u0441\u0432\u043e\u044e \u0430\u0434\u0440\u0435\u0441\u0443 (\u0431\u0435\u0437 \u043b\u0430\u043f\u043e\u043a).\r\n\r\n     \u0429\u041e\u0411 \u0412\u0421\u0422\u0410\u0412\u0418\u0422\u0418 \u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f: \u043a\u043e\u0436\u043d\u0430 \u043a\u0430\u0440\u0442\u043a\u0430 \u043f\u043e\u0437\u043d\u0430\u0447\u0435\u043d\u0430 \u043a\u043e\u043c\u0435\u043d\u0442\u0430\u0440\u0435\u043c\r\n     \"\u041a\u0430\u0442\u0435\u0433\u043e\u0440\u0456\u044f 1\/2\/3\" \u2014 \u0443\u0441\u0435\u0440\u0435\u0434\u0438\u043d\u0456 \u0448\u0443\u043a\u0430\u0439 href=\"\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_...\"\r\n     ============================================================ -->\r\n<div class=\"sp-cat-block\">\r\n<style>\r\n  .sp-cat-block {\r\n    --g-graphite: #252A30;\r\n    --g-blue: #248FD6;\r\n    --g-line: rgba(37,42,48,0.10);\r\n    --g-line-strong: rgba(37,42,48,0.16);\r\n\r\n    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\r\n    color: var(--g-graphite);\r\n    background: transparent;\r\n    width: 100vw;\r\n    margin-left: calc(50% - 50vw);\r\n    overflow-x: hidden;\r\n  }\r\n  .sp-cat-block *, .sp-cat-block *::before, .sp-cat-block *::after { box-sizing: border-box; }\r\n  .sp-cat-block h2 { font-family: 'Manrope', sans-serif; margin: 0; }\r\n\r\n  .sp-cat-block .sp-container { max-width: 1440px; margin: 0 auto; padding: 0 32px; }\r\n  .sp-cat-block .sp-section { padding: 80px 0; }\r\n  .sp-cat-block .sp-heading { display: flex; align-items: center; gap: 14px; margin-bottom: 40px; }\r\n  .sp-cat-block .sp-heading i { width: 22px; height: 2px; background: var(--g-blue); flex-shrink: 0; }\r\n  .sp-cat-block .sp-heading h2 { font-size: clamp(24px, 2.8vw, 32px); font-weight: 800; letter-spacing: -0.01em; color: var(--g-graphite) !important; }\r\n\r\n  \/* ---------- \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u0430 \u0441\u0442\u0440\u0456\u0447\u043a\u0430 \u2014 \u0432\u0438\u043b\u0456\u0442\u0430\u0454 \u0437\u0430 \u043f\u0440\u0430\u0432\u0438\u0439 \u043a\u0440\u0430\u0439 \u0435\u043a\u0440\u0430\u043d\u0430 ---------- *\/\r\n  .sp-cat__row {\r\n    display: flex;\r\n    gap: 24px;\r\n    overflow-x: auto;\r\n    scroll-snap-type: x mandatory;\r\n    -webkit-overflow-scrolling: touch;\r\n    width: 100vw;\r\n    margin-left: calc(50% - 50vw);\r\n    padding-left: max(32px, calc((100vw - 1440px) \/ 2 + 32px));\r\n    padding-right: 0;\r\n    padding-bottom: 6px;\r\n    scrollbar-width: none;\r\n    -ms-overflow-style: none;\r\n  }\r\n  .sp-cat__row::-webkit-scrollbar { display: none; }\r\n  .sp-cat__row::after { content: ''; flex: 0 0 1px; }\r\n\r\n  .sp-cat-card {\r\n    flex: 0 0 auto;\r\n    width: min(640px, 85vw);\r\n    scroll-snap-align: start;\r\n    position: relative;\r\n    text-decoration: none;\r\n    border-radius: 0;\r\n    overflow: hidden;\r\n    min-height: 460px;\r\n    padding: 28px 32px;\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: flex-end;\r\n    color: #fff;\r\n  }\r\n  .sp-cat-card::before {\r\n    content: '';\r\n    position: absolute; inset: 0;\r\n    background: linear-gradient(180deg, rgba(10,11,13,0.05) 30%, rgba(10,11,13,0.78) 100%);\r\n    z-index: 0;\r\n  }\r\n  .sp-cat-card > * { position: relative; z-index: 1; }\r\n  .sp-cat-card__name { font-family: 'Manrope', sans-serif; font-weight: 800; font-size: 24px; margin-bottom: 8px; }\r\n  .sp-cat-card__desc { font-size: 14px; line-height: 1.5; color: rgba(255,255,255,0.72); margin-bottom: 20px; max-width: 88%; }\r\n  .sp-cat-card__arrow { width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,0.14); display: flex; align-items: center; justify-content: center; transition: background .2s ease; }\r\n  .sp-cat-card:hover .sp-cat-card__arrow { background: var(--g-blue); }\r\n  .sp-cat-card__arrow svg { width: 16px; height: 16px; }\r\n\r\n  .sp-cat-block .sp-photo { position: relative; background: radial-gradient(120% 140% at 20% 15%, #3a3d3f 0%, #24262a 45%, #17181b 100%); background-size: cover; background-position: center; overflow: hidden; }\r\n\r\n  \/* ---------- \u0441\u0442\u0440\u0456\u043b\u043a\u0430 \u2190 \u0442\u043e\u0447\u043a\u0438 \u2192 \u0441\u0442\u0440\u0456\u043b\u043a\u0430, \u043f\u0456\u0434 \u0441\u0442\u0440\u0456\u0447\u043a\u043e\u044e ---------- *\/\r\n  .sp-cat-nav { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 28px; }\r\n  .sp-cat-arrow {\r\n    all: unset; box-sizing: border-box;\r\n    width: 46px; height: 46px; border-radius: 50%;\r\n    background: #F8F7F4; border: 1px solid rgba(37,42,48,0.16);\r\n    display: flex; align-items: center; justify-content: center;\r\n    cursor: pointer; color: var(--g-graphite); flex-shrink: 0;\r\n    transition: background .2s ease, border-color .2s ease, color .2s ease;\r\n  }\r\n  .sp-cat-arrow svg { width: 16px; height: 16px; display: block; pointer-events: none; }\r\n  .sp-cat-arrow:hover { background: var(--g-blue); border-color: var(--g-blue); color: #fff; }\r\n  .sp-cat-arrow:focus-visible { outline: 2px solid var(--g-blue); outline-offset: 3px; }\r\n  .sp-cat-arrow[disabled] { opacity: 0.3; cursor: default; }\r\n  .sp-cat-arrow[disabled]:hover { background: #F8F7F4; border-color: rgba(37,42,48,0.16); color: var(--g-graphite); }\r\n\r\n  .sp-cat-dots { display: flex; align-items: center; gap: 8px; }\r\n  .sp-cat-dot { all: unset; box-sizing: border-box; width: 8px; height: 8px; border-radius: 50%; background: rgba(37,42,48,0.2); cursor: pointer; transition: width .2s ease, background .2s ease; }\r\n  .sp-cat-dot.is-active { background: var(--g-blue); width: 22px; border-radius: 4px; }\r\n\r\n  @media (max-width: 700px) {\r\n    .sp-section { padding: 56px 0; }\r\n    .sp-heading { margin-bottom: 26px; }\r\n    .sp-cat__row { padding-left: 20px; gap: 14px; scroll-snap-type: x proximity; }\r\n    .sp-cat-card { width: 85vw; min-height: 380px; padding: 22px 24px; border-radius: 0; }\r\n    .sp-cat-card__name { font-size: 20px; }\r\n    .sp-cat-nav { display: none; }\r\n  }\r\n\r\n  @media (prefers-reduced-motion: reduce) { .sp-cat-block * { scroll-behavior: auto !important; transition: none !important; } }\r\n<\/style>\r\n\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@700;800&family=Inter:wght@400;500;600&display=swap\" rel=\"stylesheet\">\r\n\r\n<section class=\"sp-section\" id=\"categories\">\r\n  <div class=\"sp-container\">\r\n    <div class=\"sp-heading\"><i><\/i><h2>\u041a\u0430\u0442\u0435\u0433\u043e\u0440\u0456\u0457 \u0442\u043e\u0432\u0430\u0440\u0456\u0432<\/h2><\/div>\r\n  <\/div>\r\n\r\n  <div class=\"sp-cat__row\" id=\"spCatRow\">\r\n\r\n    <!-- ===== \u041a\u0430\u0442\u0435\u0433\u043e\u0440\u0456\u044f 1 \u2014 Slim series ===== -->\r\n    <a href=\"https:\/\/www.staging.switchpoint.com.ua\/?product_cat=slim-series\" class=\"sp-cat-card sp-photo\" style=\"background-image:url(https:\/\/www.staging.switchpoint.com.ua\/wp-content\/uploads\/2026\/07\/Switch-Point-Slim-series-1.jpg);\">\r\n      <div class=\"sp-cat-card__name\">Slim series<\/div>\r\n      <div class=\"sp-cat-card__desc\"><\/div>\r\n      <div class=\"sp-cat-card__arrow\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/div>\r\n    <\/a>\r\n\r\n    <!-- ===== \u041a\u0430\u0442\u0435\u0433\u043e\u0440\u0456\u044f 2 \u2014 Ultra slim series ===== -->\r\n    <a href=\"https:\/\/www.staging.switchpoint.com.ua\/?product_cat=ultra-slim-series\" class=\"sp-cat-card sp-photo\" style=\"background-image:url(https:\/\/www.staging.switchpoint.com.ua\/wp-content\/uploads\/2026\/07\/Switch-Point-Ultra-Slim-series.jpg);\">\r\n      <div class=\"sp-cat-card__name\">Ultra slim series<\/div>\r\n      <div class=\"sp-cat-card__desc\"><\/div>\r\n      <div class=\"sp-cat-card__arrow\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/div>\r\n    <\/a>\r\n\r\n    <!-- ===== \u041a\u0430\u0442\u0435\u0433\u043e\u0440\u0456\u044f 3 \u2014 \u0437\u0430\u043f\u043e\u0432\u043d\u0438 \u043d\u0430\u0437\u0432\u0443, \u043e\u043f\u0438\u0441, \u0444\u043e\u0442\u043e \u0456 \u043f\u043e\u0441\u0438\u043b\u0430\u043d\u043d\u044f ===== -->\r\n    <a href=\"\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_\u041d\u0410_\u041a\u0410\u0422\u0415\u0413\u041e\u0420\u0406\u042e_3\" class=\"sp-cat-card sp-photo\" style=\"background-image:url(\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_\u041d\u0410_\u0424\u041e\u0422\u041e_3);\">\r\n      <div class=\"sp-cat-card__name\">\u041d\u0430\u0437\u0432\u0430 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0456\u0457 3<\/div>\r\n      <div class=\"sp-cat-card__desc\"><\/div>\r\n      <div class=\"sp-cat-card__arrow\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/div>\r\n    <\/a>\r\n\r\n  <\/div>\r\n\r\n  <div class=\"sp-container\">\r\n    <div class=\"sp-cat-nav\">\r\n      <button class=\"sp-cat-arrow\" id=\"spCatPrev\" type=\"button\" aria-label=\"\u041f\u043e\u043f\u0435\u0440\u0435\u0434\u043d\u0456 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0456\u0457\">\r\n        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M15 18l-6-6 6-6\"\/><\/svg>\r\n      <\/button>\r\n      <div class=\"sp-cat-dots\" id=\"spCatDots\"><\/div>\r\n      <button class=\"sp-cat-arrow\" id=\"spCatNext\" type=\"button\" aria-label=\"\u041d\u0430\u0441\u0442\u0443\u043f\u043d\u0456 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0456\u0457\">\r\n        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M9 18l6-6-6-6\"\/><\/svg>\r\n      <\/button>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\n  (function () {\r\n    var root = document.currentScript.closest('.sp-cat-block');\r\n    var row = root.querySelector('#spCatRow');\r\n    var prevBtn = root.querySelector('#spCatPrev');\r\n    var nextBtn = root.querySelector('#spCatNext');\r\n    var dotsWrap = root.querySelector('#spCatDots');\r\n    var cards = Array.prototype.slice.call(row.querySelectorAll('.sp-cat-card'));\r\n\r\n    function step() {\r\n      var card = row.querySelector('.sp-cat-card');\r\n      var gap = parseFloat(getComputedStyle(row).columnGap || getComputedStyle(row).gap || 24);\r\n      return (card ? card.offsetWidth : 320) + gap;\r\n    }\r\n\r\n    \/* \u0442\u043e\u0447\u043a\u0438 \u2014 \u043f\u043e \u043e\u0434\u043d\u0456\u0439 \u043d\u0430 \u043a\u043e\u0436\u043d\u0443 \u043a\u0430\u0440\u0442\u043a\u0443 *\/\r\n    cards.forEach(function (_, i) {\r\n      var dot = document.createElement('button');\r\n      dot.type = 'button';\r\n      dot.className = 'sp-cat-dot' + (i === 0 ? ' is-active' : '');\r\n      dot.setAttribute('aria-label', '\u041a\u0430\u0442\u0435\u0433\u043e\u0440\u0456\u044f ' + (i + 1));\r\n      dot.addEventListener('click', function () {\r\n        row.scrollTo({ left: i * step(), behavior: 'smooth' });\r\n      });\r\n      dotsWrap.appendChild(dot);\r\n    });\r\n    var dots = Array.prototype.slice.call(dotsWrap.querySelectorAll('.sp-cat-dot'));\r\n\r\n    function updateUI() {\r\n      var max = row.scrollWidth - row.clientWidth - 2;\r\n      prevBtn.disabled = row.scrollLeft <= 2;\r\n      nextBtn.disabled = row.scrollLeft >= max;\r\n\r\n      var idx = Math.round(row.scrollLeft \/ step());\r\n      idx = Math.max(0, Math.min(idx, dots.length - 1));\r\n      dots.forEach(function (d, i) { d.classList.toggle('is-active', i === idx); });\r\n    }\r\n\r\n    prevBtn.addEventListener('click', function () {\r\n      row.scrollBy({ left: -step(), behavior: 'smooth' });\r\n    });\r\n    nextBtn.addEventListener('click', function () {\r\n      row.scrollBy({ left: step(), behavior: 'smooth' });\r\n    });\r\n    row.addEventListener('scroll', updateUI, { passive: true });\r\n    window.addEventListener('resize', updateUI);\r\n    updateUI();\r\n  })();\r\n<\/script>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-3a77cb5 e-con e-atomic-element e-flexbox-base e-3a77cb5-eccb89e \" data-id=\"3a77cb5\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"3a77cb5\">\n    \t\t<div class=\"elementor-element elementor-element-1db4411 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"1db4411\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n     SWITCH POINT \u2014 \u0411\u043b\u043e\u043a: \u0412\u0456\u0434\u0433\u0443\u043a\u0438 Google\r\n     \u0421\u0430\u043c\u043e\u0434\u043e\u0441\u0442\u0430\u0442\u043d\u0456\u0439 \u0431\u043b\u043e\u043a \u0434\u043b\u044f \u043e\u043a\u0440\u0435\u043c\u043e\u0433\u043e HTML-\u0432\u0456\u0434\u0436\u0435\u0442\u0430 \u0432 Elementor.\r\n\r\n     \u0429\u041e\u0411 \u0417\u0410\u041f\u041e\u0412\u041d\u0418\u0422\u0418 \u0420\u0415\u0410\u041b\u042c\u041d\u0418\u041c\u0418 \u0412\u0406\u0414\u0413\u0423\u041a\u0410\u041c\u0418:\r\n     1. \u0412\u0456\u0434\u043a\u0440\u0438\u0439 \u043f\u0440\u043e\u0444\u0456\u043b\u044c Switch Point \u0443 Google Maps \/ Google Business\r\n     2. \u0421\u043a\u043e\u043f\u0456\u044e\u0439 3-4 \u0440\u0435\u0430\u043b\u044c\u043d\u0456 \u0432\u0456\u0434\u0433\u0443\u043a\u0438: \u0456\u043c'\u044f, \u043a-\u0441\u0442\u044c \u0437\u0456\u0440\u043e\u043a, \u0442\u0435\u043a\u0441\u0442, \u0434\u0430\u0442\u0443\r\n     3. \u041e\u043d\u043e\u0432\u0438 \u0431\u043b\u043e\u043a\u0438 \"\u0412\u0406\u0414\u0413\u0423\u041a 1\/2\/3\" \u043d\u0438\u0436\u0447\u0435 \u2014 \u0437\u0430\u043c\u0456\u043d\u0438 \u0442\u0435\u043a\u0441\u0442-\u0437\u0430\u0433\u043b\u0443\u0448\u043a\u0443\r\n     4. \u0423 \u0448\u0430\u043f\u0446\u0456 \u043e\u043d\u043e\u0432\u0438 \u0417\u0410\u0413\u0410\u041b\u042c\u041d\u0418\u0419_\u0420\u0415\u0419\u0422\u0418\u041d\u0413, \u041a-\u0421\u0422\u042c_\u0412\u0406\u0414\u0413\u0423\u041a\u0406\u0412 \u0456\r\n        \u043f\u043e\u0441\u0438\u043b\u0430\u043d\u043d\u044f \u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_\u041d\u0410_GOOGLE (\u043a\u043d\u043e\u043f\u043a\u0430 \"\u041d\u0430\u043f\u0438\u0441\u0430\u0442\u0438 \u0432\u0456\u0434\u0433\u0443\u043a\"\r\n        \u0430\u0431\u043e \"\u041f\u0435\u0440\u0435\u0433\u043b\u044f\u043d\u0443\u0442\u0438 \u0432 Google\" \u2014 \u0430\u0434\u0440\u0435\u0441\u0430 \u043f\u0440\u043e\u0444\u0456\u043b\u044e \u0437 Google Maps)\r\n     ============================================================ -->\r\n<div class=\"sp-greviews-block\">\r\n<style>\r\n  .sp-greviews-block {\r\n    --g-graphite: #252A30;\r\n    --g-blue: #248FD6;\r\n    --g-deep: #123E5D;\r\n    --g-soft: #F3F4F5;\r\n    --g-warm: #F8F7F4;\r\n    --g-line: rgba(37,42,48,0.10);\r\n    --g-line-strong: rgba(37,42,48,0.16);\r\n\r\n    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\r\n    color: var(--g-graphite);\r\n    background: transparent;\r\n    width: 100vw;\r\n    margin-left: calc(50% - 50vw);\r\n    overflow-x: hidden;\r\n  }\r\n  .sp-greviews-block *, .sp-greviews-block *::before, .sp-greviews-block *::after { box-sizing: border-box; }\r\n  .sp-greviews-block h2 { font-family: 'Manrope', sans-serif; margin: 0; }\r\n\r\n  .sp-container { max-width: 1440px; margin: 0 auto; padding: 0 32px; }\r\n  .sp-section { padding: 80px 0; }\r\n  .sp-heading { display: flex; align-items: center; gap: 14px; }\r\n  .sp-heading i { width: 22px; height: 2px; background: var(--g-blue); flex-shrink: 0; }\r\n  .sp-heading h2 { font-size: clamp(24px, 2.8vw, 32px); font-weight: 800; letter-spacing: -0.01em; }\r\n  .sp-head-row { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }\r\n\r\n  .sp-btn { display: inline-flex; align-items: center; gap: 8px; background: var(--g-blue); color: #fff; font-weight: 600; font-size: 14px; padding: 12px 22px; border-radius: 6px; text-decoration: none; border: 1px solid var(--g-blue); transition: background .2s ease, transform .2s ease; white-space: nowrap; }\r\n  .sp-btn:hover { background: var(--g-deep); border-color: var(--g-deep); }\r\n  .sp-btn--outline { background: transparent; color: var(--g-graphite); border-color: var(--g-line-strong); }\r\n  .sp-btn--outline:hover { background: var(--g-soft); border-color: var(--g-graphite); }\r\n\r\n  \/* ---------- \u0448\u0430\u043f\u043a\u0430 \u0437 \u0437\u0430\u0433\u0430\u043b\u044c\u043d\u0438\u043c \u0440\u0435\u0439\u0442\u0438\u043d\u0433\u043e\u043c ---------- *\/\r\n  .sp-grev-summary {\r\n    display: flex; align-items: center; justify-content: space-between;\r\n    flex-wrap: wrap; gap: 24px; margin-bottom: 44px;\r\n    padding-bottom: 32px; border-bottom: 1px solid var(--g-line-strong);\r\n  }\r\n  .sp-grev-summary__left { display: flex; align-items: center; gap: 18px; }\r\n  .sp-glogo { width: 40px; height: 40px; flex-shrink: 0; }\r\n  .sp-grev-score { font-family: 'Manrope', sans-serif; font-weight: 800; font-size: 34px; line-height: 1; }\r\n  .sp-grev-stars { display: flex; gap: 2px; margin: 6px 0 4px; }\r\n  .sp-grev-stars svg { width: 16px; height: 16px; }\r\n  .sp-grev-count { font-size: 13px; color: rgba(37,42,48,0.55); }\r\n\r\n  .sp-link { color: var(--g-graphite); font-size: 14px; font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }\r\n\r\n  .sp-grev-nav { display: flex; gap: 10px; }\r\n  .sp-grev-arrow {\r\n    all: unset; box-sizing: border-box;\r\n    width: 46px; height: 46px; border-radius: 50%;\r\n    background: var(--g-warm); border: 1px solid var(--g-line-strong);\r\n    display: flex; align-items: center; justify-content: center;\r\n    cursor: pointer; color: var(--g-graphite);\r\n    transition: background .2s ease, border-color .2s ease, color .2s ease;\r\n  }\r\n  .sp-grev-arrow svg { width: 19px; height: 19px; display: block; pointer-events: none; }\r\n  .sp-grev-arrow:hover { background: var(--g-blue); border-color: var(--g-blue); color: #fff; }\r\n  .sp-grev-arrow:focus-visible { outline: 2px solid var(--g-blue); outline-offset: 3px; }\r\n  .sp-grev-arrow[disabled] { opacity: 0.35; cursor: default; }\r\n  .sp-grev-arrow[disabled]:hover { background: var(--g-warm); border-color: var(--g-line-strong); color: var(--g-graphite); }\r\n\r\n  \/* ---------- \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u0430 \u0441\u0442\u0440\u0456\u0447\u043a\u0430 \u0432\u0456\u0434\u0433\u0443\u043a\u0456\u0432 ---------- *\/\r\n  .sp-grev__row {\r\n    display: flex;\r\n    gap: 20px;\r\n    overflow-x: auto;\r\n    scroll-snap-type: x mandatory;\r\n    padding: 6px var(--edge, 32px) 10px;\r\n    margin: 0 calc(-1 * var(--edge, 32px));\r\n    scrollbar-width: none;\r\n    -ms-overflow-style: none;\r\n  }\r\n  .sp-grev__row::-webkit-scrollbar { display: none; }\r\n\r\n  .sp-grev-card {\r\n    position: relative;\r\n    flex: 0 0 auto;\r\n    width: min(360px, 82vw);\r\n    scroll-snap-align: start;\r\n    background: var(--g-warm); border: 1px solid var(--g-line-strong); border-radius: 16px;\r\n    padding: 28px 24px 24px; display: flex; flex-direction: column; gap: 14px;\r\n    box-shadow: 0 1px 2px rgba(37,42,48,0.04);\r\n    transition: box-shadow .25s ease, border-color .25s ease;\r\n  }\r\n  .sp-grev-card:hover {\r\n    box-shadow: 0 18px 32px -16px rgba(18,62,93,0.28);\r\n    border-color: var(--g-blue);\r\n  }\r\n  .sp-grev-card__quote {\r\n    position: absolute; top: 14px; right: 18px;\r\n    font-family: 'Manrope', sans-serif; font-size: 52px; font-weight: 800; line-height: 1;\r\n    color: rgba(36,143,214,0.14);\r\n    pointer-events: none;\r\n  }\r\n  .sp-grev-card__who { display: flex; align-items: center; gap: 12px; }\r\n  .sp-grev-card__avatar {\r\n    width: 44px; height: 44px; border-radius: 50%; color: #fff;\r\n    display: flex; align-items: center; justify-content: center;\r\n    font-family: 'Manrope', sans-serif; font-weight: 700; font-size: 15px; flex-shrink: 0;\r\n  }\r\n  .sp-grev-card__name { font-weight: 700; font-size: 14px; color: var(--g-graphite); }\r\n  .sp-grev-card__date { font-size: 12px; color: rgba(37,42,48,0.5); }\r\n  .sp-grev-card__stars { display: flex; gap: 2px; }\r\n  .sp-grev-card__stars svg { width: 15px; height: 15px; }\r\n  .sp-grev-card__text { font-size: 15px; line-height: 1.6; color: rgba(37,42,48,0.78); margin: 0; position: relative; z-index: 1; }\r\n  .sp-grev-card__badge {\r\n    display: inline-flex; align-items: center; gap: 5px; margin-top: auto; padding-top: 6px;\r\n    font-size: 11px; color: rgba(37,42,48,0.45);\r\n  }\r\n  .sp-grev-card__badge svg { width: 13px; height: 13px; }\r\n\r\n  .sp-grev-foot { text-align: center; margin-top: 40px; }\r\n\r\n  @media (max-width: 980px) { .sp-grev-card { width: min(340px, 78vw); } }\r\n  @media (max-width: 700px) {\r\n    .sp-section { padding: 56px 0; }\r\n    .sp-grev-summary { margin-bottom: 30px; padding-bottom: 24px; }\r\n    .sp-grev__row { --edge: 20px; gap: 14px; }\r\n    .sp-grev-card { width: 84vw; padding: 22px 20px 20px; }\r\n    .sp-grev-nav { display: none; }\r\n  }\r\n  @media (prefers-reduced-motion: reduce) { .sp-greviews-block * { transition: none !important; scroll-behavior: auto !important; } }\r\n<\/style>\r\n\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@700;800&family=Inter:wght@400;500;600&display=swap\" rel=\"stylesheet\">\r\n\r\n<section class=\"sp-section\" id=\"google-reviews\">\r\n  <div class=\"sp-container\">\r\n    <div class=\"sp-heading\" style=\"margin-bottom: 32px;\"><i><\/i><h2>\u0412\u0456\u0434\u0433\u0443\u043a\u0438 \u043a\u043b\u0456\u0454\u043d\u0442\u0456\u0432<\/h2><\/div>\r\n\r\n    <!-- ===== \u0417\u0410\u0413\u0410\u041b\u042c\u041d\u0418\u0419 \u0420\u0415\u0419\u0422\u0418\u041d\u0413 \u2014 \u043e\u043d\u043e\u0432\u0438 \u0446\u0438\u0444\u0440\u0438 \u043f\u0456\u0434 \u0441\u0432\u0456\u0439 Google-\u043f\u0440\u043e\u0444\u0456\u043b\u044c ===== -->\r\n    <div class=\"sp-grev-summary\">\r\n      <div class=\"sp-grev-summary__left\">\r\n        <svg class=\"sp-glogo\" viewBox=\"0 0 48 48\">\r\n          <path fill=\"#4285F4\" d=\"M45.12 24.5c0-1.56-.14-3.06-.4-4.5H24v8.51h11.84c-.51 2.75-2.06 5.08-4.39 6.64v5.52h7.11c4.16-3.83 6.56-9.47 6.56-16.17z\"\/>\r\n          <path fill=\"#34A853\" d=\"M24 46c5.94 0 10.92-1.97 14.56-5.33l-7.11-5.52c-1.97 1.32-4.49 2.1-7.45 2.1-5.73 0-10.58-3.87-12.31-9.07H4.34v5.7C7.96 41.07 15.4 46 24 46z\"\/>\r\n          <path fill=\"#FBBC05\" d=\"M11.69 28.18A13.86 13.86 0 0111 24c0-1.45.25-2.86.69-4.18v-5.7H4.34A21.93 21.93 0 002 24c0 3.55.85 6.91 2.34 9.88l7.35-5.7z\"\/>\r\n          <path fill=\"#EA4335\" d=\"M24 10.75c3.23 0 6.13 1.11 8.41 3.29l6.31-6.31C34.91 4.18 29.93 2 24 2 15.4 2 7.96 6.93 4.34 14.12l7.35 5.7c1.73-5.2 6.58-9.07 12.31-9.07z\"\/>\r\n        <\/svg>\r\n        <div>\r\n          <div class=\"sp-grev-score\">4.9<span style=\"font-size:16px;font-weight:600;color:rgba(37,42,48,0.45);\"> \/ 5<\/span><\/div>\r\n          <div class=\"sp-grev-stars\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n            <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n            <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n            <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n            <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n          <\/div>\r\n          <div class=\"sp-grev-count\">\u041d\u0430 \u043e\u0441\u043d\u043e\u0432\u0456 27 \u0432\u0456\u0434\u0433\u0443\u043a\u0456\u0432 \u0443 Google<\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"sp-grev__row\" id=\"spGrevRow\">\r\n\r\n      <!-- ===== \u0412\u0406\u0414\u0413\u0423\u041a 1 \u2014 \u0437\u0430\u043c\u0456\u043d\u0438 \u043d\u0430 \u0440\u0435\u0430\u043b\u044c\u043d\u0438\u0439 ===== -->\r\n      <div class=\"sp-grev-card\">\r\n        <div class=\"sp-grev-card__quote\">\"<\/div>\r\n        <div class=\"sp-grev-card__who\">\r\n          <div class=\"sp-grev-card__avatar\" style=\"background:#248FD6;\">\u041e<\/div>\r\n          <div>\r\n            <div class=\"sp-grev-card__name\">\u041e\u043b\u0435\u043a\u0441\u0430\u043d\u0434\u0440 \u041a.<\/div>\r\n            <div class=\"sp-grev-card__date\">2 \u0442\u0438\u0436\u043d\u0456 \u0442\u043e\u043c\u0443<\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"sp-grev-card__stars\">\r\n          <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n        <\/div>\r\n        <p class=\"sp-grev-card__text\">\u0422\u0415\u041a\u0421\u0422 \u0412\u0406\u0414\u0413\u0423\u041a\u0423 1 \u2014 \u0432\u0441\u0442\u0430\u0432 \u0441\u044e\u0434\u0438 \u0440\u0435\u0430\u043b\u044c\u043d\u0438\u0439 \u0442\u0435\u043a\u0441\u0442 \u0456\u0437 Google.<\/p>\r\n        <div class=\"sp-grev-card__badge\">\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><path d=\"M8 12.5l2.5 2.5L16 9.5\"\/><\/svg>\r\n          \u0412\u0456\u0434\u0433\u0443\u043a \u0456\u0437 Google\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- ===== \u0412\u0406\u0414\u0413\u0423\u041a 2 \u2014 \u0437\u0430\u043c\u0456\u043d\u0438 \u043d\u0430 \u0440\u0435\u0430\u043b\u044c\u043d\u0438\u0439 ===== -->\r\n      <div class=\"sp-grev-card\">\r\n        <div class=\"sp-grev-card__quote\">\"<\/div>\r\n        <div class=\"sp-grev-card__who\">\r\n          <div class=\"sp-grev-card__avatar\" style=\"background:#123E5D;\">\u0406<\/div>\r\n          <div>\r\n            <div class=\"sp-grev-card__name\">\u0406\u0440\u0438\u043d\u0430 \u041b.<\/div>\r\n            <div class=\"sp-grev-card__date\">1 \u043c\u0456\u0441\u044f\u0446\u044c \u0442\u043e\u043c\u0443<\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"sp-grev-card__stars\">\r\n          <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n        <\/div>\r\n        <p class=\"sp-grev-card__text\">\u0422\u0415\u041a\u0421\u0422 \u0412\u0406\u0414\u0413\u0423\u041a\u0423 2 \u2014 \u0432\u0441\u0442\u0430\u0432 \u0441\u044e\u0434\u0438 \u0440\u0435\u0430\u043b\u044c\u043d\u0438\u0439 \u0442\u0435\u043a\u0441\u0442 \u0456\u0437 Google.<\/p>\r\n        <div class=\"sp-grev-card__badge\">\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><path d=\"M8 12.5l2.5 2.5L16 9.5\"\/><\/svg>\r\n          \u0412\u0456\u0434\u0433\u0443\u043a \u0456\u0437 Google\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- ===== \u0412\u0406\u0414\u0413\u0423\u041a 3 \u2014 \u0437\u0430\u043c\u0456\u043d\u0438 \u043d\u0430 \u0440\u0435\u0430\u043b\u044c\u043d\u0438\u0439 ===== -->\r\n      <div class=\"sp-grev-card\">\r\n        <div class=\"sp-grev-card__quote\">\"<\/div>\r\n        <div class=\"sp-grev-card__who\">\r\n          <div class=\"sp-grev-card__avatar\" style=\"background:#252A30;\">\u0414<\/div>\r\n          <div>\r\n            <div class=\"sp-grev-card__name\">\u0414\u043c\u0438\u0442\u0440\u043e \u041f.<\/div>\r\n            <div class=\"sp-grev-card__date\">1 \u043c\u0456\u0441\u044f\u0446\u044c \u0442\u043e\u043c\u0443<\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"sp-grev-card__stars\">\r\n          <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\" fill=\"#F5B301\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#F5B301\" stroke-width=\"1.4\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg>\r\n        <\/div>\r\n        <p class=\"sp-grev-card__text\">\u0422\u0415\u041a\u0421\u0422 \u0412\u0406\u0414\u0413\u0423\u041a\u0423 3 \u2014 \u0432\u0441\u0442\u0430\u0432 \u0441\u044e\u0434\u0438 \u0440\u0435\u0430\u043b\u044c\u043d\u0438\u0439 \u0442\u0435\u043a\u0441\u0442 \u0456\u0437 Google.<\/p>\r\n        <div class=\"sp-grev-card__badge\">\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><path d=\"M8 12.5l2.5 2.5L16 9.5\"\/><\/svg>\r\n          \u0412\u0456\u0434\u0433\u0443\u043a \u0456\u0437 Google\r\n        <\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n    <div class=\"sp-grev-foot\" style=\"margin-top: 40px; display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;\">\r\n      <a href=\"\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_\u041d\u0410_GOOGLE\" class=\"sp-btn\" target=\"_blank\" rel=\"noopener\">\u0417\u0430\u043b\u0438\u0448\u0438\u0442\u0438 \u0432\u0456\u0434\u0433\u0443\u043a \u0443 Google<\/a>\r\n      <div class=\"sp-grev-nav\">\r\n        <button class=\"sp-grev-arrow\" id=\"spGrevPrev\" type=\"button\" aria-label=\"\u041f\u043e\u043f\u0435\u0440\u0435\u0434\u043d\u0456 \u0432\u0456\u0434\u0433\u0443\u043a\u0438\">\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M15 18l-6-6 6-6\"\/><\/svg>\r\n        <\/button>\r\n        <button class=\"sp-grev-arrow\" id=\"spGrevNext\" type=\"button\" aria-label=\"\u041d\u0430\u0441\u0442\u0443\u043f\u043d\u0456 \u0432\u0456\u0434\u0433\u0443\u043a\u0438\">\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M9 18l6-6-6-6\"\/><\/svg>\r\n        <\/button>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\n  (function () {\r\n    var root = document.currentScript.closest('.sp-greviews-block');\r\n    var row = root.querySelector('#spGrevRow');\r\n    var prevBtn = root.querySelector('#spGrevPrev');\r\n    var nextBtn = root.querySelector('#spGrevNext');\r\n\r\n    function step() {\r\n      var card = row.querySelector('.sp-grev-card');\r\n      var gap = parseFloat(getComputedStyle(row).columnGap || getComputedStyle(row).gap || 20);\r\n      return (card ? card.offsetWidth : 360) + gap;\r\n    }\r\n    function updateButtons() {\r\n      var max = row.scrollWidth - row.clientWidth - 2;\r\n      prevBtn.disabled = row.scrollLeft <= 2;\r\n      nextBtn.disabled = row.scrollLeft >= max;\r\n    }\r\n    prevBtn.addEventListener('click', function () { row.scrollBy({ left: -step(), behavior: 'smooth' }); });\r\n    nextBtn.addEventListener('click', function () { row.scrollBy({ left: step(), behavior: 'smooth' }); });\r\n    row.addEventListener('scroll', updateButtons, { passive: true });\r\n    window.addEventListener('resize', updateButtons);\r\n    updateButtons();\r\n  })();\r\n<\/script>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-9b598df e-con e-atomic-element e-flexbox-base e-9b598df-766b44f \" data-id=\"9b598df\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"9b598df\">\n    \t\t<div class=\"elementor-element elementor-element-567f299 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"567f299\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n     SWITCH POINT \u2014 \u0411\u043b\u043e\u043a: \u041f\u0440\u043e \u043d\u0430\u0441 (\u0444\u043e\u0442\u043e \u0437\u043b\u0456\u0432\u0430, \u0442\u0435\u043a\u0441\u0442 \u0441\u043f\u0440\u0430\u0432\u0430)\r\n     \u0421\u0430\u043c\u043e\u0434\u043e\u0441\u0442\u0430\u0442\u043d\u0456\u0439 \u0431\u043b\u043e\u043a \u0434\u043b\u044f \u043e\u043a\u0440\u0435\u043c\u043e\u0433\u043e HTML-\u0432\u0456\u0434\u0436\u0435\u0442\u0430 \u0432 Elementor.\r\n\r\n     \u0429\u041e\u0411 \u0412\u0421\u0422\u0410\u0412\u0418\u0422\u0418 \u0424\u041e\u0422\u041e: \u0443 \u0444\u043e\u0442\u043e-\u043f\u043b\u0430\u0448\u043a\u0438 \u0441\u0432\u043e\u044f \u0441\u0442\u0440\u043e\u0447\u043a\u0430\r\n     style=\"background-image:url(...)\" \u2014 \u0437\u0430\u043c\u0456\u043d\u0438\r\n     \u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_\u041d\u0410_\u0424\u041e\u0422\u041e \u043d\u0430 \u0441\u0432\u043e\u044e \u0430\u0434\u0440\u0435\u0441\u0443 (\u0431\u0435\u0437 \u043b\u0430\u043f\u043e\u043a).\r\n     ============================================================ -->\r\n<div class=\"sp-about-block\">\r\n<style>\r\n  .sp-about-block {\r\n    --g-graphite: #252A30;\r\n    --g-blue: #248FD6;\r\n    --g-warm: #F8F7F4;\r\n\r\n    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\r\n    color: var(--g-graphite);\r\n    background: transparent;\r\n    width: 100vw;\r\n    margin-left: calc(50% - 50vw);\r\n    overflow-x: hidden;\r\n  }\r\n  .sp-about-block *, .sp-about-block *::before, .sp-about-block *::after { box-sizing: border-box; }\r\n  .sp-about-block h2 { font-family: 'Manrope', sans-serif; margin: 0; }\r\n\r\n  .sp-container { max-width: 1600px; margin: 0 auto; padding: 0 32px; }\r\n  .sp-section { padding: 80px 0; }\r\n  .sp-heading { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; }\r\n  .sp-heading i { width: 22px; height: 2px; background: var(--g-blue); flex-shrink: 0; }\r\n  .sp-heading h2 { font-size: clamp(24px, 2.8vw, 32px); font-weight: 800; letter-spacing: -0.01em; }\r\n\r\n  .sp-photo { position: relative; background: radial-gradient(120% 140% at 20% 15%, #3a3d3f 0%, #24262a 45%, #17181b 100%); background-size: cover; background-position: center; overflow: hidden; }\r\n\r\n  \/* ---------- \u043c\u0456\u043d\u0456-\u0433\u0430\u043b\u0435\u0440\u0435\u044f \u0437\u043b\u0456\u0432\u0430 ---------- *\/\r\n  .sp-about__gallery { display: flex; flex-direction: column; gap: 16px; }\r\n  .sp-about__viewport { position: relative; aspect-ratio: 16\/10; border-radius: 16px; overflow: hidden; }\r\n  .sp-about__track { display: flex; height: 100%; width: 500%; transition: transform 0.6s cubic-bezier(.65,0,.35,1); will-change: transform; }\r\n  .sp-about__slide { flex: 0 0 20%; width: 20%; }\r\n\r\n  .sp-about__controls { display: flex; align-items: center; justify-content: center; gap: 16px; }\r\n  .sp-about__arrow {\r\n    all: unset; box-sizing: border-box;\r\n    width: 40px; height: 40px; border-radius: 50%;\r\n    background: var(--g-warm); border: 1px solid rgba(37,42,48,0.16);\r\n    display: flex; align-items: center; justify-content: center;\r\n    cursor: pointer; color: var(--g-graphite);\r\n    transition: background .2s ease, border-color .2s ease, color .2s ease;\r\n  }\r\n  .sp-about__arrow svg { width: 16px; height: 16px; display: block; pointer-events: none; }\r\n  .sp-about__arrow:hover { background: var(--g-blue); border-color: var(--g-blue); color: #fff; }\r\n  .sp-about__arrow:focus-visible { outline: 2px solid var(--g-blue); outline-offset: 3px; }\r\n\r\n  .sp-about__dots { display: flex; gap: 8px; }\r\n  .sp-about__dot { all: unset; box-sizing: border-box; width: 7px; height: 7px; border-radius: 50%; background: rgba(37,42,48,0.22); cursor: pointer; transition: width .2s ease, background .2s ease; }\r\n  .sp-about__dot.is-active { background: var(--g-blue); width: 20px; border-radius: 4px; }\r\n\r\n  \/* ---------- \u0444\u043e\u0442\u043e \u0437\u043b\u0456\u0432\u0430 \/ \u0442\u0435\u043a\u0441\u0442 \u0441\u043f\u0440\u0430\u0432\u0430 ---------- *\/\r\n  .sp-about__grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: 64px; align-items: center; }\r\n\r\n  .sp-about__text p { font-size: 16px; line-height: 1.75; color: rgba(37,42,48,0.7); margin: 0 0 16px; max-width: 480px; }\r\n  .sp-about__values { display: flex; gap: 28px; flex-wrap: wrap; margin-top: 32px; }\r\n  .sp-about__value { display: flex; align-items: flex-start; gap: 12px; max-width: 160px; }\r\n  .sp-about__value-icon { width: 36px; height: 36px; border-radius: 50%; border: 1.5px solid var(--g-blue); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }\r\n  .sp-about__value-icon svg { width: 17px; height: 17px; }\r\n  .sp-about__value b { display: block; font-size: 14px; font-weight: 700; margin-bottom: 3px; }\r\n  .sp-about__value span { font-size: 13px; line-height: 1.45; color: rgba(37,42,48,0.55); }\r\n\r\n  @media (max-width: 900px) {\r\n    .sp-about__grid { grid-template-columns: 1fr; gap: 32px; }\r\n    .sp-about__gallery { order: -1; }\r\n  }\r\n  @media (max-width: 700px) {\r\n    .sp-section { padding: 56px 0; }\r\n    .sp-about__values { gap: 20px; }\r\n    .sp-about__value { max-width: 140px; }\r\n  }\r\n\r\n  @media (prefers-reduced-motion: reduce) { .sp-about-block * { transition: none !important; } }\r\n<\/style>\r\n\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@700;800&family=Inter:wght@400;500;600&display=swap\" rel=\"stylesheet\">\r\n\r\n<section class=\"sp-section\" id=\"about\">\r\n  <div class=\"sp-container\">\r\n    <div class=\"sp-about__grid\">\r\n\r\n      <!-- ===== \u0413\u0410\u041b\u0415\u0420\u0415\u042f \u2014 \u0432\u0441\u0442\u0430\u0432 \u0434\u043e 5 \u0444\u043e\u0442\u043e, \u043a\u043e\u0436\u043d\u0435 \u0441\u0432\u043e\u0454\u044e \u0441\u0442\u0440\u043e\u0447\u043a\u043e\u044e ===== -->\r\n      <div class=\"sp-about__gallery\">\r\n        <div class=\"sp-about__viewport\" id=\"spAboutViewport\">\r\n          <div class=\"sp-about__track\" id=\"spAboutTrack\">\r\n            <div class=\"sp-about__slide sp-photo\" style=\"background-image:url(https:\/\/www.staging.switchpoint.com.ua\/wp-content\/uploads\/2026\/07\/Slim-Series-3.jpg);\"><\/div>\r\n            <div class=\"sp-about__slide sp-photo\" style=\"background-image:url(\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_\u041d\u0410_\u0424\u041e\u0422\u041e_2);\"><\/div>\r\n            <div class=\"sp-about__slide sp-photo\" style=\"background-image:url(\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_\u041d\u0410_\u0424\u041e\u0422\u041e_3);\"><\/div>\r\n            <div class=\"sp-about__slide sp-photo\" style=\"background-image:url(\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_\u041d\u0410_\u0424\u041e\u0422\u041e_4);\"><\/div>\r\n            <div class=\"sp-about__slide sp-photo\" style=\"background-image:url(\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_\u041d\u0410_\u0424\u041e\u0422\u041e_5);\"><\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"sp-about__controls\">\r\n          <button class=\"sp-about__arrow\" id=\"spAboutPrev\" type=\"button\" aria-label=\"\u041f\u043e\u043f\u0435\u0440\u0435\u0434\u043d\u0454 \u0444\u043e\u0442\u043e\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M15 18l-6-6 6-6\"\/><\/svg>\r\n          <\/button>\r\n          <div class=\"sp-about__dots\" id=\"spAboutDots\">\r\n            <button class=\"sp-about__dot is-active\" data-dot=\"0\" aria-label=\"\u0424\u043e\u0442\u043e 1\" type=\"button\"><\/button>\r\n            <button class=\"sp-about__dot\" data-dot=\"1\" aria-label=\"\u0424\u043e\u0442\u043e 2\" type=\"button\"><\/button>\r\n            <button class=\"sp-about__dot\" data-dot=\"2\" aria-label=\"\u0424\u043e\u0442\u043e 3\" type=\"button\"><\/button>\r\n            <button class=\"sp-about__dot\" data-dot=\"3\" aria-label=\"\u0424\u043e\u0442\u043e 4\" type=\"button\"><\/button>\r\n            <button class=\"sp-about__dot\" data-dot=\"4\" aria-label=\"\u0424\u043e\u0442\u043e 5\" type=\"button\"><\/button>\r\n          <\/div>\r\n          <button class=\"sp-about__arrow\" id=\"spAboutNext\" type=\"button\" aria-label=\"\u041d\u0430\u0441\u0442\u0443\u043f\u043d\u0435 \u0444\u043e\u0442\u043e\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M9 18l6-6-6-6\"\/><\/svg>\r\n          <\/button>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"sp-about__text\">\r\n        <div class=\"sp-heading\"><i><\/i><h2>\u041f\u0440\u043e \u043d\u0430\u0441<\/h2><\/div>\r\n        <p>Switch Point \u2014 \u0441\u0443\u0447\u0430\u0441\u043d\u0438\u0439 \u0443\u043a\u0440\u0430\u0457\u043d\u0441\u044c\u043a\u0438\u0439 \u0431\u0440\u0435\u043d\u0434 \u0440\u043e\u0437\u0435\u0442\u043e\u043a \u0442\u0430 \u0432\u0438\u043c\u0438\u043a\u0430\u0447\u0456\u0432, \u0441\u0442\u0432\u043e\u0440\u0435\u043d\u0438\u0439 \u0434\u043b\u044f \u0435\u0441\u0442\u0435\u0442\u0438\u0447\u043d\u0438\u0445 \u0456\u043d\u0442\u0435\u0440'\u0454\u0440\u0456\u0432.<\/p>\r\n        <p>\u041c\u0438 \u043f\u043e\u0454\u0434\u043d\u0443\u0454\u043c\u043e \u0456\u043d\u043d\u043e\u0432\u0430\u0446\u0456\u0439\u043d\u0456 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0456\u0457, \u043f\u0440\u0435\u043c\u0456\u0430\u043b\u044c\u043d\u0456 \u043c\u0430\u0442\u0435\u0440\u0456\u0430\u043b\u0438 \u0442\u0430 \u043f\u0440\u043e\u0434\u0443\u043c\u0430\u043d\u0438\u0439 \u043c\u0456\u043d\u0456\u043c\u0430\u043b\u0456\u0441\u0442\u0438\u0447\u043d\u0438\u0439 \u0434\u0438\u0437\u0430\u0439\u043d, \u0449\u043e\u0431 \u0437\u0430\u0431\u0435\u0437\u043f\u0435\u0447\u0438\u0442\u0438 \u0431\u0435\u0437\u043f\u0435\u043a\u0443, \u043a\u043e\u043c\u0444\u043e\u0440\u0442 \u0456 \u0435\u0441\u0442\u0435\u0442\u0438\u043a\u0443 \u0443 \u043a\u043e\u0436\u043d\u0456\u0439 \u0434\u0435\u0442\u0430\u043b\u0456.<\/p>\r\n\r\n        <div class=\"sp-about__values\">\r\n          <div class=\"sp-about__value\">\r\n            <div class=\"sp-about__value-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#248FD6\" stroke-width=\"1.6\"><path d=\"M12 2l3 6 6 1-4.5 4.4 1 6.1L12 16.5 6.5 19.5l1-6.1L3 8l6-1z\"\/><\/svg><\/div>\r\n            <div><b>\u041f\u0440\u0435\u043c\u0456\u0430\u043b\u044c\u043d\u0430 \u044f\u043a\u0456\u0441\u0442\u044c<\/b><span>\u0412\u0438\u0441\u043e\u043a\u043e\u044f\u043a\u0456\u0441\u043d\u0456 \u043c\u0430\u0442\u0435\u0440\u0456\u0430\u043b\u0438 \u0442\u0430 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c \u044f\u043a\u043e\u0441\u0442\u0456<\/span><\/div>\r\n          <\/div>\r\n          <div class=\"sp-about__value\">\r\n            <div class=\"sp-about__value-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#248FD6\" stroke-width=\"1.6\"><path d=\"M12 3l7 3v6c0 4.5-3 7.5-7 9-4-1.5-7-4.5-7-9V6z\"\/><\/svg><\/div>\r\n            <div><b>\u0411\u0435\u0437\u043f\u0435\u043a\u0430<\/b><span>\u0412\u0456\u0434\u043f\u043e\u0432\u0456\u0434\u043d\u0456\u0441\u0442\u044c \u043c\u0456\u0436\u043d\u0430\u0440\u043e\u0434\u043d\u0438\u043c \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u0430\u043c<\/span><\/div>\r\n          <\/div>\r\n          <div class=\"sp-about__value\">\r\n            <div class=\"sp-about__value-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#248FD6\" stroke-width=\"1.6\"><circle cx=\"12\" cy=\"12\" r=\"3\"\/><path d=\"M12 3v2M12 19v2M4.2 4.2l1.4 1.4M18.4 18.4l1.4 1.4M3 12h2M19 12h2M4.2 19.8l1.4-1.4M18.4 5.6l1.4-1.4\"\/><\/svg><\/div>\r\n            <div><b>\u0421\u0443\u0447\u0430\u0441\u043d\u0438\u0439 \u0434\u0438\u0437\u0430\u0439\u043d<\/b><span>\u041c\u0456\u043d\u0456\u043c\u0430\u043b\u0456\u0437\u043c, \u0449\u043e \u043f\u0430\u0441\u0443\u0454 \u0431\u0443\u0434\u044c-\u044f\u043a\u043e\u043c\u0443 \u0456\u043d\u0442\u0435\u0440'\u0454\u0440\u0443<\/span><\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\n  (function () {\r\n    var root = document.currentScript.closest('.sp-about-block');\r\n    var track = root.querySelector('#spAboutTrack');\r\n    var dots = root.querySelectorAll('.sp-about__dot');\r\n    var total = dots.length;\r\n    var current = 0;\r\n\r\n    function render() {\r\n      track.style.transform = 'translateX(-' + (current * (100 \/ total)) + '%)';\r\n      dots.forEach(function (d, i) { d.classList.toggle('is-active', i === current); });\r\n    }\r\n    function show(index) { current = (index + total) % total; render(); }\r\n\r\n    root.querySelector('#spAboutPrev').addEventListener('click', function () { show(current - 1); });\r\n    root.querySelector('#spAboutNext').addEventListener('click', function () { show(current + 1); });\r\n    dots.forEach(function (d) {\r\n      d.addEventListener('click', function () { show(parseInt(d.getAttribute('data-dot'), 10)); });\r\n    });\r\n\r\n    var viewport = root.querySelector('#spAboutViewport');\r\n    var touchStartX = 0, touchEndX = 0;\r\n    viewport.addEventListener('touchstart', function (e) { touchStartX = e.changedTouches[0].screenX; }, { passive: true });\r\n    viewport.addEventListener('touchend', function (e) {\r\n      touchEndX = e.changedTouches[0].screenX;\r\n      var diff = touchStartX - touchEndX;\r\n      if (Math.abs(diff) > 40) { diff > 0 ? show(current + 1) : show(current - 1); }\r\n    }, { passive: true });\r\n\r\n    render();\r\n  })();\r\n<\/script>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-7343f7c e-flex e-con-boxed e-con e-parent\" data-id=\"7343f7c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d12a8b0 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"d12a8b0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n     SWITCH POINT \u2014 \u0411\u043b\u043e\u043a: \u0421\u043f\u0456\u0432\u043f\u0440\u0430\u0446\u044f + \u0424\u0443\u0442\u0435\u0440\r\n     \u0412\u0435\u0440\u0445\u043d\u044f \u0441\u0435\u043a\u0446\u0456\u044f \u2014 CTA \"\u0417\u0430\u043f\u0440\u043e\u0448\u0443\u0454\u043c\u043e \u0434\u043e \u0441\u043f\u0456\u0432\u043f\u0440\u0430\u0446\u0456\" (\u044f\u043a \u043d\u0430 CasaMania,\r\n     \u0442\u0456\u043b\u044c\u043a\u0438 \u0432 \u043a\u043e\u043b\u044c\u043e\u0440\u0430\u0445 Switch Point \u2014 Deep Blue \u0437\u0430\u043c\u0456\u0441\u0442\u044c \u0437\u0435\u043b\u0435\u043d\u043e\u0433\u043e).\r\n     \u041d\u0438\u0436\u0447\u0435 \u2014 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u0438\u0439 \u0444\u0443\u0442\u0435\u0440: \u043a\u043e\u043b\u043e\u043d\u043a\u0438, \u043f\u043b\u0430\u0442\u0456\u0436\u043d\u0456 \u0431\u0435\u0439\u0434\u0436\u0456, \u0441\u043e\u0446\u043c\u0435\u0440\u0435\u0436\u0456.\r\n\r\n     \u0421\u0430\u043c\u043e\u0434\u043e\u0441\u0442\u0430\u0442\u043d\u0456\u0439 \u0431\u043b\u043e\u043a \u0434\u043b\u044f \u043e\u043a\u0440\u0435\u043c\u043e\u0433\u043e HTML-\u0432\u0456\u0434\u0436\u0435\u0442\u0430 \u0432 Elementor.\r\n     \u0417\u0430\u043f\u043e\u0432\u043d\u0438 \u0412\u0421\u0422\u0410\u0412_... \u043f\u043b\u0435\u0439\u0441\u0445\u043e\u043b\u0434\u0435\u0440\u0438 \u0440\u0435\u0430\u043b\u044c\u043d\u0438\u043c\u0438 \u043a\u043e\u043d\u0442\u0430\u043a\u0442\u0430\u043c\u0438 \u0439 \u043f\u043e\u0441\u0438\u043b\u0430\u043d\u043d\u044f\u043c\u0438.\r\n     ============================================================ -->\r\n<div class=\"sp-footer-block\">\r\n<style>\r\n  .sp-footer-block {\r\n    --g-graphite: #252A30;\r\n    --g-blue: #248FD6;\r\n    --g-deep: #123E5D;\r\n    --g-warm: #F8F7F4;\r\n\r\n    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\r\n    width: 100vw;\r\n    margin-left: calc(50% - 50vw);\r\n    overflow-x: hidden;\r\n  }\r\n  .sp-footer-block *, .sp-footer-block *::before, .sp-footer-block *::after { box-sizing: border-box; }\r\n  .sp-footer-block h2 { font-family: 'Manrope', sans-serif; margin: 0; }\r\n\r\n  .sp-container { max-width: 1440px; margin: 0 auto; padding: 0 32px; }\r\n\r\n  \/* ============ \u0421\u041f\u0406\u0412\u041f\u0420\u0410\u0426\u042f (CTA-\u0441\u043c\u0443\u0433\u0430 \u043d\u0430\u0434 \u0444\u0443\u0442\u0435\u0440\u043e\u043c) ============ *\/\r\n  .sp-coop { background: var(--g-deep); color: #fff; }\r\n  .sp-coop__grid {\r\n    display: grid; grid-template-columns: 1fr auto 1.6fr;\r\n    align-items: center; gap: 40px; padding: 56px 32px;\r\n  }\r\n  .sp-coop__text h2 { font-size: clamp(24px, 2.6vw, 32px); font-weight: 800; line-height: 1.25; margin-bottom: 10px; }\r\n  .sp-coop__text p { font-size: 17px; color: rgba(255,255,255,0.72); margin: 0; line-height: 1.4; }\r\n  .sp-coop__divider { width: 1px; align-self: stretch; background: rgba(255,255,255,0.18); }\r\n  .sp-coop__contacts { display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap; }\r\n  .sp-coop__col { display: flex; flex-direction: column; gap: 8px; }\r\n  .sp-coop__label { font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255,255,255,0.5); }\r\n  .sp-coop__col a, .sp-coop__col span.sp-coop__value {\r\n    font-family: 'Manrope', sans-serif; font-weight: 700; font-size: 17px; color: #fff; text-decoration: none;\r\n  }\r\n  .sp-coop__col a:hover { color: var(--g-blue); }\r\n\r\n  @media (max-width: 980px) {\r\n    .sp-coop__grid { grid-template-columns: 1fr; gap: 28px; padding: 44px 24px; }\r\n    .sp-coop__divider { display: none; }\r\n    .sp-coop__contacts { gap: 20px 32px; }\r\n  }\r\n  @media (max-width: 560px) {\r\n    .sp-coop__contacts { flex-direction: column; gap: 18px; }\r\n  }\r\n\r\n  \/* ============ \u0424\u0423\u0422\u0415\u0420 ============ *\/\r\n  .sp-foot { background: #1B1F24; color: var(--g-warm); }\r\n  .sp-foot__top { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 36px; padding: 60px 32px 44px; }\r\n  .sp-foot__brand p { font-size: 14px; color: rgba(248,247,244,0.6); line-height: 1.65; margin: 0; max-width: 280px; }\r\n  .sp-foot__col h4 { font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(248,247,244,0.45); margin: 0 0 18px; }\r\n  .sp-foot__col a { display: block; color: rgba(248,247,244,0.82); text-decoration: none; font-size: 14px; margin-bottom: 12px; }\r\n  .sp-foot__col a:hover { color: var(--g-blue); }\r\n  .sp-foot__col span.sp-foot__value { display: block; color: rgba(248,247,244,0.82); font-size: 14px; margin-bottom: 12px; }\r\n\r\n  .sp-foot__bottom {\r\n    border-top: 1px solid rgba(248,247,244,0.12);\r\n    display: flex; align-items: center; justify-content: space-between;\r\n    flex-wrap: wrap; gap: 18px; padding: 22px 32px;\r\n  }\r\n  .sp-foot__bottom-left { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }\r\n  .sp-foot__copy { font-size: 13px; color: rgba(248,247,244,0.45); }\r\n  .sp-foot__sitemap { font-size: 13px; color: rgba(248,247,244,0.45); text-decoration: none; }\r\n  .sp-foot__sitemap:hover { color: var(--g-blue); }\r\n\r\n  .sp-pay { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }\r\n  .sp-pay span {\r\n    display: inline-flex; align-items: center; justify-content: center;\r\n    height: 26px; padding: 0 10px; border-radius: 4px;\r\n    background: rgba(248,247,244,0.08); border: 1px solid rgba(248,247,244,0.14);\r\n    font-size: 11px; font-weight: 700; letter-spacing: 0.02em; color: rgba(248,247,244,0.7);\r\n  }\r\n\r\n  .sp-foot__social { display: flex; gap: 10px; }\r\n  .sp-foot__social a {\r\n    width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(248,247,244,0.18);\r\n    display: flex; align-items: center; justify-content: center; color: var(--g-warm); text-decoration: none;\r\n  }\r\n  .sp-foot__social a:hover { background: var(--g-blue); border-color: var(--g-blue); }\r\n  .sp-foot__social svg { width: 15px; height: 15px; }\r\n\r\n  @media (max-width: 980px) { .sp-foot__top { grid-template-columns: 1fr 1fr; } }\r\n  @media (max-width: 700px) {\r\n    .sp-foot__top { padding: 48px 20px 32px; gap: 28px; }\r\n    .sp-foot__bottom { padding: 20px; flex-direction: column; align-items: flex-start; }\r\n  }\r\n  @media (max-width: 560px) { .sp-foot__top { grid-template-columns: 1fr; } }\r\n\r\n  @media (prefers-reduced-motion: reduce) { .sp-footer-block * { transition: none !important; } }\r\n<\/style>\r\n\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@700;800&family=Inter:wght@400;500;600&display=swap\" rel=\"stylesheet\">\r\n\r\n<!-- ============ \u0421\u041f\u0406\u0412\u041f\u0420\u0410\u0426\u042f ============ -->\r\n<section class=\"sp-coop\">\r\n  <div class=\"sp-coop__grid\">\r\n    <div class=\"sp-coop__text\">\r\n      <h2>\u0417\u0430\u043f\u0440\u043e\u0448\u0443\u0454\u043c\u043e \u0434\u043e \u0441\u043f\u0456\u0432\u043f\u0440\u0430\u0446\u0456.<\/h2>\r\n      <p>\u0417\u043d\u0430\u0439\u0434\u0435\u043c\u043e \u0456\u0434\u0435\u0430\u043b\u044c\u043d\u0435 \u0440\u0456\u0448\u0435\u043d\u043d\u044f \u0434\u043b\u044f \u0432\u0430\u0448\u043e\u0433\u043e \u043f\u0440\u043e\u0454\u043a\u0442\u0443<\/p>\r\n    <\/div>\r\n    <div class=\"sp-coop__divider\"><\/div>\r\n    <div class=\"sp-coop__contacts\">\r\n      <div class=\"sp-coop__col\">\r\n        <span class=\"sp-coop__label\">\u0422\u0435\u043b\u0435\u0444\u043e\u043d<\/span>\r\n        <a href=\"tel:\u0412\u0421\u0422\u0410\u0412_\u0422\u0415\u041b\u0415\u0424\u041e\u041d\">+38 099 454 40 44<\/a>\r\n      <\/div>\r\n      <div class=\"sp-coop__col\">\r\n        <span class=\"sp-coop__label\">Email<\/span>\r\n        <a href=\"mailto:\u0412\u0421\u0422\u0410\u0412_EMAIL\">info@switchpoint.com.ua<\/a>\r\n      <\/div>\r\n      <div class=\"sp-coop__col\">\r\n        <span class=\"sp-coop__label\">\u0413\u0440\u0430\u0444\u0456\u043a \u0440\u043e\u0431\u043e\u0442\u0438<\/span>\r\n        <span class=\"sp-coop__value\">\u041f\u043d\u2013\u041f\u0442 9:00\u201318:00<\/span>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- ============ \u0424\u0423\u0422\u0415\u0420 ============ -->\r\n<footer class=\"sp-foot\" id=\"footer\">\r\n  <div class=\"sp-container sp-foot__top\">\r\n    <div class=\"sp-foot__brand\">\r\n      <p>\u0421\u0443\u0447\u0430\u0441\u043d\u0430 \u0435\u043b\u0435\u043a\u0442\u0440\u043e\u0444\u0443\u0440\u043d\u0456\u0442\u0443\u0440\u0430 \u0434\u043b\u044f \u0456\u043d\u0442\u0435\u0440'\u0454\u0440\u0456\u0432, \u0449\u043e \u043d\u0430\u0434\u0438\u0445\u0430\u044e\u0442\u044c \u2014 \u0440\u043e\u0437\u0435\u0442\u043a\u0438, \u0432\u0438\u043c\u0438\u043a\u0430\u0447\u0456 \u0442\u0430 \u0433\u043e\u0442\u043e\u0432\u0456 \u043a\u043e\u043c\u043f\u043b\u0435\u043a\u0442\u0438 Switch Point.<\/p>\r\n    <\/div>\r\n    <div class=\"sp-foot__col\">\r\n      <h4>\u041a\u0430\u0442\u0430\u043b\u043e\u0433<\/h4>\r\n      <a href=\"#\">Slim Series<\/a>\r\n      <a href=\"#\">Ultra Slim<\/a>\r\n      <a href=\"#\">\u0420\u043e\u0437\u0435\u0442\u043a\u0438<\/a>\r\n      <a href=\"#\">\u0412\u0438\u043c\u0438\u043a\u0430\u0447\u0456<\/a>\r\n      <a href=\"#\">\u0420\u0430\u043c\u043a\u0438<\/a>\r\n      <a href=\"#\">\u0413\u043e\u0442\u043e\u0432\u0456 \u043a\u043e\u043c\u043f\u043b\u0435\u043a\u0442\u0438<\/a>\r\n    <\/div>\r\n    <div class=\"sp-foot__col\">\r\n      <h4>\u0406\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0456\u044f<\/h4>\r\n      <a href=\"#\">\u041f\u0440\u043e \u043d\u0430\u0441<\/a>\r\n      <a href=\"#\">\u041e\u043f\u043b\u0430\u0442\u0430 \u0442\u0430 \u0434\u043e\u0441\u0442\u0430\u0432\u043a\u0430<\/a>\r\n      <a href=\"#\">\u041f\u043e\u0432\u0435\u0440\u043d\u0435\u043d\u043d\u044f \u0442\u0430 \u043e\u0431\u043c\u0456\u043d<\/a>\r\n      <a href=\"#\">\u0414\u043e\u0433\u043e\u0432\u0456\u0440 \u043e\u0444\u0435\u0440\u0442\u0438<\/a>\r\n      <a href=\"#\">\u041a\u043e\u043d\u0442\u0430\u043a\u0442\u0438<\/a>\r\n    <\/div>\r\n    <div class=\"sp-foot__col\">\r\n      <h4>\u041a\u043e\u043d\u0442\u0430\u043a\u0442\u0438<\/h4>\r\n      <span class=\"sp-foot__value\">+38 099 454 40 44<\/span>\r\n      <span class=\"sp-foot__value\">info@switchpoint.com.ua<\/span>\r\n      <span class=\"sp-foot__value\">\u041f\u043d\u2013\u041f\u0442 9:00\u201318:00<\/span>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"sp-container sp-foot__bottom\">\r\n    <div class=\"sp-foot__bottom-left\">\r\n      <span class=\"sp-foot__copy\">2026 \u2013 2026 \u00a9 Switch Point<\/span>\r\n      <a href=\"#\" class=\"sp-foot__sitemap\">Sitemap<\/a>\r\n    <\/div>\r\n\r\n    <div class=\"sp-pay\">\r\n      <span>VISA<\/span>\r\n      <span>Mastercard<\/span>\r\n      <span>Apple Pay<\/span>\r\n      <span>Google Pay<\/span>\r\n    <\/div>\r\n\r\n    <div class=\"sp-foot__social\">\r\n      <a href=\"\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_WHATSAPP\" aria-label=\"WhatsApp\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><path d=\"M20.5 11.5a8.5 8.5 0 01-12.4 7.5L4 20l1.1-4A8.5 8.5 0 1120.5 11.5z\"\/><path d=\"M9 9.5c0 3 2.5 5.5 5.5 5.5\"\/><\/svg><\/a>\r\n      <a href=\"\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_VIBER\" aria-label=\"Viber\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><path d=\"M7 4h10a3 3 0 013 3v6a3 3 0 01-3 3h-6l-4 4v-4H7a3 3 0 01-3-3V7a3 3 0 013-3z\"\/><\/svg><\/a>\r\n      <a href=\"\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_TELEGRAM\" aria-label=\"Telegram\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><path d=\"M21 4L2 11l6 2m13-9l-4 17-7-6m11-11L8 13\"\/><\/svg><\/a>\r\n      <a href=\"\u0412\u0421\u0422\u0410\u0412_\u041f\u041e\u0421\u0418\u041b\u0410\u041d\u041d\u042f_INSTAGRAM\" aria-label=\"Instagram\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"5\"\/><circle cx=\"12\" cy=\"12\" r=\"4\"\/><circle cx=\"17.5\" cy=\"6.5\" r=\"1\"\/><\/svg><\/a>\r\n    <\/div>\r\n  <\/div>\r\n<\/footer>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Slim Series \u0422\u043e\u043d\u043a\u0456 \u0440\u0430\u043c\u043a\u0438 \u0434\u043b\u044f \u0447\u0438\u0441\u0442\u0438\u0445 \u0456\u043d\u0442\u0435\u0440&#8217;\u0454\u0440\u0456\u0432 \u041c\u0456\u043d\u0456\u043c\u0430\u043b\u044c\u043d\u0430 \u0442\u043e\u0432\u0449\u0438\u043d\u0430 \u0440\u0430\u043c\u043a\u0438 \u0442\u0430 \u0433\u0440\u0430\u0444\u0456\u0442\u043e\u0432\u0435 \u043f\u043e\u043a\u0440\u0438\u0442\u0442\u044f \u2014 \u0432\u0438\u043c\u0438\u043a\u0430\u0447\u0456, \u044f\u043a\u0456 \u043d\u0435 \u0432\u0456\u0434\u0432\u043e\u043b\u0456\u043a\u0430\u044e\u0442\u044c \u0443\u0432\u0430\u0433\u0443 \u0432\u0456\u0434 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-18","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.staging.switchpoint.com.ua\/index.php?rest_route=\/wp\/v2\/pages\/18","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.staging.switchpoint.com.ua\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.staging.switchpoint.com.ua\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.staging.switchpoint.com.ua\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.staging.switchpoint.com.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=18"}],"version-history":[{"count":136,"href":"https:\/\/www.staging.switchpoint.com.ua\/index.php?rest_route=\/wp\/v2\/pages\/18\/revisions"}],"predecessor-version":[{"id":234,"href":"https:\/\/www.staging.switchpoint.com.ua\/index.php?rest_route=\/wp\/v2\/pages\/18\/revisions\/234"}],"wp:attachment":[{"href":"https:\/\/www.staging.switchpoint.com.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=18"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}