/*
 * eXtreme Web — финальный слой интеграции с Ranx/Bitrix
 * Версия: 2.2.0
 *
 * Задачи слоя:
 * 1) воспроизвести фон утверждённого concept/reference;
 * 2) не дать штатным стилям Ranx вернуть белую mobile header/menu;
 * 3) воспроизвести курсор 38px -> 72px;
 * 4) не вмешиваться в данные блоков и визуальный редактор.
 */

:root{
    --ew-bg:#05070a;
    --ew-bg-soft:#090d14;
    --ew-panel:rgba(13,18,28,.72);
    --ew-panel-solid:#0c111b;
    --ew-ink:#f4f7fb;
    --ew-muted:#8b95a7;
    --ew-muted-2:#586174;
    --ew-line:rgba(164,181,214,.15);
    --ew-line-strong:rgba(111,168,255,.34);
    --ew-blue:#3974ff;
    --ew-blue-2:#6fa8ff;
    --ew-cyan:#64e6ff;
    --cursor-x:74vw;
    --cursor-y:28vh;
}

/* ==========================================================================
   1. Атмосфера страницы — значения перенесены из сохранённого макета
   ========================================================================== */

html{
    background:#05070a!important;
}

body.extreme-web-theme{
    position:relative;
    isolation:isolate;
    min-height:100vh;
    margin:0;
    overflow-x:hidden;
    background:
        radial-gradient(circle at 18% 6%,rgba(47,97,227,.14),transparent 24%),
        linear-gradient(180deg,#05070a 0%,#06090f 48%,#040609 100%)!important;
    color:var(--ew-ink);
}

/*
 * Старый общий слой рисовал сетку через body::before и повторял её в каждой
 * .extreme-section. Отключаем эти варианты: на странице должна быть одна сетка.
 */
body.extreme-web-theme::before,
body.extreme-web-theme::after,
body.extreme-web-theme .extreme-section::before{
    content:none!important;
}

/* Контейнеры блоков не должны перекрывать глобальную атмосферу сплошным фоном. */
body.extreme-web-theme #blocks_wrapper{
    position:relative;
    z-index:2;
    width:100%!important;
    max-width:none!important;
    overflow:visible!important;
    background:transparent!important;
}

/*
 * ВАЖНО: не обнуляем background у .block-extreme-*.
 * Компоненты eXtreme сами задают нужный фон своим block-wrapper'ам.
 * В v2.0 blanket-override делал часть блоков визуально "пустыми".
 */
body.extreme-web-theme #blocks_wrapper>.block-wrap{
    position:relative;
    z-index:1;
}

/*
 * Поведение возвращено к сохранённому concept/reference:
 * hero сохраняет собственный глубокий фон, остальные секции прозрачны,
 * а блок сертификатов получает отдельный локальный градиент.
 */
body.extreme-web-theme .extreme-section:not(.ew-hero){
    overflow:visible!important;
    background:transparent!important;
}

body.extreme-web-theme .ew-hero{
    overflow:hidden!important;
    background:var(--ew-bg)!important;
}

/*
 * Hero имеет непрозрачный собственный фон, поэтому глобальная .ew-page-grid
 * физически оказывается под секцией и не видна. Возвращаем клетку локально
 * только первому экрану. Остальные .extreme-section::before по-прежнему
 * отключены выше, поэтому двойной сетки на странице не возникает.
 */
