:root { --background: #08090b; --foreground: #f3f4f7; --muted: #aaaeb7; --dim: #969ba6; --accent: #2b7bf6; --line: rgba(255, 255, 255, .13); --font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif; color-scheme: dark; font-family: var(--font); font-synthesis: none; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; background: var(--background); color: var(--foreground); scroll-behavior: smooth; scroll-padding-top: 100px; } * { box-sizing: border-box; } /* ПОЛОСА ПРОКРУТКИ СКРЫТА, А ПРОКРУТКА РАБОТАЕТ. Колесо, пальцы на трекпаде, клавиши и переходы по якорям — всё на месте; не рисуется только сама полоска. Это заодно снимает боковой сдвиг: полоса, которой нет, не отнимает ширины у страницы, и длинная страница больше не уезжает вбок относительно короткой. Плата честная: пропадает указатель того, сколько ещё осталось прокрутить. */ html { scrollbar-width: none; /* Firefox */ -ms-overflow-style: none; /* старая Edge */ } html::-webkit-scrollbar, body::-webkit-scrollbar { width: 0; height: 0; display: none; } body { margin: 0; min-width: 320px; } button, a { -webkit-tap-highlight-color: transparent; } button { font: inherit; } a { color: inherit; text-decoration: none; } button, a { touch-action: manipulation; } a:focus-visible, button:focus-visible { outline: 2px solid #83b7ff; outline-offset: 7px; border-radius: 4px; } img { display: block; max-width: 100%; } button { color: inherit; } ::selection { color: white; background: #245fb6; } [hidden] { display: none !important; } .shell { width: min(1440px, 100% - 112px); margin-inline: auto; } .skip-link { position: fixed; top: 12px; left: 12px; z-index: 100; padding: 14px 20px; background: #fff; color: #000; transform: translateY(-180%); } .skip-link:focus { transform: translateY(0); } .site-header { position: absolute; top: 0; inset-inline: 0; z-index: 20; } .header-inner { display: flex; align-items: center; height: 102px; gap: 36px; } .brand { display: inline-flex; align-items: center; gap: 11px; font-size: 23px; font-weight: 640; letter-spacing: -.04em; } /* Знак теперь без подложки: скруглять нечего, пропорции буквы 148×118. */ .brand img { flex: none; } .navigation { display: flex; gap: 35px; margin-left: auto; } .navigation a, .login-link { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; color: #c4c6cc; transition: color .2s; } .navigation a:hover, .login-link:hover { color: #fff; } .login-link { gap: 12px; margin-left: 24px; } .login-link span { color: #8b909b; } .menu-toggle, .mobile-navigation { display: none; } .scene { position: relative; isolation: isolate; overflow: clip; } .scene-art { position: absolute; inset: 0; z-index: -2; overflow: hidden; pointer-events: none; } .scene-art img { width: 100%; height: 100%; object-fit: cover; } .eyebrow { margin: 0 0 28px; font-size: 14px; line-height: 1.5; letter-spacing: .025em; font-weight: 450; color: var(--muted); } h1, h2, p { margin-top: 0; } .button { min-height: 54px; padding: 15px 24px; display: inline-flex; gap: 26px; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.13); border-radius: 11px; font-size: 16px; font-weight: 510; transition: background .2s, box-shadow .2s, transform .2s; } .button-primary { background: linear-gradient(135deg, #2268d7, #2268d7 55%, #1a50b3); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.23), 0 4px 18px rgba(0,0,0,.18); } .button-primary:hover { background: linear-gradient(135deg, #286fdd, #296edb 55%, #205dc1); box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 5px 24px rgba(28,91,205,.18); transform: translateY(-1px); } .button-primary:active { transform: translateY(0); } .button span { font-size: 19px; font-weight: 400; } h2 { font-size: clamp(44px, 4.2vw, 66px); font-weight: 570; letter-spacing: -.052em; line-height: 1.08; margin-bottom: 31px; } .text-dim { color: var(--dim); } .section-description { max-width: 420px; font-size: 18px; line-height: 1.65; color: #b2b5bf; margin-bottom: 34px; } .text-link { font-size: 16px; color: #70afff; display: inline-flex; gap: 22px; align-items: center; min-height: 44px; } .text-link:hover { color: #a1caff; } .layout-page h1 { font-size: clamp(34px, 3.3vw, 64px); font-weight: 400; letter-spacing: -.04em; line-height: 1.09; margin-bottom: 37px; max-width: 760px; color: #f6f7fa; } /* Shared controls keep the approved hero defaults above. */ .brand { min-height: 44px; } button, summary, input, select, textarea { font: inherit; } button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible { outline: 2px solid #83b7ff; outline-offset: 7px; border-radius: 4px; } .button-primary:not(.hero-cta) { min-height: 56px; padding: 0 13px 0 22px; border-radius: 7px; gap: 20px; background: linear-gradient(145deg,#0950ef,#0643d3); border-color: rgba(90,146,255,.38); box-shadow: inset 0 1px 0 rgba(255,255,255,.14); font-size: 16px; font-weight: 450; letter-spacing: -.016em; } .button-primary:not(.hero-cta):hover { background: linear-gradient(145deg,#286fdd,#2064d0); } .button-primary:not(.hero-cta) .button-label { font-size: 16px; font-weight: 450; letter-spacing: -.016em; } .button-primary:not(.hero-cta) .button-arrow { width: 35px; height: 35px; border-left: 1px solid rgba(255,255,255,.24); display: grid; place-items: center; padding-left: 9px; font-size: 21px; font-weight: 400; } .layout-page #main { padding-top: 156px; } @media (max-width: 1100px) { .shell { width: calc(100% - 72px); } h2 { font-size: 48px; } } @media (max-width: 1000px) { .layout-page h1 { font-size: clamp(32px, 5.2vw, 50px); max-width: 100%; } } @media (max-width: 700px) { :root { scroll-padding-top: 26px; } .shell { width: calc(100% - 40px); } .header-inner { min-height: 82px; height: auto; gap: 8px 20px; flex-wrap: wrap; padding-block: 15px; } .menu-ready .header-inner { height: 82px; flex-wrap: nowrap; padding-block: 0; } .brand { font-size: 22px; gap: 9px; } .brand img { width: 30px; height: 24px; } .navigation { display: flex; order: 3; width: 100%; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin-left: 0; } .navigation a { font-size: 13px; min-height: 44px; } .login-link { margin-left: auto; } .menu-ready .navigation, .menu-ready .login-link { display: none; } .menu-toggle { display: none; flex-direction: column; align-items: center; justify-content: center; gap: 6px; width: 44px; height: 44px; border: 0; padding: 0; background: transparent; margin-left: auto; cursor: pointer; } .menu-ready .menu-toggle { display: flex; } .menu-toggle span { width: 21px; height: 1px; background: #e6e8ed; transition: transform .2s; } .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); } .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); } .mobile-navigation:not([hidden]) { display: flex; flex-direction: column; padding: 8px 20px 20px; border-bottom: 1px solid var(--line); background: rgba(8,9,11,.97); box-shadow: 0 20px 40px rgba(0,0,0,.35); } .mobile-navigation a { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 15px 5px; font-size: 16px; } .eyebrow { font-size: 13px; margin-bottom: 25px; } .layout-page h1 { font-size: clamp(24px,6.9vw,46px); line-height: 1.09; letter-spacing: -.04em; margin-bottom: 27px; } h2 { font-size: clamp(36px,9.4vw,54px); line-height: 1.09; margin-bottom: 25px; } .section-description { font-size: 16px; line-height: 1.65; margin-bottom: 27px; max-width: 460px; } .button { min-height: 53px; padding: 14px 20px; font-size: 15px; gap: 20px; } .button-primary:not(.hero-cta) { min-height: 58px; padding: 0 10px 0 18px; gap: 16px; } .button-primary:not(.hero-cta) .button-label { font-size: 15px; } .button-primary:not(.hero-cta) .button-arrow { width: 29px; height: 31px; padding-left: 8px; } .site-footer .brand img { width: 24px; height: 19px; } } @media (prefers-reduced-motion: reduce) { :root { scroll-behavior: auto; } *, *::before, *::after { animation: none !important; transition: none !important; } .scene-art img { transform: none !important; } } @media (max-width: 1000px) { .footer-brand { grid-column: 1 / -1; } } @media (max-width: 700px) { } /* Подвал ОДИН И ТОТ ЖЕ на всех страницах сайта и кабинета — ровно этого владелец просил 9 сентября, показывая образец. Раскладка прежняя: знак, копирайт, ряд ссылок. Правится в двух местах сразу, иначе они снова разойдутся, как расходились до 7 сентября. ИМЯ ОБРАЗЦА УБРАНО НАРОЧНО. Здесь стоял адрес из сетки сбора отпечатков, и этот комментарий уезжал на публичный сайт байт в байт: генератор копирует CSS как есть. Любой, кто открыл стили, видел, что владелец Mantia знаком с тем сайтом, — а сетка сбора это коммерческая тайна дела. Нашёл Кодекс при разборе утечек 14 сентября 2026. */ .site-footer { display: flex; gap: 30px; align-items: center; min-height: 115px; flex-wrap: wrap; padding-block: 20px; border-top: 1px solid var(--line); } .site-footer .brand { font-size: 18px; gap: 9px; } .copyright { font-size: 13px; color: #9DA2AF; } .footer-navigation { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; margin-left: auto; } .footer-navigation a { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; color: #B7BDC8; transition: color .2s; } .footer-navigation a:hover { color: #fff; } /* Переключатель языка. Ведёт на ЭТУ ЖЕ страницу на другом языке, поэтому стоит в подвале, а не в шапке: это не раздел сайта, а вид одного и того же раздела. Названия языков — на самих языках и без флагов: флаг обозначает страну, а не язык, и испанцу с флагом Испании странно так же, как русскому с флагом России на английской версии. Собран на
: языков будет десять, строкой они не помещаются, а