
/* =================================================================
   SPIX — Colors & Typography
   Primary tokens for the Спикс brand. Import once per design.
   ================================================================= */

/* --- Fonts (Google Fonts — substitutes for local Golos/Montserrat) --- */


:root {
    /* =========================================================
       COLOR SYSTEM — Brand
       ========================================================= */
    --spix-blue:        #0064e1;  /* primary CTA / links */
    --spix-blue-light:  #2284ff;  /* hover */
    --spix-blue-100:    #0064e11f; /* 12% — subtle bg */
    --spix-blue-200:    #0064e140; /* 25% — hover bg */
    --spix-blue-deep:   #015CFC;  /* used in app/landings */
    --spix-cyan:        #31AFC6;  /* accent */

    /* Neutrals */
    --spix-black:       #040f1d;  /* primary fg on light */
    --spix-white:       #ffffff;
    --spix-bg:          #fafcff;  /* page background */
    --spix-gray-100:    #eef2f6;  /* subtle fill, chips */
    --spix-gray-200:    #d2ddeb;  /* borders */
    --spix-gray-300:    #a7b7cb;  /* hover border */
    --spix-gray-500:    #8d98a6;  /* placeholder */
    --spix-gray-900:    #5c636d;  /* secondary fg */

    /* Semantic */
    --spix-red:         #e6070b;
    --spix-red-light:   #e6070b1f;
    --spix-green:       #00ba45;  /* WhatsApp-style */
    --spix-yellow:      #FFB800;  /* stars */

    /* Badge tints (review source chips) */
    --spix-badge-red-bg:    #FFEAEA;
    --spix-badge-red-fg:    #E53935;
    --spix-badge-green-bg:  #E8F5E9;
    --spix-badge-green-fg:  #43A047;
    --spix-badge-blue-bg:   #E3F2FD;
    --spix-badge-blue-fg:   #1E88E5;

    /* Semantic aliases (fg / bg layers) */
    --fg1: var(--spix-black);
    --fg2: var(--spix-gray-900);
    --fg3: var(--spix-gray-500);
    --bg1: var(--spix-white);
    --bg2: var(--spix-bg);
    --bg3: var(--spix-gray-100);
    --border1: var(--spix-gray-200);
    --border2: var(--spix-gray-300);

    /* =========================================================
       TYPOGRAPHY
       ========================================================= */
    --font-sans:    'Golos Text', 'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-display: 'Golos Text', 'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-app:     'Montserrat', 'Golos Text', -apple-system, sans-serif; /* in-app UI (spix_ui codebase) */
    --font-mono:    'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

    /* Scale — landing / marketing (from typography.md) */
    --fs-h1: 80px;        --lh-h1: 85px;   --ls-h1: -2.4px;   /* Display hero */
    --fs-h1d: 50px;       --lh-h1d: 55px;  --ls-h1d: -1.5px;  /* Section title */
    --fs-h2: 40px;        --lh-h2: 45px;   --ls-h2: -1.2px;
    --fs-h3: 24px;        --lh-h3: 30px;   --ls-h3: -0.24px;  /* Card title */
    --fs-h4: 20px;        --lh-h4: 25px;   --ls-h4: 0;        /* Card body */
    --fs-body: 16px;      --lh-body: 24px; --ls-body: 0;
    --fs-small: 14px;     --lh-small: 20px; --ls-small: -0.14px;
    --fs-micro: 12px;     --lh-micro: 16px;

    /* =========================================================
       SPACING (all multiples of 5)
       ========================================================= */
    --space-xs: 5px;
    --space-sm: 10px;
    --space-md: 15px;
    --space-lg: 20px;
    --space-xl: 25px;
    --space-2xl: 30px;
    --space-3xl: 40px;
    --space-4xl: 50px;
    --space-5xl: 60px;
    --space-6xl: 75px;
    --space-section: 150px;
    --space-section-mobile: 120px;

    /* =========================================================
       RADII
       ========================================================= */
    --radius-sm: 5px;
    --radius-input: 10px;    /* inputs, buttons, small chips */
    --radius-btn-lg: 15px;
    --radius-card-sm: 20px;  /* stat card, contact method */
    --radius-card: 30px;     /* feature card, hero frame, form */
    --radius-pill: 100px;

    /* =========================================================
       SHADOWS
       ========================================================= */
    --shadow-header: 0 7px 70px rgba(4, 15, 29, 0.05);
    --shadow-card:   0 4px 30px rgba(4, 15, 29, 0.08);
    --shadow-hover:  0 8px 40px rgba(4, 15, 29, 0.12);
    --shadow-strong: 0 12px 50px rgba(4, 15, 29, 0.15);
    --shadow-brand:  0 10px 30px rgba(0, 100, 225, 0.15);
    --shadow-inset:  inset 0 5px 15px rgba(4, 15, 29, 0.03);
    --shadow-inset-hover: inset 0 8px 20px rgba(4, 15, 29, 0.06);
    --focus-ring:    0 0 0 3px var(--spix-blue-100);

    /* =========================================================
       MOTION
       ========================================================= */
    --t-fast:    0.15s ease-out;  /* cards */
    --t-default: 0.25s ease;      /* links, inputs */
    --t-btn:     0.24s ease;
    --t-slow:    0.3s ease;
}

/* =========================================================
   SEMANTIC TYPE CLASSES
   ========================================================= */