body.extreme-web-theme .ew-hero::before{
    position:absolute!important;
    inset:0!important;
    z-index:0!important;
    display:block!important;
    width:auto!important;
    height:auto!important;
    content:""!important;
    pointer-events:none!important;
    background-image:
        linear-gradient(rgba(91,127,184,.037) 1px,transparent 1px),
        linear-gradient(90deg,rgba(91,127,184,.037) 1px,transparent 1px)!important;
    background-size:72px 72px!important;
    opacity:1!important;
    -webkit-mask-image:linear-gradient(to bottom,transparent,#000 12%,#000 88%,transparent)!important;
    mask-image:linear-gradient(to bottom,transparent,#000 12%,#000 88%,transparent)!important;
}

body.extreme-web-theme .ew-hero>.ew-hero__layout,
body.extreme-web-theme .ew-hero>.maxwidth-theme{
    position:relative;
    z-index:1;
}

body.extreme-web-theme .credentials-section{
    overflow:hidden!important;
    background:
        radial-gradient(circle at 74% 16%,rgba(43,101,228,.14),transparent 35%),
        radial-gradient(circle at 4% 92%,rgba(31,77,170,.10),transparent 30%),
        linear-gradient(145deg,#080d15,#0a111d 48%,#060a11)!important;
}

/* Большое световое поле, следующее за указателем. */
.ew-page-aura{
    position:fixed;
    left:var(--cursor-x);
    top:var(--cursor-y);
    z-index:0;
    width:760px;
    height:760px;
    pointer-events:none;
    border-radius:50%;
    background:radial-gradient(circle,rgba(56,116,255,.12),rgba(51,100,224,.035) 42%,transparent 68%);
    filter:blur(34px);
    transform:translate(-50%,-50%);
    transition:left .18s linear,top .18s linear;
}

/* Одна сетка на всю страницу: desktop 72×72, затухание как в reference. */
.ew-page-grid{
    position:absolute;
    inset:0;
    z-index:0;
    width:100%;
    min-height:100%;
    pointer-events:none;
    background-image:
        linear-gradient(rgba(132,159,217,.055) 1px,transparent 1px),
        linear-gradient(90deg,rgba(132,159,217,.055) 1px,transparent 1px);
    background-size:72px 72px;
    -webkit-mask-image:linear-gradient(to bottom,#000 0,transparent 41%);
    mask-image:linear-gradient(to bottom,#000 0,transparent 41%);
}

/* Тонкий grain/noise из сохранённого макета. */
.ew-page-noise{
    position:fixed;
    inset:0;
    z-index:90;
    pointer-events:none;
    opacity:.035;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E");
}

/* ==========================================================================
   2. Курсор из concept/reference
   ========================================================================== */

/* На случай, если в браузере остался JS/CSS промежуточного патча 1.6. */
.ew-cursor{display:none!important}

.ew-cursor-ring,
.ew-cursor-dot{
    position:fixed;
    left:var(--cursor-x);
    top:var(--cursor-y);
    pointer-events:none;
    border-radius:50%;
    transform:translate(-50%,-50%);
}

.ew-cursor-ring{
    z-index:10050;
    display:grid;
    width:26px;
    height:26px;
    place-items:center;
    border:1px solid rgba(114,171,255,.70);
    background:rgba(31,81,196,.04);
    box-shadow:0 0 16px rgba(57,116,255,.18);
    opacity:0;
    -webkit-backdrop-filter:blur(3px);
    backdrop-filter:blur(3px);
    transition:
        width .2s ease,
        height .2s ease,
        background .2s ease,
        border-color .2s ease,
        box-shadow .2s ease,
        opacity .2s ease;
}

.ew-cursor-ring>span{
    max-width:42px;
    padding:0 3px;
    overflow:hidden;
    color:#fff;
    font:700 0/1.05 InterEW,Inter,Arial,sans-serif;
    letter-spacing:.035em;
    text-align:center;
    text-overflow:clip;
    text-transform:uppercase;
    white-space:normal;
    opacity:0;
}

.ew-cursor-ring[data-visible="true"]{
    opacity:1;
}

.ew-cursor-ring[data-active="true"]{
    width:48px;
    height:48px;
    border-color:rgba(111,168,255,.85);
    background:rgba(34,86,213,.26);
    box-shadow:
        0 0 24px rgba(57,116,255,.30),
        inset 0 0 18px rgba(100,230,255,.09);
}

.ew-cursor-ring[data-active="true"]>span{
    font-size:6px;
    line-height:1.08;
    opacity:1;
}

.ew-cursor-dot{
    z-index:10051;
    width:3px;
    height:3px;
    background:var(--ew-cyan);
    box-shadow:0 0 7px var(--ew-cyan);
    opacity:0;
    transition:opacity .12s ease;
}

.ew-cursor-dot[data-visible="true"]{
    opacity:1;
}

.ew-cursor-ring[data-active="true"]~.ew-cursor-dot{
    opacity:0;
}

@media(pointer:fine){
    body.extreme-web-theme.ew-custom-cursor{
        cursor:none!important;
    }

    body.extreme-web-theme.ew-custom-cursor a,
    body.extreme-web-theme.ew-custom-cursor button,
    body.extreme-web-theme.ew-custom-cursor [role="button"],
    body.extreme-web-theme.ew-custom-cursor [data-cursor]{
        cursor:none!important;
    }

    /*
     * Поля формы и элементы администрирования должны сохранять системный
     * курсор. Кастомное кольцо над ними дополнительно прячет JS.
     */
    body.extreme-web-theme.ew-custom-cursor input,
    body.extreme-web-theme.ew-custom-cursor textarea,
    body.extreme-web-theme.ew-custom-cursor [contenteditable="true"]{
        cursor:text!important;
    }

    body.extreme-web-theme.ew-custom-cursor select,
    body.extreme-web-theme.ew-custom-cursor option,
    body.extreme-web-theme.ew-custom-cursor #bx-panel,
    body.extreme-web-theme.ew-custom-cursor #bx-panel *,
    body.extreme-web-theme.ew-custom-cursor .bx-core-window,
    body.extreme-web-theme.ew-custom-cursor .bx-core-window *,
    body.extreme-web-theme.ew-custom-cursor .bx-core-adm-dialog,
    body.extreme-web-theme.ew-custom-cursor .bx-core-adm-dialog *,
    body.extreme-web-theme.ew-custom-cursor .block_edit,
    body.extreme-web-theme.ew-custom-cursor .block_edit *,
    body.extreme-web-theme.ew-custom-cursor .block_edit_btns,
    body.extreme-web-theme.ew-custom-cursor .block_edit_btns *{
        cursor:auto!important;
    }
}

/* ==========================================================================
   3. Desktop header — атмосфера и геометрия reference
   ========================================================================== */

#extreme-header.extreme-header{
    z-index:140;
    height:82px;
    border-bottom:1px solid var(--ew-line);
    background:rgba(5,7,10,.74)!important;
    box-shadow:none;
    -webkit-backdrop-filter:blur(24px) saturate(135%);
    backdrop-filter:blur(24px) saturate(135%);
}

body.header-is-transparent #extreme-header.extreme-header,
body.js-header-is-transparent #extreme-header.extreme-header{
    background:rgba(5,7,10,.74)!important;
}

#extreme-header .extreme-header__shell{
    width:calc(100% - 56px);
    max-width:1480px;
    height:82px;
    margin:0 auto;
}

#extreme-header .extreme-header__inner{
    display:grid!important;
    width:100%;
    height:82px;
    grid-template-columns:235px minmax(0,1fr) auto!important;
    grid-template-rows:82px!important;
    align-items:center!important;
}

#extreme-header .extreme-brand{
    grid-column:1;
    grid-row:1;
}

