

.fglow, .rglow, .lglow{
  position: relative;
  z-index: 1;
}

.fglow::before, .rglow::before {
  content: "";
  display: block;
  width: 100vw;
  max-width: 1338px;
  height: 1052px;
  top: 0px;
  left: 50%;
  transform: translate(-50%, -50%);
  position: absolute;
  z-index: -1;
  background: url("../img/bg_ellipse.svg") center no-repeat;
  filter: blur(400px);
}

.rglow::before {
  left: 100%;
  transform: translateX(-50%);
}

.lglow::after {
  content: "";
  display: block;
  width: 25vw;
  max-width: 900px;
  height: 1052px;
  bottom: 0%;
  right: 100%;
  transform: translate(23%, 0%);
  position: absolute;
  z-index: -1;
  background: url("../img/bg_ellipse.svg") center no-repeat;
  filter: blur(400px);
}

.relative{
  position: relative;
}

@media (max-width: 1024px) {
  .lglow::before,
  .rglow::before,
  .fglow::before,
  .about::before,
  .features::before,
  .refferal::before,
  .algorithm::before,
  .profit::before,
  .profit::after,
  .money::before,
  .company::before,
  .history::before,
  .history::after,
  .more-about::before,
  .mission::before,
  .mission::after,
  .important::before,
  .friend::before,
  .why::before,
  .how::before,
  .motion::before,
  .vector::before,
  .vector::after,
  .start::before,
  .program::before,
  .participate::before,
  .career::before,
  .inform::before,
  .planned::before,
  .road::before,
  .road::after,
  .sign-in::before{
    /*min-height: 1024px;*/
    /*background-repeat: repeat;*/
    /*filter: blur(200px);*/
    /*height: 100%;*/
    display: none;
  }

  body{
    position: relative;
    /*isolation: isolate; !* чтобы слои работали предсказуемо *!*/
  }



  body::after{
    
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;

    height: 45vh;
    pointer-events: none;
    z-index: -1;
    background: linear-gradient(
      to bottom,
      rgba(12,19,29,0) 0%,
      rgba(12,19,29,0.55) 35%,
      rgba(12,19,29,0.92) 100%
    );
  }
}

.btn__blue {
  display: flex;
  align-items: center;
  gap: 6rem;
  font-size: 18em;
  line-height: 1;
  font-weight: 500;

  padding: 14rem 26rem;
  letter-spacing: 0.2px;
}


.btn__blue svg {
  width: 18rem;
  height: 18rem;
  transition: 0.3s ease;
  animation: svgFloat 3s ease-in-out infinite;
}

@keyframes svgFloat {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-2px);
  }
  100% {
    transform: translateY(0);
  }
}

.btn__blue:hover svg {
  animation: svgPulse 0.6s ease;
}

@keyframes svgPulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.15);
  }
  100% {
    transform: scale(1);
  }
}

/* common laptop screens (~1366px and the effective widths around it) —
   the site's own fluid --fontSize scaling actually grows at this
   breakpoint instead of shrinking, so everything looks oversized and
   cramped. Scale the whole page down to compensate.
   Scoped to html.main only (the marketing pages via header.tpl) —
   header2.tpl (cabinet) doesn't set that class, so it's unaffected. */
@media (min-width: 1201px) and (max-width: 1700px) {
  html.main body {
    zoom: 0.87;
  }
}

/* 2026-09-30: публичные страницы на ноутбуках выглядят как при зуме браузера 90%
   (так попросил владелец). Браузер при 90% делает то же, что здесь: px-блоки
   уменьшаются ещё на 10% (zoom .87 -> .783), а размеры, заданные через базы
   сайта, пересчитываются как для экрана в 1/.9 шире - то есть по правилам
   1367-1921 из style-new.min.css: html.main .8px (rem), body .85px (em - весь
   текст), xbot 1px/1px, и vw-переменные --size/--fontSize / .9.
   ЛК (header2.tpl, без класса main) не затронут. */
@media (min-width: 1201px) and (max-width: 1700px) {
  html.main {
    font-size: calc(.8px / .9);
    --size: calc(.0520833333vw / .9);
    --fontSize: calc(.0520833333vw / .9);
  }
  html.main body {
    zoom: 0.783;
    font-size: calc(.85px / .9);
  }
  html.main.xbot,
  html.main.xbot body {
    font-size: calc(1px / .9);
  }
}
/* 1366 и уже: текст ещё на 10% крупнее (владельцу мелко) */
@media (min-width: 1201px) and (max-width: 1366px) {
  html.main body {
    font-size: calc(.85px / .9 * 1.1);
  }
}

/* hero buttons (index.tpl) */

.hero-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;

    height:48px;
    padding:0 28px;

    border-radius:999px;
    text-decoration:none;

    color:#16263d;
    font-size:17px;
    font-weight:600;

    border:1px solid rgba(255,255,255,.75);

    background:linear-gradient(180deg,#bddcff 0%,#9fc6f6 100%);


    transition:.28s;
}

.hero-btn svg{
    width:18px;
    height:18px;
    flex-shrink:0;
}

.hero-btn .arrow{
    width:18px;
    height:18px;
    margin-left:2px;
    transition:.28s;
}

.hero-btn:hover{
    transform:translateY(-2px);

    background:linear-gradient(180deg,#d4e8ff 0%,#afd3ff 100%);

    box-shadow:
        inset 0 2px 0 rgba(255,255,255,1),
        inset 0 -2px 0 rgba(72,109,167,.25),
        0 12px 28px rgba(46,119,220,.35);
}

.hero-btn:hover .arrow{
    transform:translateX(4px);
}

.hero-btn:active{
    transform:translateY(0);
}

.hero-btn-primary{
    margin-right:14px;
}

.hero-btn-secondary{
    background:linear-gradient(180deg,#b8d8fb 0%,#99c3f3 100%);
}

@media (min-width:1201px) and (max-width:1700px){

    .hero-btn{
        height:40px;
        padding:0 20px;
        font-size:14px;
        gap:8px;
    }

    .hero-btn svg, .hero-btn .arrow{
        width:15px;
        height:15px;
    }

}

@media (max-width:768px){

    .hero-btn{
        height:43px;
        padding:0 24px;
        font-size:16px;
    }

}

/* mobfix: Sign Up / Log In в одну строку на узких телефонах */
@media (max-width:420px){
    .header__row{ gap:10px; }
    .header__row .hero-btn{ height:40px; padding:0 15px; font-size:14px; gap:7px; margin:0; }
    .header__row .hero-btn svg{ width:16px; height:16px; }
    .nav__logo{ min-width:0; }
    .nav__logo img{ max-width:100%; height:auto; }
}
@media (max-width:374px){
    .header__row{ gap:8px; }
    .header__row .hero-btn{ padding:0 13px; font-size:13.5px; gap:6px; }
    .header__row .hero-btn .arrow{ display:none; }
}
/* mobfix: логотип по центру по высоте, вровень с флагом и Menu (картинка была прижата к верху блока) */
@media (max-width:1024px){
    .nav__logo{ display:flex; align-items:center; }
    .nav__logo img{ display:block; }
}
@media (max-width:345px){
    .nav__logo{ max-width:112px; }
}



@media (max-width: 768px) {

  .hero__img.hero__content .cube{

    display: block;

    width: 200vw;          /* было 220vw — это и делало темнее */

    height: auto;



    position: relative;

    left: 50%;

     transform: translateX(-50%) scale(0.75);

    transform-origin: 50% 0%;



    opacity: 1;         /* было .45 */

    pointer-events: none;

  }

}