.spix-h1 {
    font-family: var(--font-display); font-weight: 500;
    font-size: var(--fs-h1); line-height: var(--lh-h1); letter-spacing: var(--ls-h1);
    color: var(--fg1);
}
.spix-h1-d {
    font-family: var(--font-display); font-weight: 500;
    font-size: var(--fs-h1d); line-height: var(--lh-h1d); letter-spacing: var(--ls-h1d);
    color: var(--fg1);
}
.spix-h2 {
    font-family: var(--font-display); font-weight: 500;
    font-size: var(--fs-h2); line-height: var(--lh-h2); letter-spacing: var(--ls-h2);
    color: var(--fg1);
}
.spix-h3 {
    font-family: var(--font-sans); font-weight: 500;
    font-size: var(--fs-h3); line-height: var(--lh-h3); letter-spacing: var(--ls-h3);
    color: var(--fg1);
}
.spix-h4 {
    font-family: var(--font-sans); font-weight: 400;
    font-size: var(--fs-h4); line-height: var(--lh-h4); letter-spacing: var(--ls-h4);
    color: var(--fg2);
}
.spix-body {
    font-family: var(--font-sans); font-weight: 400;
    font-size: var(--fs-body); line-height: var(--lh-body);
    color: var(--fg1);
}
.spix-small {
    font-family: var(--font-sans); font-weight: 400;
    font-size: var(--fs-small); line-height: var(--lh-small); letter-spacing: var(--ls-small);
    color: var(--fg2);
}
.spix-micro {
    font-family: var(--font-sans); font-weight: 400;
    font-size: var(--fs-micro); line-height: var(--lh-micro);
    color: var(--fg3);
}
.spix-mono {
    font-family: var(--font-mono);
    font-size: var(--fs-small); line-height: var(--lh-small);
    color: var(--fg1);
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

body{margin:0;overflow-x:hidden;background:var(--spix-bg);font-family:var(--font-sans);color:var(--spix-black);}
*{box-sizing:border-box;}
a{color:var(--spix-blue);text-decoration:none;}
.nav-item{position:relative;}
.nav-item .dropdown{display:none;position:absolute;top:100%;left:0;padding-top:10px;min-width:200px;z-index:60;}
.nav-item:hover .dropdown{display:block;}
.nav-item:hover .nav-link{background:var(--spix-gray-100);color:var(--spix-black);}
.dropdown-inner{padding:10px;background:var(--spix-white);border-radius:var(--radius-card-sm);box-shadow:var(--shadow-hover);}
.dropdown-inner a{display:block;padding:15px;border-radius:var(--radius-input);font-size:14px;line-height:20px;color:var(--spix-gray-900);}
.dropdown-inner a:hover{background:var(--spix-bg);color:var(--spix-blue);}
.nav-link{display:inline-flex;align-items:center;gap:5px;padding:10px;font-size:16px;line-height:24px;color:var(--spix-gray-900);border-radius:var(--radius-input);cursor:pointer;transition:background var(--t-default),color var(--t-default);}
.msgr{width:45px;height:45px;border-radius:var(--radius-input);background:var(--spix-gray-100);display:inline-flex;align-items:center;justify-content:center;color:var(--spix-blue);transition:background var(--t-default);}
.msgr:hover{background:var(--spix-blue-100);}
.mm-link{display:block;padding:15px;margin:0 -15px;border-radius:var(--radius-input);font-size:16px;line-height:24px;color:var(--spix-black);}
.mm-link:hover{background:var(--spix-bg);color:var(--spix-blue);}
.cat-rows{margin:0 -15px!important;border-top:1px solid var(--spix-gray-100);}
.cat-rows .instr-row{margin:0!important;min-height:55px;}
.cat-rows .instr-row+.instr-row,.cat-rows .grp-head+.instr-row{border-top:1px solid var(--spix-gray-100);}
.cat-rows .instr-row{border-radius:0!important;}
.cat-rows .instr-row:first-child{border-radius:0 0 0 0!important;}
.cat-rows .instr-row>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;}
.cat-rows .instr-row:hover,.plat-row:hover{background:var(--spix-bg)!important;color:var(--spix-blue)!important;border-top-color:transparent;}
.cat-rows .instr-row:hover+.instr-row{border-top-color:transparent;}
.cat-rows .instr-row:hover .row-chev,.plat-row:hover .row-chev{color:var(--spix-blue)!important;transform:translateX(3px);}
.plat-item:hover{background:transparent!important;color:var(--spix-black)!important;}
.cat-rows .plat-item+.plat-item{border-top:1px solid var(--spix-gray-100);}
.kb-cmp a,.kb-table td a{color:var(--spix-blue);}
#genBody a,#genLead a{color:var(--spix-blue);}
.cap-link:hover{background:var(--spix-blue-200)!important;}
.grp-head{margin:25px 0 10px;font-size:12px;line-height:16px;font-weight:600;letter-spacing:0.5px;text-transform:uppercase;color:var(--spix-gray-900);}
.grp-head:first-child{margin-top:0;}
.all-link{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px;margin-top:auto;color:var(--spix-blue)!important;font-size:16px;line-height:24px;font-weight:500;}
.all-link svg{transition:transform var(--t-default);}
.all-link:hover svg{transform:translateX(4px);}
.pop-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);}
.step-img,.step-clip{max-width:calc(100% - 50px)!important;}
.step-note{max-width:calc(100% - 50px)!important;}
html,body{overflow-x:hidden;max-width:100%;}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--spix-blue);outline-offset:3px;border-radius:var(--radius-input);}
.sg-item[data-active="1"]{background:var(--spix-bg)!important;color:var(--spix-blue)!important;}
@media (max-width:1150px){
  .hdr-phone,.hdr-nav{display:none!important;}
  #burger{display:flex!important;order:9;margin-left:15px!important;}
  .hdr-actions{margin-left:auto!important;}
  #tocToggle{display:flex!important;}
  #toc{display:none!important;}
  #toc[data-open="1"]{display:flex!important;}
  .aside-title,.aside-back{display:none!important;}
  .article-grid{grid-template-columns:minmax(0,1fr)!important;gap:40px!important;}
  .article-aside{position:static!important;order:-1;}

}
@media (max-width:900px){
  .footer-grid{grid-template-columns:1fr 1fr!important;}
  .rel-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (max-width:700px){
  #catGrid,#platGrid{grid-template-columns:1fr!important;}

  .footer-grid{grid-template-columns:1fr!important;}
  header{height:64px!important;}
  #mobileMenu{top:64px!important;}
  .hero-h1{font-size:36px!important;line-height:40px!important;letter-spacing:-1.1px!important;}
  .article-h1{font-size:30px!important;line-height:35px!important;letter-spacing:-0.9px!important;}
  .rel-grid{grid-template-columns:1fr!important;}
  .sec-h2{font-size:24px!important;line-height:30px!important;letter-spacing:-0.7px!important;}
  .sec-sub{font-size:14px!important;line-height:20px!important;}
  .hub-main,.art-wrap{padding-left:15px!important;padding-right:15px!important;}
  .crumbs-wrap{padding:15px 15px 0!important;}
  .hero-sec{padding:25px 15px 25px!important;}
  .cat-card{padding:20px!important;}
  .kb-ind{margin-left:0!important;}
  .kb-cmp{grid-template-columns:1fr!important;}
  #kbBody .step-list,#genBody .step-list{padding-left:20px!important;}
  .cap-link{height:45px!important;padding:0 15px!important;}
  .cat-card span[style*="65px"]{width:50px!important;height:50px!important;}
  .cat-card span[style*="65px"] svg{width:20px!important;height:20px!important;}
  .cat-rows .instr-row{gap:10px!important;padding:10px!important;}
  .cat-rows .instr-row>span:first-child{white-space:normal!important;}
  .step-text,.step-list{padding-left:0!important;}
  .step-clip,.step-img,.step-note{margin-left:0!important;max-width:100%!important;}
  .step-head{gap:10px!important;}
  .step-title{font-size:20px!important;line-height:25px!important;}
  .crumbs{flex-wrap:nowrap!important;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:5px;}
  .crumbs::-webkit-scrollbar{display:none;}
  .crumbs>*{white-space:nowrap;flex:none;}
  .crumbs a{padding:10px 0;}
  .article-aside{padding:0!important;background:transparent!important;box-shadow:none!important;}
  .footer-grid a{padding:5px 0;}
  .pop-card,.rel-card{min-height:0!important;}
  .avail-grid{grid-template-columns:1fr!important;gap:15px!important;}
  .helpful-btns{width:100%;flex-direction:column;}
  .helpful-btns button{width:100%;}
  .hdr-actions{display:none!important;}
  #burger{margin-left:auto!important;}
  .logo-link span{display:none!important;}
  #searchBox{height:55px!important;padding:0 15px!important;}
  #searchInput{font-size:16px!important;}
  #suggestBox{top:64px!important;}
}

/* Consistent spacing below instruction breadcrumbs in every view. */
:root{--instruction-crumb-gap:40px}
#view-hub>.hero-sec{padding-top:var(--instruction-crumb-gap)!important}
#view-platforms>.hub-main{padding-top:var(--instruction-crumb-gap)!important}
html[data-instructions-view="section"] #view-hub>.hub-main{padding-top:var(--instruction-crumb-gap)!important}
#view-article>.art-wrap{padding-top:25px!important}
#view-article .art-wrap>.crumbs{margin-bottom:var(--instruction-crumb-gap)!important}
@media(max-width:700px){
 :root{--instruction-crumb-gap:25px}
 #view-article>.art-wrap{padding-top:15px!important}
}

/* Spix marketing foundations: local Golos Text, 5px spacing, 10px inputs.
   References: brand-style/spix/forms.md, navigation.md, spacing.md. */
:root{--spix-ui-blue:#0064e1;--spix-ui-hover:#2284ff;--spix-ui-text:#040f1d;--spix-ui-muted:#5c636d;--spix-ui-border:#d2ddeb;--spix-ui-soft:#eef2f6;--spix-site-header-height:72px}
html,body{overflow-x:clip}
.header{position:sticky!important;top:0!important;height:var(--spix-site-header-height)!important;padding-top:15px!important;padding-bottom:15px!important;z-index:60!important}
.main,.page-wrap{padding-top:0!important}
.main.index-page .welcome{padding-top:0!important}
.page-wrap{min-height:100vh}
.site-header-spacer{display:none!important}
.header .header__logo-wrapper,.header .header__links{min-width:0}
/* Shared search used by the blog, instruction catalogue and platforms. */
.spix-search,#searchBox,label[for="platSearch"]{box-sizing:border-box!important;display:flex!important;align-items:center!important;gap:15px!important;width:100%!important;max-width:640px!important;min-width:0!important;height:55px!important;margin-left:auto;margin-right:auto;padding:0 20px!important;background:#fff!important;border:1px solid var(--spix-ui-border)!important;border-radius:10px!important;box-shadow:none!important;transition:border-color .25s ease,box-shadow .25s ease!important;position:relative}
.spix-search:hover,#searchBox:hover,label[for="platSearch"]:hover{border-color:#a7b7cb!important}
.spix-search:focus-within,#searchBox:focus-within,label[for="platSearch"]:focus-within{border-color:var(--spix-ui-blue)!important;box-shadow:0 0 0 3px #0064e11f!important}
.spix-search input,#searchBox input,label[for="platSearch"] input{box-sizing:border-box!important;flex:1 1 0!important;min-width:0!important;width:100%!important;height:100%!important;padding:0!important;margin:0!important;border:0!important;border-radius:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;color:var(--spix-ui-text)!important;font-family:'Golos Text',system-ui,sans-serif!important;font-size:16px!important;font-weight:400!important;line-height:24px!important;letter-spacing:0!important}
.spix-search input::placeholder,#searchBox input::placeholder,label[for="platSearch"] input::placeholder{color:var(--spix-ui-muted)!important;opacity:1}
.spix-search>.spix-search__icon,#searchBox>svg,label[for="platSearch"]>svg{width:20px!important;height:20px!important;flex:0 0 20px!important;color:var(--spix-ui-muted)!important}
.spix-search .search-clear-btn,#searchClear{position:static!important;transform:none!important;flex:0 0 30px!important;width:30px!important;height:30px!important;padding:0!important;margin:0!important;border:0!important;border-radius:10px!important;background:var(--spix-ui-soft)!important;color:var(--spix-ui-muted)!important;align-items:center;justify-content:center;font-family:'Golos Text',system-ui,sans-serif!important;font-size:20px!important;line-height:1!important;cursor:pointer}
.spix-search .search-clear-btn:hover,#searchClear:hover{background:#d2ddeb!important;color:var(--spix-ui-text)!important}
.spix-search .search-clear-btn:focus-visible,#searchClear:focus-visible{outline:2px solid var(--spix-ui-blue)!important;outline-offset:3px!important}
#suggestBox{top:65px!important;border-radius:20px!important}
/* Prevent min-content columns from clipping cards before script startup. */
#catGrid,#platGrid{min-width:0;width:100%}
#catGrid>.cat-card,#platGrid>.cat-card{min-width:0;max-width:100%;box-sizing:border-box}
#catGrid .instr-row,#platGrid .plat-row{min-width:0}
#catGrid .instr-row>span:first-child,#platGrid .plat-row>span:first-child{min-width:0;overflow-wrap:anywhere}
#catGrid .instr-row span[style*="font-size:12px"]{color:#005bc9!important}
/* The corporate footer needs two columns on tablets, not five. */
.footer .footer__container{box-sizing:border-box;max-width:1300px!important;margin-left:auto!important;margin-right:auto!important;padding-left:25px!important;padding-right:25px!important}
.footer .footer__row,.footer .footer__col{min-width:0!important;max-width:100%}
.footer .footer__link,.footer .footer__text-link{overflow-wrap:anywhere}
@media(min-width:768px) and (max-width:1199px){.footer .footer__row{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:30px!important}.footer .footer__col:first-child{grid-column:1/-1}}
/* Long current breadcrumb labels wrap inside the container. */
.breadcrumbs ul{flex-wrap:wrap;min-width:0;gap:5px 10px}
.breadcrumbs li,.breadcrumbs .current{min-width:0;max-width:100%;white-space:normal!important;overflow-wrap:anywhere}
.analytics-page .spix-help-text{min-width:0;max-width:100%;overflow-wrap:anywhere}
.analytics-page .spix-help-card{box-sizing:border-box;max-width:100%}
.analytics-page .spix-tabs-row{scroll-padding-inline:15px}
@media(max-width:1100px){.header .menu{height:calc(100dvh - var(--spix-site-header-height));min-height:0;max-height:calc(100dvh - var(--spix-site-header-height));overflow-y:auto}.header .menu.is-open{top:var(--spix-site-header-height)!important}}
@media(max-width:767px){:root{--spix-site-header-height:64px}.header{padding:10px 15px!important}.footer .footer__container{padding-left:15px!important;padding-right:15px!important}.footer .footer__row{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:30px!important}.footer .footer__col{grid-column:auto!important}.spix-search,#searchBox,label[for="platSearch"]{padding-left:15px!important;padding-right:15px!important}}
@media(max-width:700px){#catGrid,#platGrid{grid-template-columns:minmax(0,1fr)!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* Resize must not animate layout dimensions or truncate current-page titles. */
.header{transition:background-color .25s ease,box-shadow .25s ease,color .25s ease!important}
.article-redesign .breadcrumbs,.author-page .breadcrumbs{flex-wrap:wrap!important;overflow:visible!important}
.article-redesign .breadcrumbs>.current,.author-page .breadcrumbs>.current{flex:0 1 auto!important;white-space:normal!important;overflow-wrap:anywhere}

@media(min-width:701px) and (max-width:1000px){.instr-row>span{white-space:normal!important;text-overflow:clip!important;overflow:visible!important;overflow-wrap:anywhere}}
.header:not(.header--light) .btn-secondary{color:#fff!important}.header:not(.header--light) .header__tel{color:#78b7ff!important}

.popular-card-meta{color:#5c636d!important}.header:not(.header--light) .btn-light{color:#fff!important}.analytics-card__text{color:#b6bdc7!important}

.article-card-meta,.article-card-read-time__text,.article-card-meta time{color:#5c636d!important}.header--light .btn-light{color:#005bc9!important}

/* Readable secondary text on the light templates. */
.footer--light .footer__copyright,.footer--light .footer__it-notice{color:#5c636d!important}
[itemtype="https://schema.org/BreadcrumbList"]>li:last-child [itemprop="name"]{color:#5c636d!important}
.tariff-card__info,.tariffs-intro-note{color:#5c636d!important}
.tariff-card .btn-secondary{color:#005bc9!important}
.source-badge[style*="--wb"]{background:#a234ed!important}
.contacts-icon[href*="t.me/"]{background:#0064a0!important}
html[data-instructions-view]{--spix-gray-500:#5c636d}
html[data-instructions-view] .step-note a,html[data-instructions-view] #artNext{color:#005bc9!important}

.article-grid article p a,.article-grid article .step-list a,.article-grid article .step-note a{text-decoration:underline!important;text-underline-offset:3px}

.swiper-slide .tariff-card__header .tariff-card__info{color:#5c636d!important}

.sitemap__title{font-size:clamp(28px,4vw,42px);line-height:1.15;margin:0 0 32px}.sitemap__group-title{font-size:24px;line-height:1.3;margin:36px 0 20px}

.hero-sec{background:transparent!important}
.menu-btn:focus-visible{outline:2px solid #1e5cff;outline-offset:2px}
html,body{overflow-x:clip!important}
@media (min-width:1151px){.article-aside{max-height:calc(100vh - 110px);overflow-y:auto}}
@media (max-width:1150px){.article-aside{position:sticky!important;top:64px!important;z-index:5;background:var(--spix-white,#fff)!important;margin:0 -16px;padding:6px 16px!important}
#toc[data-open="1"]{max-height:calc(100dvh - 150px);overflow-y:auto}
.crumbs{flex-wrap:wrap!important;row-gap:4px}.crumbs>span,#crumbName{min-width:0;white-space:normal!important;overflow-wrap:anywhere}
h2,h3{scroll-margin-top:130px}}
.header{display:flex;align-items:center;padding:17px 35px;position:fixed;top:0;width:100%;height:70px;background-color:#101217;color:#fff;box-shadow:none;transition:.5s;z-index:10}
.header .menu-btn{border-color:#404145}
.header .menu-btn__burger,.header .menu-btn__burger::after,.header .menu-btn__burger::before{background:#fff}
@media (max-width:1100px){.header .menu{background-color:#101217;color:#fff;box-shadow:none}.header .menu__dropdown-container a:hover,.header .menu__dropdown-container button:hover{color:#fff!important}.header .menu__dropdown a,.header .menu__dropdown a:hover{color:#fff}}
@media (max-width:1200px){.header{padding:17px 20px}}
.header__logo-wrapper{position:relative;flex:0 0 122px;width:122px;height:36px;background-color:inherit;margin-right:20px}
@media (max-width:768px){.header__logo-wrapper{margin-right:0}}
@media (min-width:1200px){.header__logo-wrapper{margin-right:15px}}
.header__logo-wrapper a{display:flex;align-items:center;justify-content:center;position:relative;width:100%;height:100%;transition:.3s}
.header__logo-wrapper a:hover{opacity:.7}
.header__logo-wrapper img,.header__logo-wrapper svg{width:100%;height:auto;-o-object-fit:contain;object-fit:contain}
.header__links{display:flex;align-items:center;background-color:inherit;margin-left:auto}
.header__tel{margin-right:12px;transition:.3s}
.header__tel:hover{color:#8c9299}
@media (max-width:1100px){.header__tel{display:none}}
.header__social{display:flex;flex:0 0 auto}
@media (max-width:1100px){.header__social{display:none}}
.header__social-link+.header__social-link{margin-left:10px}
.header__btns{display:flex;margin-left:10px}
.header__btns .btn-primary{background:#fff;color:#000;min-width:initial!important;width:auto!important}
.header__btns .btn-primary:hover{background:#e2e2e2}
.header__btns .btn+.btn{margin-left:10px}
.header .btn.btn-secondary{min-width:215px}
@media (max-width:1600px){.header .btn.btn-secondary{min-width:-moz-fit-content;min-width:fit-content}}
@media (max-width:992px) and (orientation:portrait){.header .btn.btn-secondary{display:none}}
.header--light{background-color:#fff;box-shadow:0 7px 70px 0 rgba(4,15,29,.05);color:#040f1d;font-family:Inter,sans-serif}
.header--light .header__tel span{color:#040f1d}
.header--light .menu-btn{border-color:#d0d5dd}
.header--light .menu-btn .menu-btn__burger,.header--light .menu-btn .menu-btn__burger::after,.header--light .menu-btn .menu-btn__burger::before{background:#040f1d}
.header--light .menu-btn.is-open .menu-btn__burger{background:0 0}
@media (max-width:1100px){.header__btns{margin-left:0}.header--light .menu{background-color:#fff;color:#040f1d}.header--light .menu__dropdown-container a:hover,.header--light .menu__dropdown-container button:hover{color:#0064e1!important}.header--light .menu__dropdown a{color:#040f1d}.header--light .menu__dropdown a:hover{color:#0064e1}}
@media (min-width:1200px){.header--light .menu__mobile-head::before{background-color:#d0d5dd}}
.header-hidden{opacity:.9}
.social-icon-wrapper{display:flex;align-items:center;justify-content:center;width:36px;height:36px;flex:0 0 36px}
.social-icon{display:flex;align-items:center;justify-content:center;border:1px solid #404145;border-radius:50%;box-sizing:border-box;width:38px;height:38px;flex:0 0 38px}
.social-icon svg{display:flex;transition:.3s;flex:0 0 19px}
.social-icon:hover svg{opacity:.7}
.social-icon .telegram,.social-icon .whatsapp{width:19px;height:19px}
.header--light .menu__dropdown,.header--light .menu__list{list-style:none;padding-left:0}
.header--light .menu__dropdown a,.header--light .menu__item>a,.header--light .menu__item>button{text-decoration:none}
.header--light .header__logo-wrapper--light{flex:0 0 132px;width:132px;height:32px}
.header--light .header__logo-wrapper--light a,.header--light .header__logo-wrapper--light svg{display:block;width:132px;height:32px}
.header--light .header__links--light{gap:15px}
.header--light .header__social--light{display:flex;flex:0 0 auto;gap:15px}
.header--light .header__social-btn{display:block;flex-shrink:0;padding:0;border:0;background-color:transparent}
.header--light .header__social-btn svg{display:block}
.header--light .header__social-btn svg rect:first-child{fill:#eef2f6;transition:fill 250ms ease-in-out}
.header--light .header__social-btn:hover svg rect:first-child{fill:rgba(0,100,225,.12)}
.header--light .header__btns--light{gap:15px;margin-left:0}
.header--light .header__btns--light .btn{display:inline-flex;align-items:center;justify-content:center;width:auto;min-width:initial;max-width:none;min-height:44px;padding:12px 20px;border:0;border-radius:10px;font-family:Inter,sans-serif;font-size:16px;font-weight:500;line-height:1.2;text-align:center;text-decoration:none;white-space:nowrap;cursor:pointer;transition:border-color 240ms ease-in-out,background-color 240ms ease-in-out,color 240ms ease-in-out}
.header--light .header__btns--light .btn-light{background-color:rgba(0,100,225,.12);border-color:rgba(0,100,225,.12);color:#0064e1}
.header--light .header__btns--light .btn-light:hover{background-color:rgba(0,100,225,.25);border-color:rgba(0,100,225,.25);color:#2284ff}
.header--light .header__btns--light .btn-primary{background:#0064e1;border-color:#0064e1;color:#fff}
.header--light .header__btns--light .btn-primary:hover{background:#2284ff;border-color:#2284ff}
.header--light .header__btns--light .btn+.btn{margin-left:0}
@media screen and (max-width:1023px){.header--light .header__social--light,.header--light .header__tel{display:none}}
@media screen and (max-width:767px){.header--light .header__btns--light .btn-light{display:none}}
.menu{display:flex;align-items:center}
@media (max-width:1100px){.menu{position:fixed;top:-100vh;left:0;display:flex;flex-direction:column;align-items:flex-start;padding:0 20px 20px!important;background-color:#fff;color:#040f1d;box-shadow:0 20px 40px rgba(4,15,29,.08);width:100%;max-width:initial!important;height:calc(100dvh - 70px);min-height:calc(100vh - 70px);transition:top .5s;z-index:20;max-height:calc(100dvh - 70px);overflow:auto}.menu__list{width:100%;flex-direction:column}}
.menu.is-open{top:70px}
.menu.is-open .menu__mobile-head{display:none}
.menu__list{display:flex;list-style:none;padding:0;margin:0}
.menu__item{display:flex;align-items:center;white-space:nowrap}
.menu__item>a,.menu__item>button{height:50px;display:flex;align-items:center;transition:.3s;font-size:14px;background:0 0;border:none;padding:0;cursor:pointer;color:inherit;text-decoration:none}
.menu__item>a:hover,.menu__item>button:hover{color:#2284ff}
.menu__item~.menu__item{margin-left:3.646vw}
@media (max-width:1700px){.menu__item~.menu__item{margin-left:50px}}
@media (max-width:1600px){.menu__item~.menu__item{margin-left:40px}}
@media (max-width:1400px){.menu__item~.menu__item{margin-left:15px}}
@media (max-width:1100px){.menu__item>a,.menu__item>button{width:100%;justify-content:space-between}.menu__item~.menu__item{margin-left:0}.menu .btn.btn-secondary,.menu .header__social{display:flex}}
.menu__tel{margin-right:8px;font-size:14px;flex-shrink:0}
@media (max-width:425px){.menu__tel{width:100%;height:50px;display:flex;align-items:center}}
.menu .btn.btn-secondary{flex-shrink:1;max-width:140px;margin-left:8px}
@media (max-width:1100px) and (orientation:landscape){.menu .btn.btn-secondary{display:none!important}}
.menu__dropdown-container{position:relative}
@media (max-width:1100px){.menu .btn.btn-secondary{background:linear-gradient(to right,#277ac7,#5fb8e2);color:#fff;border:none}.menu .btn.btn-secondary:hover{background:linear-gradient(to right,#095ca9,#3790ba)}.menu__dropdown-container{flex-direction:column;align-items:flex-start}.menu__dropdown-container a:hover,.menu__dropdown-container button:hover{color:#2284ff!important}.menu__dropdown-container.expanded .menu__dropdown-caret svg{rotate:180deg}.menu__dropdown-container.expanded .menu__dropdown{display:block}}
.menu__dropdown-container .menu__dropdown-caret svg{margin-left:6px;transition:rotate .3s}
.menu__dropdown{list-style:none;padding:0;margin:0}
@media (max-width:1100px){.menu__dropdown{display:none;padding-left:15px;padding-bottom:5px}.menu__dropdown a{color:#040f1d;display:block;padding:8px 0}.menu__dropdown a:hover{color:#2284ff}}
.menu__dropdown li{margin-bottom:5px}
@media (min-width:1100px){.menu__item>a,.menu__item>button{height:70px;font-size:16px}.menu__dropdown-container:focus-within>a,.menu__dropdown-container:focus-within>button,.menu__dropdown-container:hover>a,.menu__dropdown-container:hover>button{color:#2284ff}.menu__dropdown-container:focus-within .menu__dropdown-caret svg,.menu__dropdown-container:hover .menu__dropdown-caret svg{rotate:180deg}.menu__dropdown-container:focus-within .menu__dropdown,.menu__dropdown-container:hover .menu__dropdown{opacity:1;pointer-events:auto}.menu__dropdown{padding:10px 5px;border-radius:15px;pointer-events:none;background-color:#fff;box-shadow:0 10px 40px rgba(4,15,29,.12);transition:opacity .3s;position:absolute;top:100%;left:-10px;opacity:0;min-width:155px;white-space:nowrap}.menu__dropdown li,.menu__dropdown li:last-child{margin-bottom:0}}
.menu__dropdown a{font-size:14px;line-height:18px;text-decoration:none;transition:.3s}
.menu__mobile-head{position:relative;font-size:12px;line-height:15.6px;color:#8c9299;width:100%;text-align:center;white-space:nowrap}
@media (min-width:1100px){.menu__dropdown a{font-size:15px;line-height:20px;color:#040f1d;display:block;padding:8px 15px;border-radius:10px}.menu__dropdown a:hover{color:#2284ff;background-color:rgba(34,132,255,.06)}.menu__mobile-head{margin-right:80px}}
@media (min-width:1100px) and (max-width:1200px){.menu__mobile-head{display:none}}
@media (min-width:1200px){.menu__mobile-head{display:flex;align-items:center}.menu__mobile-head::before{content:"";display:inline-block;margin-right:15px;width:1px;height:16px;background-color:#8c9299;flex-shrink:0}}
.menu-overlay{display:none;position:fixed;inset:0;background:rgba(4,15,29,.5);z-index:9;cursor:pointer}
.menu-overlay.is-active{display:block}
@media (min-width:1101px){.menu-overlay{display:none!important}}
@media (max-width:1100px){.menu__mobile-head{padding-bottom:14px}.menu__dropdown-caret{display:flex;align-items:center;justify-content:flex-end;width:50px;height:50px;position:relative}.menu__dropdown-caret::after{content:"";display:block;position:absolute;z-index:1;top:0;bottom:0;left:0;right:0}}
.menu__dropdown-caret svg{pointer-events:none}
.btn{padding:1.195em 2em;border-radius:100px;font-size:clamp(16px,.9375vw,40px);line-height:1;font-weight:500;width:100%;z-index:10;max-width:335px;text-align:center}
.btn.small{padding:12px 17px;min-width:215px;font-size:14px}
@media (max-width:1200px){.btn.small{display:flex;text-align:center;min-width:initial;align-items:center;font-size:14px;padding-left:20px;padding-right:20px}}
.btn-primary{background:linear-gradient(to right,#277ac7,#5fb8e2);transition:.3s}
.btn-primary:hover{background:linear-gradient(to right,#095ca9,#3790ba)}
.btn-order-demo-wrapper,.btn-try-free-wrapper{display:flex;flex-direction:column;align-items:center;margin:0 auto;width:100%}
.btn-order-demo-wrapper.--horizontal,.btn-try-free-wrapper.--horizontal{flex-direction:row}
.btn-order-demo-wrapper.--horizontal a,.btn-try-free-wrapper.--horizontal a{margin-right:30px}
@media (max-width:1500px){.btn-order-demo-wrapper.--horizontal,.btn-try-free-wrapper.--horizontal{flex-direction:column;align-items:center;margin:0 0 60px;width:-moz-fit-content;width:fit-content}.btn-order-demo-wrapper.--horizontal a,.btn-try-free-wrapper.--horizontal a{margin-right:0}}
@media (max-width:768px){.btn{padding:1.063em 2em}.btn-order-demo-wrapper.--horizontal,.btn-try-free-wrapper.--horizontal{width:100%}}
.btn-try-free-wrapper{padding:0 20px}
.btn-try-free{display:flex;align-items:center;justify-content:center;margin-bottom:10px}
@media (max-width:576px){.btn-try-free{width:100%}}
.btn-try-free-info{font-size:16px;font-weight:400;line-height:130%;color:#8c9299}
.btn-secondary{background-color:#1f2937}
.btn-secondary:hover{background-color:#111827}
.btn-ai-test-wrapper .btn{display:flex;align-items:center;justify-content:center;min-width:360px;padding-top:20px;padding-bottom:20px}
@media (max-width:768px){.btn-ai-test-wrapper .btn{padding-top:14px;padding-bottom:14px}}
.btn-ai-test-wrapper .icon{width:24px;height:21px;margin-right:20px}
.menu-btn{display:none;justify-content:center;align-items:center;width:36px;height:36px;cursor:pointer;transition:.5s;margin-left:10px;border:1px solid #404145;border-radius:50%;z-index:30}
@media (max-width:1100px){.menu-btn{display:flex}}
.menu-btn__burger{position:relative;width:15px;height:2px;background:#fff;border-radius:5px}
.menu-btn__burger::after,.menu-btn__burger::before{content:"";position:absolute;width:100%;height:inherit;background:#fff;border-radius:5px;transition:transform .3s,top .3s .3s}
.menu-btn__burger::before{left:0;top:-5px}
.menu-btn__burger::after{left:0;top:5px}
.menu-btn.is-open .menu-btn__burger{background:0 0}
.menu-btn.is-open .menu-btn__burger::after,.menu-btn.is-open .menu-btn__burger::before{top:0;transition:top .3s,transform .3s .3s}
.menu-btn.is-open .menu-btn__burger::before{transform:rotate(45deg)}
.menu-btn.is-open .menu-btn__burger::after{transform:rotate(-45deg)}
@media (max-width:768px){.cookie-accept .btn.small{margin-top:20px;width:100%;text-align:center;padding:9px}}
.cookie-accept .btn.small{background:#fff;border:1px solid #000;min-width:initial;text-align:center;justify-content:center;color:#000}
.cookie-accept .btn.small:hover{background:#000;color:#fff}
.economy .btn-try-free-wrapper{padding:0;position:relative;z-index:10;pointer-events:none;margin:0 auto 80px}
.economy .btn-try-free-wrapper .btn{pointer-events:all}
.demo-banner .btn-try-free-wrapper{margin-bottom:0!important}
.header{z-index:60;font-family:'Golos Text',Inter,sans-serif;box-sizing:border-box}.header *{box-sizing:border-box}.header ul{list-style:none;margin:0;padding:0}.header a{text-decoration:none}.header button{font-family:inherit}.site-header-spacer{height:70px}#burger,#mobileMenu{display:none!important}
.footer,.footer *{box-sizing:border-box}.footer ul{list-style:none;margin:0;padding:0}.footer a{text-decoration:none;color:inherit}.footer h3{margin:0}.footer svg{display:block}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:400 900;font-display:swap;src:url(/instructions/assets/fonts/GolosText-v7-cyrillic-ext.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:400 900;font-display:swap;src:url(/instructions/assets/fonts/GolosText-v7-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:400 900;font-display:swap;src:url(/instructions/assets/fonts/GolosText-v7-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:400 900;font-display:swap;src:url(/instructions/assets/fonts/GolosText-v7-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Inter;font-style:normal;font-weight:300 700;font-display:optional;src:url(/instructions/assets/fonts/Inter-v20-cyrillic-ext.woff2) format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
@font-face{font-family:Inter;font-style:normal;font-weight:300 700;font-display:optional;src:url(/instructions/assets/fonts/Inter-v20-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:Inter;font-style:normal;font-weight:300 700;font-display:optional;src:url(/instructions/assets/fonts/Inter-v20-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:Inter;font-style:normal;font-weight:300 700;font-display:optional;src:url(/instructions/assets/fonts/Inter-v20-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
.footer{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 0;background-color:#101217;color:#fff}
@media (max-width:768px){.footer{padding:40px 0;border-top:1px solid #3d444a}}
.footer__container{width:100%;padding:0 20px}
.footer__row{display:grid;row-gap:40px}
@media (min-width:768px){.footer__container{padding:0 50px}.footer__row{grid-template-columns:1.2fr 1fr;-moz-column-gap:50px;column-gap:50px}}
.footer__col:last-child{display:flex;flex-direction:column}
@media (max-width:767px){.footer__col{order:2}.footer__col:first-child{order:0}.footer__col:nth-child(3){order:1}}
@media (min-width:768px) and (max-width:1400px){.footer__col{order:2}.footer__col:first-child{order:0}.footer__col:nth-child(3){order:1}.footer__col:nth-child(5){order:0}.footer__col:last-child{grid-row-start:2;grid-row-end:5;grid-column-start:2}.footer--light .footer__col:last-child{grid-row-start:auto;grid-row-end:auto;grid-column-start:auto}.footer--light .footer__col,.footer--light .footer__col:first-child,.footer--light .footer__col:nth-child(3),.footer--light .footer__col:nth-child(5){order:0}}
.footer__logotype{display:inline-flex;align-items:center;flex-wrap:nowrap;white-space:nowrap;margin-bottom:25px;font-size:14px;line-height:1.15;color:#8c9299;text-decoration:none;transition:color 240ms ease-in-out}
.footer__logotype:hover{color:#2284ff}
.footer__logotype:hover svg path{fill:#2284ff}
.footer__logotype svg{width:150px;height:36px}
.footer__logotype svg path{transition:fill 240ms ease-in-out}
.footer__logotype span{display:inline-block;margin:0 15px;width:1px;height:16px;background-color:#8c9299}
.footer__contacts-list{list-style:none;padding:0;margin:0 0 30px;display:grid;row-gap:14px}
.footer__contacts-link{display:inline-flex;align-items:center;text-decoration:none;color:#fff;font-size:14px;letter-spacing:-.2px;transition:opacity .3s}
.footer__contacts-link svg{display:block;flex-shrink:0;width:20px;height:20px}
.footer__contacts-link span{margin-left:10px}
.footer__contacts-link:hover{opacity:.7}
.footer__social-block{margin-top:10px}
.footer__title{margin-bottom:16px;color:#fff;font-size:16px;font-weight:500;letter-spacing:-.2px}
.footer__socials-icons{display:flex;margin-top:10px;gap:15px}
.footer__socials-link{display:block;cursor:pointer;transition:.3s}
.footer__socials-link:hover{opacity:.7;transform:scale(.9)}
.footer__socials-link--circle{width:40px;height:40px}
.footer__links-list{list-style:none;padding:0;margin:0;display:grid;row-gap:15px}
.footer__link{font-size:14px;line-height:1.3;letter-spacing:-.2px;color:#fff;text-decoration:none;transition:opacity .3s}
.footer__link:hover{opacity:.7}
.footer__meta{margin-top:40px}
@media (min-width:768px){.footer__meta{margin-top:auto;padding-top:12px}}
.footer__text-link{font-size:14px;color:#8c9299;text-decoration:none;font-family:Inter,sans-serif}
.footer__text-link:hover{opacity:.7}
.footer__copyright{font-size:14px;color:#8c9299}
.footer__it-notice{margin-top:30px;padding-top:20px;border-top:1px solid #3d444a;color:#8c9299;font-size:12px;line-height:1.65}
.footer__it-notice p+p{margin-top:6px}
@media (min-width:768px){.footer__it-notice{margin-top:40px;padding-top:24px}}
.footer--light{background-color:#fff;box-shadow:0 7px 70px 0 rgba(4,15,29,.05);padding:40px 20px;font-family:"Golos Text",sans-serif}
@media (max-width:768px){.footer--light{border-top:none}}
@media (min-width:992px){.footer--light{padding:40px 0}}
.footer--light .footer__container{max-width:697px;padding:0 20px}
@media (min-width:1400px){.footer__row{grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;-moz-column-gap:16px;column-gap:16px}.footer--light .footer__container{max-width:2000px;padding:0 40px}}
.footer--light .footer__row{row-gap:20px}
.footer--light .footer__col:last-child{display:block}
.footer--light .footer__logotype{color:#5c636d}
.footer--light .footer__logotype span{background-color:#d2ddeb}
.footer--light .footer__contacts-link{color:#000}
.footer--light .footer__contacts-link:hover span{text-decoration:underline}
.footer--light .footer__title{color:#000;font-weight:500}
.footer--light .footer__socials-icons{margin-bottom:0}
.footer--light .footer__socials-link svg rect:first-child{fill:#eef2f6;transition:fill 240ms}
.footer--light .footer__socials-link:hover svg rect:first-child{fill:rgba(0,100,225,.12)}
.footer--light .footer__link{color:#5c636d;text-decoration:none}
.footer--light .footer__link:hover{color:#2284ff;text-decoration:none;opacity:1}
.footer--light .footer__meta{margin-top:15px}
@media (min-width:768px){.footer--light .footer__row{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr 1fr;-moz-column-gap:30px;column-gap:30px;align-items:start;row-gap:0}.footer--light .footer__meta{margin-top:15px;padding-top:0}}
.footer--light .footer__text-link{color:#5c636d;text-decoration:none}
.footer--light .footer__text-link:hover{color:#2284ff;text-decoration:none}
.footer--light .footer__copyright{color:#8d98a6}
.menu__footer-mobile{display:none!important}
@media (max-width:1100px){.menu__footer-mobile{display:flex!important;margin-top:auto;padding-top:15px;border-top:1px solid rgba(4,15,29,.08)}}
.menu__footer-mobile{display:flex;align-items:center;justify-content:space-between;width:100%}
@media (max-width:425px){.menu__footer-mobile{flex-wrap:wrap}}