#extreme-header .extreme-header__nav{
    grid-column:2;
    grid-row:1;
    min-width:0;
}

#extreme-header .extreme-header__contacts{
    grid-column:3;
    grid-row:1;
}

#extreme-header .extreme-brand{
    width:235px;
    min-width:235px;
}

#extreme-header .extreme-nav>tbody>tr>td>a{
    padding-right:clamp(8px,.9vw,14px);
    padding-left:clamp(8px,.9vw,14px);
    color:#9ba5b8!important;
    font-size:12px;
    font-weight:500;
}

#extreme-header .extreme-nav>tbody>tr>td:hover>a,
#extreme-header .extreme-nav>tbody>tr>td>a.active{
    background:transparent;
    color:#fff!important;
}

#extreme-header .extreme-nav>tbody>tr>td>a::after{
    right:10px;
    bottom:7px;
    left:10px;
    background:linear-gradient(90deg,var(--ew-blue),var(--ew-cyan));
}

#extreme-header .extreme-header__contacts{
    gap:8px;
}

#extreme-header .extreme-phone{
    gap:7px;
    margin-right:10px;
    color:#c7cfdd!important;
    font:500 12px/1 InterEW,Inter,Arial,sans-serif;
    letter-spacing:0;
}

#extreme-header .extreme-phone svg{
    width:19px;
    height:19px;
}

