/* RETACH HEADER FONT ALIAS START */ @font-face { font-family: "RETACH Header Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/retach/95b9ea830580b57e.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: "RETACH Header Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/retach/1e8edb2fc100b7f7.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } @font-face { font-family: "RETACH Header Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/retach/6d0a674525fee3dd.woff2) format('woff2'); unicode-range: U+1F00-1FFF; } @font-face { font-family: "RETACH Header Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/retach/dbc85b0dfbaaa315.woff2) format('woff2'); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; } @font-face { font-family: "RETACH Header Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/retach/4c2d4a14f23a8ed5.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } @font-face { font-family: "RETACH Header Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/retach/a9d11b3ffe7aa537.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: "RETACH Header Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/retach/e3237528af752eed.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: "RETACH Header Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/fonts/retach/95b9ea830580b57e.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: "RETACH Header Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/fonts/retach/1e8edb2fc100b7f7.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } @font-face { font-family: "RETACH Header Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/fonts/retach/6d0a674525fee3dd.woff2) format('woff2'); unicode-range: U+1F00-1FFF; } @font-face { font-family: "RETACH Header Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/fonts/retach/dbc85b0dfbaaa315.woff2) format('woff2'); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; } @font-face { font-family: "RETACH Header Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/fonts/retach/4c2d4a14f23a8ed5.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } @font-face { font-family: "RETACH Header Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/fonts/retach/a9d11b3ffe7aa537.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: "RETACH Header Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/fonts/retach/e3237528af752eed.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: "RETACH Header Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/retach/95b9ea830580b57e.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: "RETACH Header Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/retach/1e8edb2fc100b7f7.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } @font-face { font-family: "RETACH Header Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/retach/6d0a674525fee3dd.woff2) format('woff2'); unicode-range: U+1F00-1FFF; } @font-face { font-family: "RETACH Header Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/retach/dbc85b0dfbaaa315.woff2) format('woff2'); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; } @font-face { font-family: "RETACH Header Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/retach/4c2d4a14f23a8ed5.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } @font-face { font-family: "RETACH Header Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/retach/a9d11b3ffe7aa537.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: "RETACH Header Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/retach/e3237528af752eed.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; } /* RETACH HEADER FONT ALIAS END */ /* * RETACH HEADER — SINGLE CSS OWNER * * TEST PHASE: * connected only to direct-calc-v3.html. * * Do not add page-specific styles here. */ /* ============================================================ RETACH HEADER — AUTONOMOUS BASE Единственный DOM: /partials/v2/header.html Этот слой намеренно scoped через #site-header. ============================================================ */ #site-header{ /* Свои переменные шапки — не берём случайно со страницы */ --brand-1:#7FB8FF; --brand-2:#AFA4FF; --brand-3:#FF97AA; --duration-fast:150ms; --duration-base:250ms; --easing-smooth: cubic-bezier(.22,.61,.36,1); font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; font-size:16px; font-weight:400; line-height:1.2; color:#1B1F23; text-align:left; text-transform:none; letter-spacing:normal; word-spacing:normal; } #site-header, #site-header *, #site-header *::before, #site-header *::after{ box-sizing:border-box; } /* ------------------------------ Generic tags inside header ------------------------------ */ #site-header a{ color:inherit; text-decoration:none; } #site-header button, #site-header input, #site-header select, #site-header textarea{ font-family:inherit; color:inherit; } #site-header button{ -webkit-appearance:none; appearance:none; } #site-header img, #site-header svg{ display:block; } #site-header ul{ margin:0; padding:0; } #site-header button, #site-header a, #site-header summary{ -webkit-tap-highlight-color:transparent; } /* ------------------------------ Desktop navigation typography Важное: одинаковая ширина текста независимо от CSS конкретной страницы. ------------------------------ */ #site-header .nav-links, #site-header .nav-links a, #site-header .nav-links .subbtn{ font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif; } #site-header .nav-links a, #site-header .nav-links .subbtn{ font-size:16px; font-weight:500; line-height:1.2; letter-spacing:normal; text-transform:none; white-space:nowrap; } /* Dropdown caret тоже больше не зависит от Manrope, который загружен не на каждой странице. */ #site-header .nav-links .subbtn .caret{ font-family: Inter, system-ui, sans-serif; } /* ------------------------------ Native button isolation ------------------------------ */ #site-header .nav-links button.subbtn{ -webkit-appearance:none; appearance:none; margin:0; border:0; background:transparent; box-shadow:none; color:inherit; cursor:pointer; } /* ============================================================ /RETACH HEADER — AUTONOMOUS BASE ============================================================ */ /* RETACH SHELL — exact CSS copied from shared partials */ /* ============================================================ RETACH MIGRATED FROM SHARED — MOBILE LOGO SIZE Original owner: retach-shared.css. ============================================================ */ /* Лого в шапке крупнее на мобиле */ /* :contentReference[oaicite:9]{index=9} */ @media (max-width:980px){ .nav .brand img{ height:56px !important; width:auto !important; display:block; } } @media (max-width:740px){ .nav .brand img{ height:64px !important; } } /* ============================================================ RETACH MIGRATED FROM SHARED — MOBILE HEADER UNIFIED Original cascade position: before migrated header gutters. ============================================================ */ /* === RETACH mobile header unified, 2026-05-16 === */ /* На мобиле верхняя шапка как на СегТач: лого + иконки связи + бургер. Текстовые пункты уходят в боковое меню. */ @media (max-width: 980px){ nav.nav .nav-inner, .nav .nav-inner{ display:flex !important; align-items:center !important; justify-content:space-between !important; gap:10px !important; } nav.nav .brand, .nav .brand{ flex:0 0 auto !important; display:flex !important; align-items:center !important; } /* Скрываем текстовую навигацию в верхней шапке */ nav.nav .nav-links, .nav .nav-links{ display:none !important; } /* Но иконки связи/бургер оставляем */ nav.nav .nav-actions, .nav .nav-actions{ margin-left:auto !important; display:flex !important; align-items:center !important; justify-content:flex-end !important; gap:8px !important; flex:0 0 auto !important; } /* Если MAX был помечен only-desktop — на мобиле всё равно показываем */ nav.nav .nav-actions .nav-icon.nav-max, nav.nav .nav-actions .nav-icon.nav-max.only-desktop, .nav .nav-actions .nav-icon.nav-max, .nav .nav-actions .nav-icon.nav-max.only-desktop{ display:inline-flex !important; } /* Боковое меню должно быть выше нижнего мобильного меню */ #mnavDrawer, #mnavDrawer.mnav-drawer{ z-index:1000002 !important; } #mnavDrawer .mnav-backdrop{ z-index:1 !important; } #mnavDrawer .mnav-panel{ z-index:2 !important; } /* Кнопка бургера выше шапки, но ниже открытого drawer */ #mnavBtn, .mnav-toggle{ display:inline-flex !important; position:relative !important; z-index:1001 !important; } } /* ============================================================ RETACH MIGRATED FROM SHARED — HEADER GUTTERS Original cascade position: shared.css before shell.css. ============================================================ */ /* === RETACH header horizontal gutters, 2026-05-16 === */ /* Единые отступы шапки от левого/правого края экрана */ nav.nav > .container.nav-inner, nav.nav .container.nav-inner, .nav > .container.nav-inner, .nav .container.nav-inner{ width:100% !important; max-width:none !important; margin-left:auto !important; margin-right:auto !important; padding-left:clamp(18px, 4vw, 52px) !important; padding-right:clamp(18px, 4vw, 52px) !important; box-sizing:border-box !important; } /* На мобильной версии делаем компактнее, но не вплотную к краям */ @media (max-width:980px){ nav.nav > .container.nav-inner, nav.nav .container.nav-inner, .nav > .container.nav-inner, .nav .container.nav-inner{ padding-left:16px !important; padding-right:16px !important; } } /* На совсем узких экранах чуть экономим место */ @media (max-width:380px){ nav.nav > .container.nav-inner, nav.nav .container.nav-inner, .nav > .container.nav-inner, .nav .container.nav-inner{ padding-left:12px !important; padding-right:12px !important; } } /* ============================================================ RETACH HEADER ACTION ICONS — CANONICAL OWNER Consolidated from former retach-shared.css icon section. Dead legacy TG/WA overrides intentionally not migrated. ============================================================ */ /* Callback action in the desktop header */ .nav-icon.cb-call{ display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; padding:8px; margin-left:8px; border:0; background:transparent; border-radius:50%; line-height:1; box-shadow:0 2px 10px rgba(0,0,0,.08); cursor:pointer; transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease; } .nav-icon.cb-call img{ display:block; width:24px !important; height:24px !important; aspect-ratio:1/1; object-fit:contain; border-radius:0 !important; transform:none !important; } .nav-icon.cb-call:hover{ transform:translateY(-1px); box-shadow:0 6px 18px rgba(0,0,0,.16); } .nav-icon.cb-call:active{ transform:translateY(0) scale(.98); } /* MAX already has its dimensions/background/hover owned by nav-icons-standard-compact + max-icon-final-size below. Preserve only the old generic image reset that was still effective. */ .nav-icon.nav-max img{ border-radius:0 !important; aspect-ratio:1/1; } @media (max-width:980px){ /* Callback button: preserve current 44px mobile action */ .nav-icon.cb-call{ width:44px; height:44px; padding:0; border-radius:12px !important; background:rgba(255,255,255,.72) !important; box-shadow:0 4px 16px rgba(0,0,0,.12) !important; backdrop-filter:saturate(110%) blur(6px); transition:transform .15s, box-shadow .15s; } /* Burger currently finishes at 40x40 from the later shell rule. Do NOT restore obsolete 44x44 here. Preserve only properties from shared that still win today. */ .mnav-toggle{ padding:0; border-radius:12px !important; background:rgba(255,255,255,.72) !important; box-shadow:0 4px 16px rgba(0,0,0,.12) !important; backdrop-filter:saturate(110%) blur(6px); transition:transform .15s, box-shadow .15s; } /* Existing effective mobile size was 24px !important. */ #mnavLottie{ width:24px !important; height:24px !important; } /* Old generic mobile .nav-icon rule also left this property effective on MAX; retain it without carrying the whole legacy rule. */ .nav-icon.nav-max{ backdrop-filter:saturate(110%) blur(6px); } } /* ============================================================ RETACH MIGRATED FROM SHARED — CALLBACK Exact former retach-shared.css callback block. ============================================================ */ /* ===== 7) Модалка «обратный звонок» (callback) ========================= */ /* То, что открывается по [data-cb-open] в шапке. */ /* :contentReference[oaicite:13]{index=13} */ .cb-modal[hidden]{ display:none !important; } .cb-modal{ position:fixed; inset:0; z-index:9999; } .cb-backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.35); } .cb-dialog{ position:relative; margin:6vh auto; width:min(560px,92vw); background:#fff; border-radius:16px; padding:20px 20px 16px; box-shadow:0 20px 60px rgba(0,0,0,.2); } .cb-x{ position:absolute; right:10px; top:8px; border:0; background:transparent; font-size:24px; cursor:pointer; } .cb-row{ margin:10px 0; } .cb-row input[type="tel"]{ width:100%; padding:10px 12px; border:1px solid #e6e7eb; border-radius:10px; } /* согласие + ссылки на политику */ .cb-consent{ display:inline-flex; align-items:center; gap:10px; margin:10px 0 8px; font-size:.95rem; line-height:1.35; user-select:none; } .cb-consent input{ flex:0 0 auto; width:18px; height:18px; margin:0; accent-color:#4f7cff; } .cb-consent a{ color:#1f58ff; text-decoration:underline; text-underline-offset:2px; } .cb-consent a:hover{ text-decoration-thickness:2px; } .cb-actions{ display:flex; gap:8px; margin-top:8px; } .cb-submit{ background:#4f7cff; color:#fff; border:0; border-radius:12px; padding:10px 14px; cursor:pointer; } .cb-cancel{ background:#f3f4f6; border:0; border-radius:12px; padding:10px 14px; cursor:pointer; } .cb-msg{ min-height:1.2em; margin:8px 2px 0; opacity:.9; } .cb-hp{ position:absolute; left:-9999px; width:1px; height:1px; opacity:0; } /* honeypot */ @media (max-width:740px){ .cb-dialog{ margin:8vh auto; } } /* SOURCE header: nav-icons-standard-compact */ /* Единый вид TG/WA */ .nav-icon.nav-tg, .nav-icon.nav-wa, .nav-icon.nav-max{ display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; margin-left:8px; padding:0; border:0; border-radius:12px; background:transparent !important; box-shadow:none !important; line-height:1; vertical-align:middle; cursor:pointer; transition:transform .15s, filter .15s; } .nav-icon.nav-tg img, .nav-icon.nav-wa img{ width:24px; height:24px; display:block } .nav-icon.nav-max img{ width:48px; height:48px; display:block; transform:none; } @media (hover:hover){ .nav-icon.nav-tg:hover, .nav-icon.nav-wa:hover, .nav-icon.nav-max:hover{ transform:translateY(-1px); filter:drop-shadow(0 6px 18px rgba(0,0,0,.16)) } .nav-icon.nav-tg:active, .nav-icon.nav-wa:active, .nav-icon.nav-max:active{ transform:translateY(0); filter:none } } .nav-icon.nav-tg:focus-visible, .nav-icon.nav-wa:focus-visible, .nav-icon.nav-max:focus-visible{ outline:2px solid rgba(127,184,255,.45); outline-offset:2px } /* Лэйаут шапки */ .nav-inner{ display:flex; align-items:center; justify-content:space-between; gap:12px; } .nav-actions{ display:flex; align-items:center; gap:8px; } @media (max-width:980px){ .only-desktop{ display:none !important } } /* Кнопка-гамбургер поверх всего */ .mnav-toggle{ position:relative; z-index:1040; display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; background:transparent; border:0; margin-left:8px } /* центрируем и #mnavLottie, и fallback абсолютно поверх друг друга */ .mnav-toggle > #mnavLottie, .mnav-toggle > .mnav-fallback{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:24px; height:24px; display:block; pointer-events:none; /* чтобы клик ловила кнопка */ } /* Лотти видимая, родные цвета */ #mnavLottie{ opacity:1 !important; } #mnavLottie svg{ width:100%; height:100%; display:block } /* прячем fallback, когда Лотти загрузился (класс ставит JS) */ .mnav-toggle.loaded .mnav-fallback{ opacity:0; visibility:hidden; } /* ЛОТТИ — размер + видимость */ #mnavLottie{ width:24px; height:24px; display:inline-block !important; opacity:1 !important; } #mnavLottie svg{ width:100%; height:100%; display:block } /* Fallback-иконка: показ сразу, скрыть когда появился svg */ .mnav-fallback{ width:24px; height:24px; display:inline-block } /* прячем fallback, когда кнопка помечена как загруженная */ .mnav-toggle.loaded .mnav-fallback{ display:none } /* цвет иконки-бургера от темы (как у TG/WA) */ .mnav-toggle{ color:#7a8cff; } /* можно настроить оттенок */ .mnav-fallback rect{ fill: currentColor; } /* Базовая выезжалка (если нет общего CSS) */ .mnav-drawer[hidden]{ display:none !important } .mnav-drawer{ position:fixed; inset:0; z-index:1035 } .mnav-backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.35); opacity:0; pointer-events:none; transition:opacity .25s ease } .mnav-panel{ position:absolute; top:0; right:0; height:100%; width:min(86vw,360px); background:#fff; box-shadow:-24px 0 64px rgba(0,0,0,.24); transform:translateX(100%); transition:transform .28s cubic-bezier(.22,.61,.36,1); display:flex; flex-direction:column; padding:14px } .mnav-drawer.on .mnav-backdrop{ opacity:1; pointer-events:auto } .mnav-drawer.on .mnav-panel{ transform:translateX(0) } @media (min-width:981px){ .mnav-toggle{ display:none !important; } /* скрыть бургер на десктопе */ } /* ============================================================ RETACH DRAWER ESSENTIALS — CANONICAL OWNER Consolidated from former retach-shared.css drawer section. Duplicated core remains owned by shell rules above/below. ============================================================ */ .mnav-toggle:active{ transform:scale(.98); } .mnav-close{ align-self:flex-end; border:0; background:transparent; font-size:28px; line-height:1; width:40px; height:40px; border-radius:10px; cursor:pointer; } .mnav-list{ list-style:none; margin:8px 0 0; padding:0; } .mnav-list li{ margin:2px 0; } .mnav-list a{ display:block; padding:12px 14px; border-radius:12px; color:#111; text-decoration:none; } .mnav-list a:active{ background:#f3f4f6; } .mnav-footer{ margin-top:auto; display:flex; gap:8px; } .mnav-footer .btn{ flex:1 1 auto; padding:12px 14px; border-radius:12px; text-align:center; text-decoration:none; } body.mnav-lock{ overflow:hidden; } /* SOURCE header: nav-fixed-glass-global-2026-01-14 */ /* Липкая/фиксированная шапка со “льдинкой” как на главной */ nav.nav{ position: fixed; top: 0; left: 0; right: 0; z-index: 1100; background: rgba(255,255,255,.58); border-bottom: 1px solid rgba(17,24,39,.08); box-shadow: 0 8px 24px rgba(0,0,0,.08); -webkit-backdrop-filter: saturate(120%) blur(10px); backdrop-filter: saturate(120%) blur(10px); transition: background .2s ease, box-shadow .2s ease; } /* Отступ под фикс-шапку */ body{ padding-top: var(--navH, 64px); } /* Чуть плотнее при скролле */ body.nav-glass nav.nav{ background: rgba(255,255,255,.66); box-shadow: 0 10px 30px rgba(0,0,0,.12); } /* Фолбэк, если blur не поддерживается */ @supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){ nav.nav{ background: rgba(255,255,255,.92); } } /* SOURCE header: nav-services-dropdown-2025-10-29 */ /* ===== Desktop: выпадающее меню «Услуги» ===== */ .nav-links .has-sub{ position:relative; } .nav-links .subbtn{ display:inline-flex; align-items:center; gap:6px; font:500 16px/1.2 Inter,system-ui; text-decoration:none; color:inherit; padding:0 0 2px; border:0; background:transparent; cursor:pointer; } .nav-links .subbtn .caret{ font:900 10px/1 Manrope,system-ui; opacity:.7; transform:translateY(-1px); } .nav-links .nav-sub{ position:absolute; top:100%; left:0; min-width:220px; z-index:1000; margin-top:10px; /* визуальный зазор без разрыва ховера */ display:none; padding:10px; border-radius:16px; background:#fff; border:1px solid rgba(27,31,35,.10); box-shadow:0 24px 64px rgba(0,0,0,.16); } /* Показ по классу (для клика/клавиатуры) */ .nav-links .has-sub.open .nav-sub{ display:block; } /* «Мостик» ховера между кнопкой и выпадашкой — чтобы курсор не «проваливался» */ .nav-links .has-sub::after{ content:""; position:absolute; left:-8px; right:-8px; top:100%; height:12px; } /* Поворот стрелочки, когда меню закреплено кликом */ .nav-links .has-sub.open .subbtn .caret{ transform:rotate(180deg) translateY(1px); } .nav-links .nav-sub a{ display:block; padding:8px 10px; border-radius:10px; text-decoration:none; color:#0b1324; } .nav-links .nav-sub a:hover{ background:#f5f7fb; } .nav-links .has-sub:hover .nav-sub, .nav-links .has-sub:focus-within .nav-sub{ display:block; } /* Чтоб выпадашка не уезжала за правый край */ @media (min-width:981px){ .nav-links{ display:flex; gap:16px; align-items:center; } .nav-links .has-sub{ display:inline-flex; align-items:center; } } /* ===== Mobile drawer: подменю «Услуги» на
===== */ .mnav-list details.mnav-sub{ border:1px solid #eef1f5; border-radius:12px; padding:6px 8px; } .mnav-list details.mnav-sub summary{ list-style:none; cursor:pointer; padding:10px 6px; font-weight:700; display:flex; align-items:center; justify-content:space-between; } .mnav-list details.mnav-sub summary::-webkit-details-marker{ display:none; } .mnav-list details.mnav-sub[open]{ background:#fafbff; } .mnav-list details.mnav-sub ul{ list-style:none; margin:0; padding:6px 0 8px 6px; display:grid; gap:6px; } .mnav-list details.mnav-sub a{ display:block; padding:8px 10px; border-radius:8px; text-decoration:none; color:#0b1324; } .mnav-list details.mnav-sub a:hover{ background:#f3f5fb; } /* Подпункт под "СегТач" в desktop dropdown */ .nav-links .nav-sub a.nav-sub-child{ padding-left: 22px; font-size: 14px; opacity: .82; } .nav-links .nav-sub a.nav-sub-child:hover{ opacity: 1; } /* Mobile drawer: подпункт под "СегТач" */ .mnav-list .mnav-subchild a{ padding-left: 22px; opacity: .9; } /* SOURCE header: max-icon-final-size */ .nav-actions .nav-icon.nav-max, .mnav-contacts .nav-icon.nav-max{ width:44px !important; height:44px !important; flex:0 0 44px !important; background:transparent !important; box-shadow:none !important; border-radius:0 !important; overflow:visible !important; } .nav-actions .nav-icon.nav-max img, .mnav-contacts .nav-icon.nav-max img{ width:44px !important; height:44px !important; min-width:44px !important; min-height:44px !important; max-width:none !important; max-height:none !important; display:block !important; transform:none !important; object-fit:contain !important; } /* RETACH HEADER NAV LINKS — CANONICAL OWNER START */ /* * Стандартное оформление ссылок десктопной шапки. * * Раньше этот слой случайно жил в /styles.css. * Теперь его единственный владелец — retach-shell.css. */ .nav-links a{ position:relative; padding:10px 12px; border-radius:16px; white-space:nowrap; transition: background var(--duration-fast) var(--easing-smooth), transform var(--duration-fast) var(--easing-smooth); } .nav-links a:hover{ background: linear-gradient( 135deg, rgba(207,230,255,.16), rgba(216,243,229,.14), rgba(255,214,194,.12) ); } .nav-links a::after{ content:""; position:absolute; left:10px; right:10px; bottom:6px; height:2px; border-radius:2px; background: linear-gradient( 90deg, var(--brand-1), var(--brand-2), var(--brand-3) ); transform:scaleX(0); transform-origin:left; transition: transform var(--duration-base) var(--easing-smooth); pointer-events:none; } .nav-links a:hover::after, .nav-links a:focus-visible::after{ transform:scaleX(1); } .nav-links a:active{ transform:translateY(1px); } /* RETACH HEADER NAV LINKS — CANONICAL OWNER END */ /* Header mobile contacts */ .mnav-contacts{ margin-top:auto; display:flex; gap:10px; padding-top:12px; border-top:1px solid #eef1f5; } /* RETACH HEADER BRAND BASE START */ #site-header .brand{ flex:0 0 auto; display:inline-flex; align-items:center; text-decoration:none; } #site-header .brand img{ display:block; width:auto; height:64px; } /* RETACH HEADER BRAND BASE END */ /* RETACH HEADER TYPOGRAPHY LOCK START */ #site-header{ font-family: "RETACH Header Inter", system-ui, -apple-system, "Segoe UI", sans-serif; font-synthesis:none; } #site-header .nav-links, #site-header .nav-links a, #site-header .nav-links .subbtn{ font-family: "RETACH Header Inter", system-ui, -apple-system, "Segoe UI", sans-serif; font-synthesis:none; } #site-header .nav-links a, #site-header .nav-links .subbtn{ font-size:16px; font-weight:500; line-height:1.2; letter-spacing:normal; white-space:nowrap; } #site-header .nav-links .subbtn .caret{ font-family: "RETACH Header Inter", system-ui, sans-serif; font-synthesis:none; } /* RETACH HEADER TYPOGRAPHY LOCK END */ /* RETACH HEADER LIVE DOM FONT OWNER START */ /* * retach-shell-v5.js replaces #site-header placeholder * with the real