@font-face{font-family:InterEW;font-style:normal;font-weight:400 800;font-display:swap;src:url(../../fonts/extreme/inter-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:InterEW;font-style:normal;font-weight:400 800;font-display:swap;src:url(../../fonts/extreme/inter-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:ManropeEW;font-style:normal;font-weight:500 800;font-display:swap;src:url(../../fonts/extreme/manrope-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:ManropeEW;font-style:normal;font-weight:500 800;font-display:swap;src:url(../../fonts/extreme/manrope-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}

:root{
    --ew-bg:#05070b;
    --ew-bg-soft:#080c13;
    --ew-panel:#0b111b;
    --ew-panel-2:#0e1624;
    --ew-ink:#f4f7fb;
    --ew-muted:#8d9aae;
    --ew-muted-2:#65738a;
    --ew-line:rgba(128,158,209,.16);
    --ew-line-strong:rgba(110,162,255,.34);
    --ew-blue:#3978ff;
    --ew-blue-2:#6d99ff;
    --ew-cyan:#62ddff;
    --ew-cyan-soft:rgba(98,221,255,.14);
    --ew-good:#76f1c6;
    --ew-radius:24px;
    --ew-radius-sm:16px;
    --ew-shadow:0 32px 90px rgba(0,0,0,.38);
    --ew-ease:cubic-bezier(.16,1,.3,1);
}

html{max-width:100%;overflow-x:hidden;scroll-behavior:smooth;background:var(--ew-bg)}
body{
    max-width:100%;
    overflow-x:hidden;
    font-family:InterEW,Inter,Arial,sans-serif;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}
body.extreme-web-theme,body:has(.extreme-section){background:var(--ew-bg);color:var(--ew-ink)}
body.extreme-web-theme::before,body:has(.extreme-section)::before{
    position:fixed;inset:0;z-index:-2;content:"";pointer-events:none;
    background:
        radial-gradient(circle at 13% 2%,rgba(43,105,228,.13),transparent 30%),
        linear-gradient(rgba(87,122,180,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(87,122,180,.035) 1px,transparent 1px),
        var(--ew-bg);
    background-size:auto,72px 72px,72px 72px,auto;
}
body,button,input,textarea,select{font-family:InterEW,Inter,Arial,sans-serif}
::selection{background:rgba(80,142,255,.38);color:#fff}

/* Ranx compatibility layer.
   1. The template adds clearfix pseudo-elements to .maxwidth-theme. Inside our
      grid layouts they become real grid items and push content into extra rows.
   2. Ranx targets every semantic <header> on transparent pages. That rule must
      apply only to the site header, never to headings inside custom blocks. */
.extreme-section img,.extreme-header img,.extreme-headerfixed img,.extreme-headermobile img,.extreme-mobilemenu img,.extreme-footer img{max-width:100%}

.block[class*="blockextreme-"]{margin:0!important;background:var(--ew-bg)!important;color:var(--ew-ink)!important}
.block[class*="blockextreme-"]>.block-inner{margin:0!important;padding:0!important;background:transparent!important}
.extreme-section{position:relative;display:block;width:100%;overflow:hidden;background:var(--ew-bg)!important;color:var(--ew-ink)!important}
.extreme-section::before{position:absolute;inset:0;content:"";pointer-events:none;background:linear-gradient(rgba(91,127,184,.037) 1px,transparent 1px),linear-gradient(90deg,rgba(91,127,184,.037) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,transparent,#000 12%,#000 88%,transparent)}
.extreme-section>.maxwidth-theme,.extreme-footer>.maxwidth-theme{position:relative;z-index:2}
.extreme-section>.maxwidth-theme,.extreme-footer>.maxwidth-theme,.extreme-header>.maxwidth-theme,.extreme-headerfixed .maxwidth-theme{width:calc(100% - 56px)!important;max-width:1480px!important;padding-right:0!important;padding-left:0!important}
.extreme-section>.maxwidth-theme::before,.extreme-section>.maxwidth-theme::after,.extreme-footer>.maxwidth-theme::before,.extreme-footer>.maxwidth-theme::after{display:none!important;content:none!important}
.extreme-section *{box-sizing:border-box}
.extreme-section h1,.extreme-section h2,.extreme-section h3,.extreme-section h4,.extreme-section h5,.extreme-section h6{color:inherit}
.extreme-section a{text-decoration:none}

.extreme-kicker{display:flex;align-items:center;gap:12px;margin:0 0 22px;color:var(--ew-blue-2);font:700 10px/1.4 ManropeEW,monospace;letter-spacing:.19em;text-transform:uppercase}
.extreme-kicker::before{width:34px;height:1px;content:"";background:linear-gradient(90deg,var(--ew-cyan),transparent)}
.extreme-heading{max-width:1020px;margin:0;color:var(--ew-ink);font:750 clamp(42px,6vw,92px)/.96 ManropeEW,InterEW,sans-serif;letter-spacing:-.065em}
.extreme-heading span{color:#77849b}
.extreme-heading--small{font-size:clamp(38px,4.5vw,72px)}
.extreme-lead{max-width:700px;margin:26px 0 0;color:var(--ew-muted);font-size:clamp(16px,1.35vw,20px);line-height:1.7}
.extreme-section .extreme-section-head{position:relative!important;inset:auto!important;z-index:2!important;display:grid!important;width:auto!important;max-width:100%!important;grid-template-columns:minmax(0,1fr) minmax(250px,420px);align-items:end;gap:40px;margin-bottom:54px;background:transparent!important}
.extreme-section-head__side{justify-self:end;max-width:390px;color:var(--ew-muted);font-size:15px;line-height:1.7}

.extreme-card{position:relative;border:1px solid var(--ew-line);border-radius:var(--ew-radius);background:linear-gradient(145deg,rgba(15,23,36,.88),rgba(7,11,18,.88));box-shadow:inset 0 1px rgba(255,255,255,.018);transition:border-color .4s var(--ew-ease),transform .45s var(--ew-ease),background .4s ease,box-shadow .45s ease}
.extreme-card::after{position:absolute;inset:-1px;z-index:-1;border-radius:inherit;content:"";background:radial-gradient(320px circle at var(--ew-x,50%) var(--ew-y,20%),rgba(76,141,255,.15),transparent 66%);opacity:0;transition:opacity .35s ease}
.extreme-card:hover{border-color:var(--ew-line-strong);transform:translateY(-5px);box-shadow:0 24px 64px rgba(0,0,0,.28)}
.extreme-card:hover::after{opacity:1}

.extreme-arrow{display:grid;width:44px;height:44px;place-items:center;border:1px solid var(--ew-line);border-radius:50%;color:#b8c8e4;transition:.35s var(--ew-ease)}
.extreme-card:hover .extreme-arrow{border-color:rgba(98,221,255,.58);background:var(--ew-cyan);color:#07101c;transform:rotate(45deg)}
.extreme-arrow svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7}

.extreme-action,.extreme-section .btn,.extreme-header .btn,.extreme-headerfixed .btn,.extreme-mobilemenu .btn,.extreme-footer .btn{
    position:relative;display:inline-flex;min-height:52px;align-items:center;justify-content:center;gap:16px;overflow:hidden;border:1px solid rgba(92,147,255,.48)!important;border-radius:999px!important;padding:0 22px!important;background:linear-gradient(110deg,rgba(45,102,224,.2),rgba(18,31,53,.42))!important;color:#f4f8ff!important;font-size:13px!important;font-weight:700!important;line-height:1!important;text-decoration:none!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);transition:transform .35s var(--ew-ease),border-color .3s ease,box-shadow .35s ease!important
}
.extreme-action::before,.extreme-section .btn::before,.extreme-header .btn::before,.extreme-headerfixed .btn::before,.extreme-mobilemenu .btn::before,.extreme-footer .btn::before{position:absolute;inset:0;content:"";background:linear-gradient(110deg,transparent 20%,rgba(105,220,255,.19),transparent 75%);transform:translateX(-120%);transition:transform .7s var(--ew-ease)}
.extreme-action:hover,.extreme-section .btn:hover,.extreme-header .btn:hover,.extreme-headerfixed .btn:hover,.extreme-mobilemenu .btn:hover,.extreme-footer .btn:hover{border-color:rgba(100,224,255,.8)!important;box-shadow:0 12px 34px rgba(35,104,255,.23);transform:translateY(-2px)}
.extreme-action:hover::before,.extreme-section .btn:hover::before,.extreme-header .btn:hover::before,.extreme-headerfixed .btn:hover::before,.extreme-mobilemenu .btn:hover::before,.extreme-footer .btn:hover::before{transform:translateX(120%)}
.extreme-action--solid{background:linear-gradient(135deg,#3e79ff,#245de1)!important}

.extreme-icon{display:grid;place-items:center;color:var(--ew-blue-2)}
.extreme-icon img,.extreme-icon svg{display:block;width:100%;height:100%;object-fit:contain}
.extreme-icon img{filter:drop-shadow(0 0 18px rgba(66,133,255,.25))}

.extreme-motion{opacity:0;transform:translate3d(0,52px,0) scale(.985);transition:opacity .68s ease,transform .78s var(--ew-ease)}
.extreme-motion.extreme-inview{opacity:1;transform:none}
.extreme-motion[data-ew-delay="1"]{transition-delay:.07s}.extreme-motion[data-ew-delay="2"]{transition-delay:.14s}.extreme-motion[data-ew-delay="3"]{transition-delay:.21s}

.extreme-visually-hidden{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important}

@media(max-width:991px){
    .extreme-section .extreme-section-head{grid-template-columns:1fr!important;gap:18px;margin-bottom:38px}
    .extreme-section-head__side{justify-self:start}
    .extreme-heading{letter-spacing:-.052em}
}
@media(max-width:575px){
    .extreme-section>.maxwidth-theme,.extreme-footer>.maxwidth-theme,.extreme-header>.maxwidth-theme,.extreme-headerfixed .maxwidth-theme{width:calc(100% - 32px)!important}
    .extreme-section::before{background-size:46px 46px}
    .extreme-kicker{margin-bottom:17px}
    .extreme-heading{font-size:clamp(36px,12vw,54px)}
    .extreme-heading--small{font-size:clamp(34px,10vw,48px)}
    .extreme-lead{margin-top:20px;font-size:15px}
    .extreme-card{border-radius:19px}
}
@media(prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}.extreme-motion{opacity:1!important;transform:none!important;transition:none!important}.extreme-card,.extreme-action,.extreme-section .btn{transition:none!important}
}


/* ==========================================================================
   eXtreme Web v1.6 — критический слой эффектов макета
   Эти правила продублированы здесь намеренно: общий файл подключается напрямую
   из header.php и не зависит от сборщика CSS Ranx/Bitrix.
   ========================================================================== */

/* Единая атмосфера страницы: одна фоновая сетка, а не сетка в каждом блоке. */
body.extreme-web-theme,
body:has(.extreme-section){
    position:relative;
    isolation:isolate;
}
body.extreme-web-theme::before,
body:has(.extreme-section)::before{
    content:none!important;
}
body.extreme-web-theme::after,
body:has(.extreme-section)::after{
    position:fixed;
    left:var(--cursor-x,74vw);
    top:var(--cursor-y,28vh);
    z-index:0;
    width:760px;
    height:760px;
    border-radius:50%;
    content:"";
    pointer-events:none;
    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;
}
body.extreme-web-theme #blocks_wrapper,
body:has(.extreme-section) #blocks_wrapper{
    position:relative;
    z-index:1;
    isolation:isolate;
    background:
        radial-gradient(circle at 18% 6%,rgba(47,97,227,.14),transparent 24%),
        linear-gradient(180deg,#05070a 0%,#06090f 48%,#040609 100%)!important;
}
body.extreme-web-theme #blocks_wrapper::before,
body:has(.extreme-section) #blocks_wrapper::before{
    position:absolute;
    inset:0;
    z-index:0;
    content:"";
    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%);
}
body.extreme-web-theme #blocks_wrapper>.block-wrap,
body:has(.extreme-section) #blocks_wrapper>.block-wrap{
    position:relative;
    z-index:1;
}

/* Убираем повторную сетку у отдельных секций, чтобы фон совпадал с макетом. */
body.extreme-web-theme .extreme-section::before,
body:has(.extreme-section) .extreme-section::before{
    content:none!important;
}
body.extreme-web-theme .extreme-section:not(.ew-hero),
body:has(.extreme-section) .extreme-section:not(.ew-hero){
    overflow:visible!important;
    background:transparent!important;
}

/* Круглый интерактивный курсор из утверждённого макета. */
.ew-cursor{
    position:fixed;
    top:0;
    left:0;
    z-index:10050;
    display:grid;
    width:52px;
    height:52px;
    place-items:center;
    border:1px solid rgba(106,184,255,.72);
    border-radius:50%;
    background:rgba(5,11,20,.14);
    box-shadow:0 0 28px rgba(62,125,255,.12),inset 0 0 18px rgba(68,139,255,.08);
    opacity:0;
    pointer-events:none;
    transform:translate3d(-100px,-100px,0);
    transition:width .25s var(--ew-ease),height .25s var(--ew-ease),border-color .25s ease,background .25s ease,opacity .18s ease;
    -webkit-backdrop-filter:blur(2px);
    backdrop-filter:blur(2px);
}
.ew-cursor::before{
    width:5px;
    height:5px;
    border-radius:50%;
    content:"";
    background:#68e5ff;
    box-shadow:0 0 11px #68e5ff;
}
.ew-cursor.is-visible{opacity:1}
.ew-cursor.is-active{
    width:76px;
    height:76px;
    border-color:rgba(105,228,255,.9);
    background:rgba(7,17,31,.52);
}
.ew-cursor.is-active::before{opacity:0}
.ew-cursor__label{
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    padding:8px;
    color:#dcecff;
    font:750 8px/1.1 ui-monospace,SFMono-Regular,Menlo,monospace;
    letter-spacing:.08em;
    text-align:center;
    text-transform:uppercase;
    opacity:0;
}
.ew-cursor.is-active .ew-cursor__label{opacity:1}

@media(pointer:fine){
    body.ew-custom-cursor,
    body.ew-custom-cursor a,
    body.ew-custom-cursor button,
    body.ew-custom-cursor [data-cursor]{cursor:none!important}

    /* Панель администратора Битрикс должна оставаться удобной для работы. */
    body.ew-custom-cursor #bx-panel,
    body.ew-custom-cursor #bx-panel *{cursor:auto!important}
}
@media(max-width:760px){
    .ew-cursor{display:none!important}
}