#extreme-header .extreme-messenger{
    width:36px;
    height:36px;
    border-color:var(--ew-line);
    background:transparent;
    color:#aeb9cc!important;
}

#extreme-header .extreme-messenger svg{
    width:20px;
    height:20px;
}

#extreme-header .extreme-header__project{
    min-height:40px!important;
    margin-left:7px;
    padding:0 16px!important;
    border-color:rgba(93,148,255,.34)!important;
    background:rgba(45,92,199,.07)!important;
    font-size:11px!important;
    font-weight:500!important;
}

/* Fixed-header Ranx оставляем рабочим, но визуально приводим к той же системе. */
#headerfixed.extreme-headerfixed .headerfixed-main{
    height:72px;
    border-bottom:1px solid var(--ew-line);
    background:rgba(5,7,10,.88)!important;
    box-shadow:0 18px 52px rgba(0,0,0,.24);
    -webkit-backdrop-filter:blur(24px) saturate(135%);
    backdrop-filter:blur(24px) saturate(135%);
}

#headerfixed .extreme-headerfixed__shell{
    width:calc(100% - 56px);
    max-width:1480px;
    height:72px;
    margin:0 auto;
}

#headerfixed .extreme-headerfixed__inner{
    display:grid!important;
    width:100%;
    height:72px;
    grid-template-columns:235px minmax(0,1fr) auto!important;
    grid-template-rows:72px!important;
    align-items:center!important;
}

#headerfixed .extreme-brand--fixed{
    grid-column:1;
    grid-row:1;
}

#headerfixed .extreme-headerfixed__nav{
    grid-column:2;
    grid-row:1;
    min-width:0;
}

#headerfixed .extreme-headerfixed__contacts{
    grid-column:3;
    grid-row:1;
}

#headerfixed .extreme-phone{
    font-size:12px!important;
    font-weight:500!important;
}

@media(max-width:1500px) and (min-width:1200px){
    #extreme-header .extreme-header__shell,
    #headerfixed .extreme-headerfixed__shell{
        width:calc(100% - 36px);
        max-width:none;
    }

    #extreme-header .extreme-header__inner,
    #headerfixed .extreme-headerfixed__inner{
        grid-template-columns:225px minmax(0,1fr) auto;
        gap:14px;
    }
}

/* ==========================================================================
   4. Mobile header — компактная геометрия без transform-scale
   ========================================================================== */

#headermobile.extreme-headermobile{
    position:relative;
    z-index:150;
    display:none;
    width:100%!important;
    height:64px!important;
    border:0!important;
    border-bottom:1px solid rgba(164,181,214,.13)!important;
    background:rgba(5,7,10,.94)!important;
    box-shadow:0 10px 34px rgba(0,0,0,.18)!important;
    -webkit-backdrop-filter:blur(22px) saturate(135%);
    backdrop-filter:blur(22px) saturate(135%);
}

#headermobile.extreme-headermobile .headermobile-main{
    width:100%!important;
    height:64px!important;
    margin:0!important;
    border:0!important;
    padding:0!important;
    background:transparent!important;
    box-shadow:none!important;
}

#headermobile .extreme-headermobile__inner{
    display:flex!important;
    width:100%!important;
    max-width:none!important;
    height:64px!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px;
    margin:0!important;
    padding:0 14px!important;
    box-sizing:border-box;
}

#headermobile .extreme-brand--mobile{
    display:inline-flex!important;
    width:158px!important;
    min-width:158px!important;
    height:46px!important;
    flex:0 0 158px!important;
    align-items:center;
    margin:0!important;
    transform:none!important;
}

#headermobile .extreme-brand--mobile .extreme-logo__code{
    display:none!important;
}

#headermobile .extreme-brand--mobile .extreme-logo__e,
#headermobile .extreme-brand--mobile .extreme-logo__treme{
    font-size:18px!important;
}

#headermobile .extreme-brand--mobile .extreme-logo__x{
    width:29px!important;
    height:36px!important;
    flex-basis:29px!important;
}

#headermobile .extreme-brand--mobile .extreme-logo__x b{
    font-size:25px!important;
}

#headermobile .extreme-brand--mobile .extreme-logo__x i{
    font-size:8px!important;
}

#headermobile .extreme-brand--mobile .extreme-logo__web{
    margin-left:6px!important;
    padding:4px 5px 4px 7px!important;
    font-size:14px!important;
}

#headermobile .extreme-headermobile__actions{
    display:flex!important;
    flex:0 0 auto;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:6px!important;
    margin:0!important;
}

#headermobile .extreme-phone--icon{
    display:grid!important;
    width:38px!important;
    height:38px!important;
    flex:0 0 38px!important;
    margin:0!important;
    place-items:center!important;
    border:1px solid rgba(111,168,255,.22)!important;
    border-radius:50%!important;
    padding:0!important;
    background:rgba(57,116,255,.04)!important;
}

#headermobile .extreme-phone--icon svg{
    width:18px!important;
    height:18px!important;
}

#headermobile .extreme-headermobile__burger{
    display:grid!important;
    width:38px!important;
    height:38px!important;
    flex:0 0 38px!important;
    margin:0!important;
    place-items:center!important;
}

#headermobile .extreme-headermobile__burger .header-burger{
    display:grid!important;
    width:38px!important;
    height:38px!important;
    margin:0!important;
    border:1px solid rgba(111,168,255,.25)!important;
    border-radius:50%!important;
    padding:0!important;
    place-items:center!important;
    background:rgba(57,116,255,.055)!important;
    box-sizing:border-box!important;
}

#headermobile .extreme-headermobile__burger .header-burger svg{
    display:block!important;
    width:17px!important;
    height:13px!important;
    margin:auto!important;
}

#headermobile .extreme-headermobile__burger .header-burger svg path{
    stroke:#dce7f8!important;
    stroke-width:1.6!important;
}

@media(max-width:1199px){
    #extreme-header.extreme-header{
        display:none!important;
    }

    #headerfixed.extreme-headerfixed{
        display:none!important;
    }

    #headermobile.extreme-headermobile{
        display:block!important;
    }
}

@media(max-width:359px){
    #headermobile .extreme-brand--mobile{
        width:144px!important;
        min-width:144px!important;
        flex-basis:144px!important;
    }

    #headermobile .extreme-brand--mobile .extreme-logo__web{
        display:none!important;
    }
}

@media(min-width:1200px){
    #headermobile.extreme-headermobile{
        display:none!important;
    }
}

/* ==========================================================================
   5. Mobile menu — данные из Bitrix, визуально eXtreme
   ========================================================================== */

#mobilemenu.extreme-mobilemenu,
#mobilemenu{
    position:fixed!important;
    top:0!important;
    right:auto!important;
    bottom:0!important;
    left:0!important;
    z-index:2000!important;
    display:block;
    width:min(92vw,480px)!important;
    max-width:480px!important;
    height:100dvh!important;
    overflow:hidden!important;
    border-right:1px solid rgba(111,168,255,.18)!important;
    background:
        radial-gradient(circle at 82% 0,rgba(57,116,255,.16),transparent 31%),
        linear-gradient(145deg,#070b12,#05070a 72%)!important;
    color:var(--ew-ink)!important;
    box-shadow:28px 0 90px rgba(0,0,0,.38);
    transform:translate3d(-105%,0,0);
    transition:transform .48s cubic-bezier(.16,1,.3,1)!important;
    -webkit-backdrop-filter:blur(24px);
    backdrop-filter:blur(24px);
}

#mobilemenu::before{
    position:absolute;
    inset:0;
    z-index:0;
    content:"";
    pointer-events:none;
    background-image:
        linear-gradient(rgba(132,159,217,.045) 1px,transparent 1px),
        linear-gradient(90deg,rgba(132,159,217,.045) 1px,transparent 1px);
    background-size:52px 52px;
    -webkit-mask-image:linear-gradient(to bottom,#000 0,transparent 72%);
    mask-image:linear-gradient(to bottom,#000 0,transparent 72%);
}

#mobilemenu.open{
    transform:translate3d(0,0,0);
}

#mobilemenu .extreme-mobilemenu__wrap{
    position:relative;
    z-index:1;
    display:grid!important;
    width:100%;
    height:100%;
    grid-template-rows:auto minmax(0,1fr);
    overflow:hidden!important;
    padding:0!important;
    background:transparent!important;
}

#mobilemenu .extreme-mobilemenu__head{
    display:flex;
    min-height:76px;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid var(--ew-line);
    padding:8px 20px;
}

#mobilemenu .extreme-brand--menu{
    width:198px;
    min-width:198px;
    height:54px;
    transform:scale(.9);
    transform-origin:left center;
}

#mobilemenu .extreme-brand--menu .extreme-logo__code{
    display:none!important;
}

#mobilemenu .extreme-mobilemenu__close{
    position:relative;
    display:block;
    width:44px;
    height:44px;
    flex:0 0 44px;
    border:1px solid rgba(111,168,255,.28);
    border-radius:50%;
    padding:0;
    background:rgba(57,116,255,.04);
    cursor:pointer;
}

#mobilemenu .extreme-mobilemenu__close span{
    position:absolute;
    top:50%;
    left:50%;
    width:17px;
    height:1px;
    background:#d8e4f7;
    transition:transform .25s ease,background .25s ease;
}

#mobilemenu .extreme-mobilemenu__close span:first-child{
    transform:translate(-50%,-50%) rotate(45deg);
}

#mobilemenu .extreme-mobilemenu__close span:last-child{
    transform:translate(-50%,-50%) rotate(-45deg);
}

#mobilemenu .extreme-mobilemenu__close:hover span{
    background:var(--ew-cyan);
}

#mobilemenu .extreme-mobilemenu__body{
    min-height:0;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    padding:18px 20px 28px;
    scrollbar-width:thin;
    scrollbar-color:rgba(111,168,255,.32) transparent;
}

#mobilemenu .extreme-mobilemenu__nav{
    width:100%;
}

#mobilemenu .extreme-mobilemenu__list{
    width:100%;
    margin:0!important;
    padding:0!important;
    list-style:none!important;
}

#mobilemenu .extreme-mobilemenu__item{
    width:100%;
    margin:0!important;
    padding:0!important;
}

#mobilemenu .extreme-mobilemenu__row{
    display:grid;
    min-height:58px;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:stretch;
    border-bottom:1px solid var(--ew-line);
}

#mobilemenu .extreme-mobilemenu__link{
    display:flex!important;
    width:100%;
    min-width:0;
    min-height:58px!important;
    align-items:center;
    border:0!important;
    padding:0 12px 0 0!important;
    background:transparent!important;
    color:#dbe4f3!important;
    font:600 22px/1.15 ManropeEW,InterEW,sans-serif!important;
    letter-spacing:-.035em;
    text-align:left;
    text-decoration:none!important;
    transition:color .22s ease,transform .25s ease;
}

#mobilemenu .extreme-mobilemenu__link:hover,
#mobilemenu .extreme-mobilemenu__link.is-active{
    color:var(--ew-cyan)!important;
}

#mobilemenu .extreme-mobilemenu__toggle{
    position:relative;
    display:grid;
    width:48px;
    min-width:48px;
    height:58px;
    place-items:center;
    border:0;
    padding:0;
    background:transparent;
    color:#7e91ad;
}

#mobilemenu .extreme-mobilemenu__toggle::before,
#mobilemenu .extreme-mobilemenu__toggle::after{
    position:absolute;
    width:14px;
    height:1px;
    content:"";
    background:currentColor;
    transition:transform .28s cubic-bezier(.16,1,.3,1),color .2s ease;
}

#mobilemenu .extreme-mobilemenu__toggle::after{
    transform:rotate(90deg);
}

#mobilemenu .extreme-mobilemenu__item.is-open>.extreme-mobilemenu__row .extreme-mobilemenu__toggle{
    color:var(--ew-cyan);
}

#mobilemenu .extreme-mobilemenu__item.is-open>.extreme-mobilemenu__row .extreme-mobilemenu__toggle::after{
    transform:rotate(0);
}

#mobilemenu .extreme-mobilemenu__submenu[hidden]{
    display:none!important;
}

#mobilemenu .extreme-mobilemenu__submenu{
    border-bottom:1px solid rgba(164,181,214,.08);
    padding:7px 0 11px 16px;
}

#mobilemenu .extreme-mobilemenu__list--level-2 .extreme-mobilemenu__row{
    min-height:46px;
    border-bottom-color:rgba(164,181,214,.08);
}

#mobilemenu .extreme-mobilemenu__list--level-2 .extreme-mobilemenu__link{
    min-height:46px!important;
    color:#98a8bf!important;
    font:550 15px/1.3 InterEW,Arial,sans-serif!important;
    letter-spacing:-.015em;
}

#mobilemenu .extreme-mobilemenu__list--level-2 .extreme-mobilemenu__toggle{
    width:42px;
    min-width:42px;
    height:46px;
}

#mobilemenu .extreme-mobilemenu__list--level-3{
    padding:4px 0 7px 12px!important;
}

#mobilemenu .extreme-mobilemenu__list--level-3 .extreme-mobilemenu__row{
    min-height:39px;
    border:0;
}

#mobilemenu .extreme-mobilemenu__list--level-3 .extreme-mobilemenu__link{
    min-height:39px!important;
    color:#71819a!important;
    font-size:13px!important;
}

#mobilemenu .extreme-mobilemenu__project{
    display:flex!important;
    width:100%;
    min-height:52px!important;
    align-items:center;
    justify-content:center;
    margin-top:26px;
    border:1px solid rgba(93,148,255,.36)!important;
    border-radius:999px!important;
    background:linear-gradient(90deg,rgba(37,82,190,.24),rgba(32,116,207,.12))!important;
    color:#f4f8ff!important;
    box-shadow:inset 0 0 28px rgba(76,139,255,.05);
    font:650 12px/1 InterEW,Arial,sans-serif!important;
    letter-spacing:.025em;
    text-decoration:none!important;
    transition:border-color .25s ease,background .25s ease,box-shadow .25s ease!important;
}

#mobilemenu .extreme-mobilemenu__project:hover{
    border-color:rgba(100,230,255,.62)!important;
    background:linear-gradient(90deg,rgba(37,82,190,.36),rgba(32,116,207,.20))!important;
    box-shadow:0 0 30px rgba(57,116,255,.16),inset 0 0 28px rgba(100,230,255,.05);
}

#mobilemenu .extreme-mobilemenu__contacts{
    display:grid;
    gap:12px;
    margin-top:22px;
    border-top:1px solid rgba(164,181,214,.13);
    padding:18px 0 max(4px,env(safe-area-inset-bottom));
    background:transparent;
}

#mobilemenu .extreme-mobilemenu__contacts .extreme-phone{
    display:inline-flex;
    width:max-content;
    max-width:100%;
    align-items:center;
    margin:0!important;
    color:#e8eef8!important;
    font-size:18px!important;
    line-height:1.2;
}

#mobilemenu .extreme-mobilemenu__contacts .extreme-phone svg{
    width:19px;
    height:19px;
    margin-right:8px;
}

#mobilemenu .extreme-messengers--mobile{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}

#mobilemenu .extreme-messengers--mobile .extreme-messenger{
    display:inline-flex;
    width:auto;
    height:38px;
    align-items:center;
    justify-content:center;
    gap:7px;
    border-radius:999px;
    padding:0 12px;
}

#mobilemenu .extreme-messengers--mobile .extreme-messenger svg{
    width:20px;
    height:20px;
}

#mobilemenu .extreme-messengers--mobile .extreme-messenger span{
    font-size:10px;
    font-weight:650;
}

#mobilemenu-overlay{
    position:fixed!important;
    inset:0!important;
    z-index:1990!important;
    display:none!important;
    width:100%!important;
    height:100%!important;
    background:rgba(1,4,8,.72)!important;
    opacity:1!important;
    cursor:pointer;
    -webkit-backdrop-filter:blur(5px);
    backdrop-filter:blur(5px);
}

body.extreme-mobilemenu-open{
    overflow:hidden!important;
    touch-action:none;
}

body.extreme-mobilemenu-open #mobilemenu{
    touch-action:auto;
}

@media(max-width:1199px){
    #mobilemenu{
        display:block!important;
    }

    body.extreme-mobilemenu-open #mobilemenu-overlay{
        display:block!important;
    }
}

@media(min-width:1200px){
    #mobilemenu,
    #mobilemenu-overlay{
        display:none!important;
    }
}

/* ==========================================================================
   6. Touch/mobile и визуальный редактор
   ========================================================================== */

@media(max-width:640px){
    .ew-page-aura,
    .ew-cursor-ring,
    .ew-cursor-dot{
        display:none!important;
    }

    .ew-page-grid{
        background-size:52px 52px;
    }

    body.extreme-web-theme .ew-hero::before{
        background-size:52px 52px!important;
    }

    #headermobile .extreme-headermobile__inner{
        padding-right:12px!important;
        padding-left:12px!important;
    }

    #headermobile .extreme-brand--mobile{
        width:152px!important;
        min-width:152px!important;
        flex-basis:152px!important;
    }

    #headermobile .extreme-phone--icon,
    #headermobile .extreme-headermobile__burger,
    #headermobile .extreme-headermobile__burger .header-burger{
        width:36px!important;
        height:36px!important;
        flex-basis:36px!important;
    }

    #mobilemenu{
        width:min(94vw,430px)!important;
    }

    #mobilemenu .extreme-mobilemenu__body{
        padding-right:18px;
        padding-left:18px;
    }

    #mobilemenu .extreme-mobilemenu__contacts{
        margin-top:18px;
        padding-top:16px;
    }

    #mobilemenu .extreme-mobilemenu__link{
        font-size:20px!important;
    }
}

/*
 * В режиме визуального редактора Ranx: контент видим сразу, тяжёлые pointer
 * эффекты отключены. Верхняя панель Bitrix без RX_LANDING_EDIT этого класса
 * не получает — публичный сайт администратора остаётся полноценным.
 */
body.ew-ranx-edit .ew-page-aura,
body.ew-ranx-edit .ew-cursor-ring,
body.ew-ranx-edit .ew-cursor-dot{
    display:none!important;
}

body.ew-ranx-edit,
body.ew-ranx-edit a,
body.ew-ranx-edit button{
    cursor:auto!important;
}

body.ew-ranx-edit .extreme-motion{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
}

@media(prefers-reduced-motion:reduce){
    .ew-page-aura{
        transition:none!important;
    }

    .ew-cursor-ring,
    .ew-cursor-dot{
        transition:none!important;
    }

    #mobilemenu{
        transition-duration:.01ms!important;
    }
}
