    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
      /* Маппинг Figma-токенов → локальные алиасы */
      --purple:       var(--color-violet-accent);   /* #9747FF */
      --purple-mid:   var(--color-violet-main);      /* #4B0082 */
      --white:        var(--color-primary-white);    /* #FFFFFF */
      --text:         var(--color-primary-black);    /* #393939 */
      --yellow:       #FFD600;
      --font:         var(--font-nunito);
    }

    html { scroll-behavior: smooth; scrollbar-gutter: stable; }
    body {
      font-family: var(--font);
      color: var(--text);
      background: #F5F5F5;
      overflow-x: hidden;
    }

    /* ============================================
       КНОПКИ ИЗ FIGMA UI-KIT (button COMPONENT_SET)
       4 варианта × 2 размера: .btn--primary/--secondary/--action/--tertiary,
       .btn--m/--s. Существующие кнопки на страницах (btn-purple и т.д.)
       не переведены на этот компонент — использовать для новой вёрстки.
       ============================================ */
    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: fit-content;
      border: none;
      border-radius: var(--radius-pill);
      font-family: var(--font-nunito-sans);
      font-weight: 600;
      cursor: pointer;
      text-decoration: none;
      white-space: nowrap;
      transition: background-color .2s, background-image .2s, opacity .2s;
    }

    .btn--m { padding: 16px 32px; gap: 16px; font-size: 16px; }
    .btn--s { padding: 12px 24px; gap: 12px; font-size: 14px; }

    .btn--primary {
      background-image: linear-gradient(135deg, var(--color-violet-main) 0%, var(--color-violet-light) 100%);
      color: var(--color-primary-white);
    }
    .btn--primary:hover,
    .btn--primary:active {
      background-image: linear-gradient(rgba(0, 0, 0, .2), rgba(0, 0, 0, .2)),
        linear-gradient(135deg, var(--color-violet-main) 0%, var(--color-violet-light) 100%);
    }

    .btn--secondary {
      background: var(--color-violet-bg);
      color: var(--color-violet-main);
    }
    .btn--secondary:hover,
    .btn--secondary:active { background: var(--color-violet-pale); }

    .btn--action {
      background: var(--color-primary-white);
      color: var(--color-violet-main);
    }
    .btn--action:hover,
    .btn--action:active { background: var(--color-violet-bg); }

    .btn--tertiary {
      background: var(--opacity-white-20);
      color: var(--color-primary-white);
    }
    .btn--tertiary:hover,
    .btn--tertiary:active { background: var(--opacity-white-10); }

    @media (max-width: 768px) {
      .btn--m { padding: 14px 28px; gap: 14px; font-size: 15px; }
      .btn--s { padding: 10px 20px; gap: 10px; font-size: 13px; }
    }
    @media (max-width: 480px) {
      .btn--m { padding: 12px 24px; gap: 12px; font-size: 14px; }
      .btn--s { padding: 10px 18px; gap: 8px; font-size: 13px; }
    }

    /* ============================================
       ПОЛЯ ВВОДА ИЗ FIGMA UI-KIT (Input COMPONENT_SET)
       2 темы × 2 размера: .field--dark/--light, .field--m/--s
       ============================================ */
    .field {
      display: flex;
      align-items: center;
      width: 100%;
      border: none;
      outline: none;
      box-sizing: border-box;
      border-radius: var(--radius-input);
      background: rgba(255, 255, 255, 0.3);
      backdrop-filter: blur(37px);
      -webkit-backdrop-filter: blur(37px);
      font-family: var(--font-nunito-sans);
      font-size: 20px;
      font-weight: 400;
      transition: color .2s;
    }

    .field--m { height: 76px; padding: 24px 32px; }
    .field--s { height: 60px; padding: 16px 24px; }

    .field--dark {
      color: var(--color-violet-pale);
    }
    .field--dark:focus { color: var(--color-primary-white); font-weight: 600; }
    .field--dark::placeholder { color: var(--color-violet-pale); }

    .field--light {
      color: var(--color-violet-main);
    }
    .field--light::placeholder { color: var(--color-violet-main); }

    /* ============================================
       КАРТОЧКИ (тёмная/светлая) — паттерн, повторявшийся под разными
       именами (launch-card #211640, jr-path-card #E1DDFC) с идентичным
       CSS; вынесено в компонент .card--dark/--light
       ============================================ */
    .card {
      border-radius: 32px;
      padding: 32px;
      min-height: 480px;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      position: relative;
      overflow: hidden;
    }
    .card--dark {
      background: var(--color-purple-100);
      color: var(--color-primary-white);
    }
    .card--light {
      background: var(--color-violet-pale);
      color: var(--color-violet-main);
    }

    /* Обёртка всего лендинга — 1440px, отступы 20px */
    .page-wrapper {
      max-width: 1440px;
      margin: 0 auto;
      padding: 0 20px;
      background: #F5F5F5;
    }

    /* ─── HEADER ─── */
    .header {
      background: #FFF;
      border-radius: 100px;
      padding: 16px 16px 16px 32px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      position: sticky;
      top: 16px;
      margin-top: 16px;
      margin-bottom: 16px;
      z-index: 100;
    }

    /* Логотип */
    .logo {
      display: flex;
      align-items: center;
      text-decoration: none;
      flex-shrink: 0;
    }
    .logo-soyuz {
      display: flex;
      align-items: center;
    }
    .logo-soyuz img {
      width: 159px;
      height: 24px;
      display: block;
    }

    .nav { display: flex; align-items: center; gap: 32px; }
    .nav a {
      color: var(--color-violet-main, #4B0082);
      text-decoration: none;
      font-family: var(--font-nunito-sans), sans-serif;
      font-size: 20px;
      font-style: normal;
      font-weight: 400;
      line-height: 28px;
      letter-spacing: -0.38px;
      transition: color .2s;
      cursor: pointer;
    }
    .nav a:hover { color: var(--purple); }

    .header-btns { display: flex; align-items: center; gap: 10px; }

    /* ── BURGER ── */
    .burger-btn {
      display: none;
      align-items: center;
      justify-content: center;
      width: 40px;
      height: 40px;
      padding: 0;
      background: none;
      border: none;
      cursor: pointer;
      flex-shrink: 0;
    }

    /* ── MOBILE OVERLAY ── */
    .mobile-overlay {
      display: none;
      position: fixed;
      inset: 0;
      background: transparent;
      z-index: 998;
    }
    .mobile-overlay.open { display: block; }

    /* ── MOBILE MENU — dropdown-карточка ── */
    .mobile-menu {
      position: fixed;
      top: 56px;
      left: 16px;
      right: 16px;
      bottom: auto;
      width: auto;
      max-width: 358px;
      padding: 24px 16px 16px;
      background: #fff;
      border-radius: 32px;
      box-shadow: 0 8px 32px rgba(75, 0, 130, 0.15);
      z-index: 999;
      display: flex;
      flex-direction: column;
      gap: 24px;
      opacity: 0;
      visibility: hidden;
      transform: translateY(-8px);
      transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
    }
    .mobile-menu.open {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
    }
    .burger-btn .close-icon { display: none; }
    .burger-btn.open .burger-icon { display: none; }
    .burger-btn.open .close-icon { display: block; }
    .mobile-nav {
      display: flex;
      flex-direction: column;
      gap: 20px;
    }
    .mobile-nav a {
      color: #4B0082;
      text-decoration: none;
      font-family: "Nunito Sans", sans-serif;
      font-size: 16px;
      font-weight: 600;
      line-height: 135%;
      letter-spacing: -0.304px;
      transition: opacity 0.2s;
      cursor: pointer;
    }
    .mobile-nav a:hover { opacity: 0.7; }
    .mobile-menu-btns {
      display: flex;
      flex-direction: row;
      gap: 10px;
    }
    .mobile-menu-btns .btn-purple,
    .mobile-menu-btns .btn-outline-white {
      flex: 1;
      text-align: center;
      justify-content: center;
      padding: 14px 12px;
      font-family: "Nunito Sans", sans-serif;
      font-weight: 600;
      font-size: 16px;
      line-height: 135%;
      letter-spacing: -0.019em;
    }

    /* «Вступить в союз» — фиолетовая pill-кнопка */
    .btn-outline-white {
      border-radius: 100px;
      background: var(--color-violet-bg);
      backdrop-filter: blur(30px);
      -webkit-backdrop-filter: blur(30px);
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 24px;
      border: none;
      color: var(--color-violet-main);
      padding: 12px 20px;
      font-family: var(--font);
      font-size: 14px;
      font-weight: 600;
      cursor: pointer;
      transition: opacity .2s;
      white-space: nowrap;
      text-decoration: none;
    }
    .btn-outline-white:hover { opacity: 0.85; }

    .btn-purple {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 24px;
      padding: 12px 20px;
      border-radius: 100px;
      background: linear-gradient(90deg, var(--color-violet-main) -33.73%, var(--color-violet-light) 108.63%);
      backdrop-filter: blur(30px);
      -webkit-backdrop-filter: blur(30px);
      color: var(--color-primary-white);
      border: none;
      font-family: var(--font);
      font-size: 14px;
      font-weight: 600;
      cursor: pointer;
      transition: opacity .2s;
      white-space: nowrap;
      text-decoration: none;
    }
    .btn-purple:hover { opacity: 0.9; }

    /* ─── HERO ─── */
    .hero-wrap {
      background: #F5F5F5;
      padding: 0;
    }
    .hero {
      background: linear-gradient(90deg, #4B0082 -33.73%, #B3AEF3 108.63%);
      border-radius: 64px;
      min-height: 630px;
      padding: 80px 60px;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      overflow: hidden;
      isolation: isolate;
      contain: paint;
      -webkit-mask-image: -webkit-radial-gradient(white, black);
      mask-image: radial-gradient(white, black);
    }

    /* Декоративные стеклянные полосы */
    .hero-stripes {
      position: absolute;
      inset: 0;
      display: flex;
      gap: 0;
      pointer-events: none;
      z-index: 1;
    }
    .hero-stripe {
      width: 66.7px;
      flex-shrink: 0;
      background: linear-gradient(270deg, rgba(255, 255, 255, 0.01) 0%, rgba(0, 0, 0, 0.05) 39.4%, rgba(255, 255, 255, 0.01) 100%);
      background-blend-mode: overlay;
      backdrop-filter: blur(90px);
      -webkit-backdrop-filter: blur(90px);
    }

    /* Декоративный эллипс */
    .hero::before {
      content: '';
      position: absolute;
      right: -100px; top: 50%;
      transform: translateY(-50%);
      width: 625px; height: 669px;
      background: radial-gradient(circle, rgba(200,180,240,0.30) 0%, transparent 70%);
      border-radius: 50%;
      pointer-events: none;
      z-index: 0;
    }

    /* Центральный контент */
    .hero-content {
      max-width: 900px;
      z-index: 2;
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
    }
    .hero-content h1 {
      font-family: var(--font-onder);
      font-size: 32px;
      font-weight: 500;
      line-height: 64px;
      letter-spacing: 0.64px;
      text-align: center;
      color: #fff;
      text-shadow: 0 4px 53.7px rgba(97, 70, 94, 0.10);
      margin-bottom: 32px;
      text-transform: uppercase;
    }
    @media (max-width: 1190px) {
      .hero-content h1 span { white-space: normal !important; }
    }
    .hero-content p {
      color: rgba(255,255,255,0.9);
      text-shadow: 0 4px 53.7px rgba(97, 70, 94, 0.10);
      margin-bottom: 0;
      max-width: 869px;
      width: 100%;
      overflow: hidden;
    }
    .hero-subtitle-inner {
      display: block;
      font-family: var(--font-nunito-sans);
      font-weight: 400;
      font-size: 20px;
      line-height: 28px;
      letter-spacing: -0.38px;
      text-align: center;
    }
    @keyframes heroSubOut {
      from { opacity: 1; transform: translateY(0); }
      to   { opacity: 0; transform: translateY(-110%); }
    }
    @keyframes heroSubIn {
      from { opacity: 0; transform: translateY(110%); }
      to   { opacity: 1; transform: translateY(0); }
    }
    .hero-subtitle-inner.anim-out {
      animation: heroSubOut 0.35s cubic-bezier(0.4, 0, 1, 1) forwards;
    }
    @media (max-width: 610px) {
      .hero-content {
        align-items: flex-start;
        text-align: left;
      }
      .hero-content h1 {
        font-family: var(--font-onder) !important;
        font-weight: 500 !important;
        font-size: 14px !important;
        line-height: 212% !important;
        letter-spacing: 0.28px !important;
        text-align: left;
      }
      .hero-subtitle-inner {
        font-family: var(--font-nunito-sans);
        font-weight: 500;
        font-size: 14px;
        line-height: 135%;
        letter-spacing: -0.266px;
        text-align: left;
      }
      .hero-btns { width: 100%; }
      .hero-btns .btn {
        width: 100%;
        justify-content: center;
      }
    }
    .hero-subtitle-inner.anim-in {
      animation: heroSubIn 0.45s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }

    /* Кнопки */
    .hero-btns { display: flex; gap: 16px; align-items: center; justify-content: center; margin-top: 48px; margin-bottom: 0; }
    .btn svg { width: 24px; height: 24px; flex-shrink: 0; }
    .btn-ghost {
      background: rgba(255,255,255,0.20);
      color: #fff;
      border: none;
      padding: 0 32px;
      height: 76px;
      border-radius: 100px;
      font-family: var(--font-nunito-sans);
      font-size: 20px;
      font-weight: 600;
      letter-spacing: -0.38px;
      cursor: pointer;
      transition: all .2s;
      display: flex;
      align-items: center;
      gap: 10px;
      backdrop-filter: blur(12px);
      text-decoration: none;
    }
    .btn-ghost:hover { background: rgba(255,255,255,0.30); }
    .btn-ghost svg { width: 24px; height: 24px; }

    /* ─── STATS ─── */
    .stats {
      padding: 100px 80px 0;
      background: transparent;
      display: flex;
      align-items: flex-end;
      justify-content: center;
      gap: 80px;
      overflow: visible;
    }
    .stat-item {
      display: flex;
      flex-direction: column;
      opacity: 0;
      overflow: visible;
    }
    .stat-number {
      font-family: var(--font-onder);
      font-size: 32px;
      font-style: normal;
      font-weight: 500;
      color: #4B0082;
      line-height: 1.2;
      letter-spacing: 0.64px;
      display: block;
    }
    .stat-number .counter {
      display: inline;
    }
    .stat-number-gradient {
      font-size: 64px;
      line-height: 1.3;
      padding: 4px 0;
      background: linear-gradient(90deg, #4B0082 -33.73%, #B3AEF3 108.63%);
      background-clip: text;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      display: block;
      white-space: nowrap;
    }
    .stat-label {
      font-family: "Nunito Sans", var(--font-nunito-sans), sans-serif;
      font-size: 24px;
      font-style: normal;
      font-weight: 600;
      color: #4B0082;
      line-height: 36px;
      letter-spacing: -0.456px;
      margin-top: 16px;
      white-space: nowrap;
    }
    .stat-label-gradient {
      background: linear-gradient(90deg, #4B0082 -33.73%, #B3AEF3 108.63%);
      background-clip: text;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }

    /* ─── SPECIALISTS ─── */
    .specialists-wrapper {
      position: relative;
      height: 700px;
    }
    @media (min-width: 1001px) {
      .specialists-wrapper { height: auto; }
    }
    .specialists {
      display: flex;
      align-items: center;
      justify-content: center;
      background: #F5F5F5;
      gap: 0;
      overflow: visible;
      position: sticky;
      top: 0;
      padding: 0;
      /* Высота карточек подстраивается под доступную высоту экрана (за вычетом
         шапки и отступов), чтобы блок всегда помещался целиком —
         иначе на невысоких окнах браузера ему физически не хватало места. */
      --sp-h: clamp(480px, calc(100vh - 150px), 717px);
    }
    @media (min-width: 1001px) {
      .specialists { position: relative; top: auto; --sp-h: 700px; }
    }
    /* ── Единый слайд: фото + текст как одно целое ── */
    .sp-stage {
      position: relative;
      flex: 0 0 auto;
      width: calc(var(--sp-h) * 1.7011);
      min-width: 0;
      height: var(--sp-h);
      margin-bottom: -60px;
    }
    /* Планшет/мобильный — карточка на всю ширину секции, высота — по
       соотношению сторон самой «высокой» картинки в каждом наборе
       (Slider*_768/slider*_390), чтобы ни одна из трёх не обрезалась. */
    @media (max-width: 1000px) {
      .specialists { padding: 0 16px; box-sizing: border-box; }
      .sp-stage {
        flex: 1 1 0;
        width: auto;
        height: auto;
        aspect-ratio: 0.6778;
        margin-bottom: 0;
      }
    }
    @media (max-width: 691px) {
      .sp-stage { aspect-ratio: 0.4809; }
    }
    /* Обрезка (для скольжения трека/старой fade-анимации) — на отдельной
       обёртке, а не на .sp-stage, иначе стрелки карусели (они выступают
       за край карточки) обрезались бы вместе с содержимым. */
    .sp-viewport {
      position: relative;
      width: 100%;
      height: 100%;
      overflow: hidden;
      border-radius: 68px;
    }
    .sp-unit {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      opacity: 0;
      pointer-events: none;
      transform: translateY(72px);
      transition: transform 1.0s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                  opacity   0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }
    .sp-unit.active {
      opacity: 1;
      pointer-events: auto;
      transform: translateY(0);
    }
    .sp-unit.slide-exit-up {
      opacity: 0;
      transform: translateY(-48px);
      transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                  opacity   0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }

    /* ── Карусель (все ширины): .sp-track сдвигается по горизонтали,
       .sp-unit — обычный flex-item на всю ширину ── */
    .sp-track {
      position: relative;
      width: 100%;
      height: 100%;
      display: flex;
      transition: transform 0.85s cubic-bezier(0.22, 1, 0.36, 1);
    }
    .sp-unit,
    .sp-unit.slide-exit-up {
      position: static;
      flex: 0 0 100%;
      width: 100%;
      opacity: 1;
      pointer-events: auto;
      transform: none;
      transition: none;
    }
    /* Стрелки — только на планшете/десктопе; на мобильном (≤691px)
       переключение только свайпом, без стрелок. */
    .spec-carousel-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 64px;
      height: 64px;
      padding: 0;
      border: none;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.9);
      backdrop-filter: blur(30px);
      -webkit-backdrop-filter: blur(30px);
      cursor: pointer;
      z-index: 5;
      transition: background 0.2s;
    }
    .spec-carousel-btn:hover { background: #fff; }
    .spec-carousel-btn--prev { left: -32px; }
    .spec-carousel-btn--next { right: -32px; }
    @media (max-width: 691px) {
      .spec-carousel-btn { display: none; }
    }
    .sp-photo {
      width: 560px;
      flex-shrink: 0;
      align-self: stretch;
      background-size: contain;
      background-position: center bottom;
      background-repeat: no-repeat;
      border-radius: 68px;
      z-index: 2;
    }
    .sp-photo-1 { background-image: url('../images/index/slides/specialist1.webp'); }
    .sp-photo-2 { background-image: url('../images/index/slides/specialist3.webp'); }
    .sp-photo-3 { background-image: url('../images/index/slides/specialist2.webp'); }

    /* ── Новые слайды (готовые изображения с фото + сиреневым блоком) ── */
    .sp-old-slide { display: none; }
    .sp-new-slide {
      position: relative;
      display: block;
      width: 100%;
      height: auto;
    }
    .sp-slide-img {
      width: 100%;
      height: auto;
      display: block;
    }
    .sp-slide-img--1024 { display: none; }
    .sp-slide-img--768 { display: none; }
    .sp-slide-img--390 { display: none; }
    @media (max-width: 1000px) and (min-width: 692px) {
      .sp-slide-img--desktop { display: none; }
      .sp-slide-img--768 { display: block; }
      .sp-unit:nth-child(1) .spec-more-overlay.spec-more-btn,
      .sp-unit:nth-child(2) .spec-more-overlay.spec-more-btn,
      .sp-unit:nth-child(3) .spec-more-overlay.spec-more-btn {
        top: 91% !important;
        left: 54px;
        right: 0;
        bottom: 48px;
        width: 84%;
        justify-content: center;
      }
      .spec-carousel-btn {
        top: 70%
      }
    }
    @media (max-width: 691px) {
      .sp-slide-img--desktop { display: none; }
      .sp-slide-img--390 { display: block; }
      .sp-unit:nth-child(1) .spec-more-overlay.spec-more-btn,
      .sp-unit:nth-child(2) .spec-more-overlay.spec-more-btn,
      .sp-unit:nth-child(3) .spec-more-overlay.spec-more-btn,
      .sp-unit:nth-child(4) .spec-more-overlay.spec-more-btn {
        top: 89%;
      }
      .sp-unit:nth-child(1) .spec-more-overlay.spec-more-btn,
      .sp-unit:nth-child(2) .spec-more-overlay.spec-more-btn,
      .sp-unit:nth-child(3) .spec-more-overlay.spec-more-btn,
      .sp-unit:nth-child(4) .spec-more-overlay.spec-more-btn {
        top: 90% !important;
        left: 20px;
        right: 0;
        bottom: 35px;
        width: 87%;
        justify-content: center;
      }
      .sp-unit:nth-child(4) .spec-more-overlay.spec-more-btn {
        margin-top: 0 !important;
      }
    }

    /* Кнопка «Подробнее» наложена поверх картинки (в самой картинке она
       нарисована декоративно) — реальная ссылка нужна для клика/hover. */
    .sp-new-slide .spec-more-overlay.spec-more-btn {
      position: absolute;
      left: 47%;
      margin-top: 0;
    }
    .sp-unit:nth-child(1) .spec-more-overlay.spec-more-btn { top: 81.3%; }
    .sp-unit:nth-child(2) .spec-more-overlay.spec-more-btn { top: 84.3%; }
    .sp-unit:nth-child(3) .spec-more-overlay.spec-more-btn { top: 83.8%; }

    .spec-pagination {
      display: flex;
      width: 32px;
      flex-direction: column;
      align-items: flex-start;
      gap: 21px;
      position: absolute;
      right: 29px;
      top: 60%;
      transform: translateY(-50%);
      z-index: 10;
    }
    .spec-pagination svg {
      cursor: pointer;
      flex-shrink: 0;
    }

    /* Состояния точек карусели специалистов */
    /* Ещё не просмотрен */
    .spec-dot .dot-ring  { stroke: #B3AEF3; stroke-width: 2; }
    .spec-dot .dot-inner { fill: #B3AEF3; }
    .spec-dot .dot-arc   { stroke: #4B0082; stroke-width: 2; stroke-dashoffset: 94.25; }

    /* Активен сейчас — дуга управляется через JS (RAF).
       Кольцо-трек остаётся светлым, иначе дуга того же цвета на него не видна. */
    .spec-dot.active .dot-arc {
      stroke-dashoffset: 94.25;
    }
    .spec-dot.active .dot-ring  { stroke: #B3AEF3; stroke-width: 2; }
    .spec-dot.active .dot-inner { fill: #4B0082; }

    /* Уже был просмотрен */
    .spec-dot.visited .dot-ring  { stroke: #4B0082; stroke-width: 2; }
    .spec-dot.visited .dot-inner { fill: #4B0082; }
    .spec-dot.visited .dot-arc   { stroke-dashoffset: 0; transition: none; }

    .sp-text {
      flex: 1 1 0;
      min-width: 0;
      height: calc(var(--sp-h) - 55px);
      background: #E1DDFC;
      border-radius: 68px;
      padding: 50px 64px 64px 96px;
      position: relative;
      z-index: 1;
      margin-left: -42px;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: flex-start;
      gap: 10px;
      overflow: hidden;
    }

    .sp-unit:nth-child(1) .sp-text {
      margin-top: 55px;
    }
    .sp-unit:nth-child(2) .sp-text {
      height: calc(var(--sp-h) - 62px);
      margin-left: -20px;
      margin-top: 66px;
    }
    .sp-unit:nth-child(3) .sp-text {
      height: calc(var(--sp-h) - 70px);
      padding: 43px 64px 64px 96px;
      margin-top: 64px;
    }

    .spec-more-btn {
      display: flex;
      padding: 24px 48px;
      justify-content: center;
      align-items: center;
      gap: 24px;
      align-self: flex-start;
      border-radius: 100px;
      border: 1px solid rgba(255, 255, 255, 0.70);
      background: var(--white, #FFF);
      backdrop-filter: blur(30px);
      -webkit-backdrop-filter: blur(30px);
      color: #4B0082;
      font-family: "Nunito Sans", sans-serif;
      font-size: 18px;
      font-weight: 600;
      text-decoration: none;
      cursor: pointer;
      transition: box-shadow 0.2s;
      margin-top: 28px;
    }
    .spec-more-btn:hover {
      box-shadow: 0 6px 24px rgba(75, 0, 130, 0.18);
    }

    .sp-text h2 {
      font-family: 'Onder', sans-serif;
      font-size: 28px;
      font-weight: 500;
      font-style: normal;
      color: #4B0082;
      line-height: 58px;
      letter-spacing: 0.56px;
      margin-bottom: 18px;
      text-transform: uppercase;
    }
    .sp-text h2 em {
      font-family: 'Onder', sans-serif;
      font-size: 28px;
      font-weight: 500;
      font-style: normal;
      color: #9747FF;
      line-height: 58px;
      letter-spacing: 0.56px;
    }
    .specialists-subtitle {
      font-family: "Nunito Sans", sans-serif;
      font-size: 24px;
      font-style: normal;
      font-weight: 600;
      color: #4B0082;
      line-height: 36px;
      letter-spacing: -0.456px;
      margin-bottom: 28px;
    }
    .check-list { list-style: none; display: flex; flex-direction: column; gap: 20px; margin-bottom: 0; }
    .check-list li {
      display: flex;
      align-items: center;
      gap: 8px;
      align-self: stretch;
      font-family: "Nunito Sans", sans-serif;
      font-size: 20px;
      font-style: normal;
      font-weight: 400;
      color: #4B0082;
      line-height: 28px;
      letter-spacing: -0.38px;
    }
    .check-icon {
      width: 57px;
      height: 47px;
      aspect-ratio: 57 / 47;
      flex-shrink: 0;
    }

    /* ─── PLATFORM ─── */
    .platform {
      padding: 100px 60px;
      background: #F5F5F5;
      text-align: center;
    }
    .section-title {
      font-family: var(--font-onder);
      font-size: 38px;
      font-weight: 500;
      text-transform: uppercase;
      margin-bottom: 14px;
      color: var(--text);
      line-height: 1.1;
      padding-bottom: 48px;
    }
    .platform .section-title {
      font-family: 'Onder', sans-serif;
      font-size: 28px;
      font-weight: 500;
      font-style: normal;
      color: #4B0082;
      text-align: center;
      line-height: 58px;
      letter-spacing: 0.56px;
      text-transform: uppercase;
    }
    .platform .section-title em {
      font-family: 'Onder', sans-serif;
      font-size: 28px;
      font-weight: 500;
      font-style: normal;
      color: #9747FF;
      line-height: 58px;
      letter-spacing: 0.56px;
    }
    .section-subtitle {
      font-family: var(--font-nunito-sans);
      font-size: 16px;
      color: var(--color-gray-5);
      margin-bottom: 40px;
    }
    .tags-cloud {
      position: relative;
      width: 100%;
      height: 270px;
      margin: 0 auto 48px;
      overflow: visible;
    }
    .tag {
      position: absolute;
      display: inline-flex;
      transform-origin: center center;
      padding: 16px 24px;
      align-items: center;
      border-radius: 32px;
      background: #FFF;
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      color: var(--purple-mid);
      font-family: var(--font-nunito-sans);
      font-size: 16px;
      font-weight: 600;
      white-space: nowrap;
      cursor: grab;
      user-select: none;
      opacity: 0;
      transform: translateX(-50%) translateY(-320px) rotate(var(--tag-r, 0deg)) scale(0.8);
      transition:
        opacity  0.5s ease var(--td, 0s),
        transform 1.1s cubic-bezier(0.22, 1.5, 0.36, 1) var(--td, 0s),
        box-shadow 0.2s ease;
      z-index: 1;
    }
    .tags-cloud.visible .tag {
      opacity: 1;
      transform: translateX(-50%) translateY(0) rotate(var(--tag-r, 0deg)) scale(1);
    }
    .tag:hover:not(.is-dragging) {
      box-shadow: 0 8px 28px rgba(75, 0, 130, 0.18);
      z-index: 2;
    }
    .tag.is-dragging {
      transform: translateX(-50%) translateY(0) rotate(var(--tag-r, 0deg)) scale(1.05);
      box-shadow: 0 16px 40px rgba(75, 0, 130, 0.28);
      cursor: grabbing;
      z-index: 10;
      transition: box-shadow 0.15s, transform 0.1s;
    }

    /* Кнопка «Присоединиться» в секции платформы */
    .btn-join {
      display: inline-flex;
      padding: 24px 48px;
      justify-content: center;
      align-items: center;
      gap: 24px;
      border-radius: 100px;
      background: linear-gradient(90deg, var(--color-violet-main) -33.73%, var(--color-violet-light) 108.63%);
      backdrop-filter: blur(30px);
      -webkit-backdrop-filter: blur(30px);
      border: none;
      color: var(--color-primary-white);
      font-family: "Nunito Sans", sans-serif;
      font-size: 20px;
      font-style: normal;
      font-weight: 600;
      line-height: 28px;
      letter-spacing: -0.38px;
      cursor: pointer;
      margin: 48px auto 0;
      transition: opacity .2s;
      text-decoration: none;
    }
    .btn-join:hover { opacity: 0.9; }
    .btn-join svg { width: 24px; height: 24px; flex-shrink: 0; }

    /* ─── RESULT ─── */
    .result {
      background: linear-gradient(90deg, #4B0082 -33.73%, #B3AEF3 108.63%);
      border-radius: 64px;
      padding: 80px 100px;
      position: relative;
      overflow: hidden;
      isolation: isolate;
      /* Safari: overflow-клип с border-radius слетает из-за backdrop-filter
         дочерних .result-stripe / mix-blend-mode у .glow-spot.
         mask-image заставляет Safari клипать через маску стабильно. */
      -webkit-mask-image: -webkit-radial-gradient(white, black);
      mask-image: radial-gradient(white, black);
    }
    .result-stripes {
      position: absolute;
      inset: 0;
      display: flex;
      gap: 0;
      pointer-events: none;
      z-index: 0;
    }
    .result-stripe {
      width: 66.7px;
      flex-shrink: 0;
      background: linear-gradient(270deg, rgba(255,255,255,0.01) 0%, rgba(0,0,0,0.05) 39.4%, rgba(255,255,255,0.01) 100%);
      background-blend-mode: overlay;
      backdrop-filter: blur(90px);
      -webkit-backdrop-filter: blur(90px);
    }
    .result-header {
      text-align: center;
      margin-bottom: 40px;
      position: relative;
      z-index: 1;
    }
    .result-header h2 {
      font-family: 'Onder', sans-serif;
      font-size: 28px;
      font-style: normal;
      font-weight: 500;
      color: #FFF;
      text-align: center;
      line-height: 58px;
      letter-spacing: 0.56px;
      text-transform: uppercase;
    }
    .result-tabs {
      display: flex;
      gap: 8px;
      position: relative;
      z-index: 1;
      justify-content: center;
      margin-bottom: 32px;
    }
    .tab-btn {
      display: flex;
      width: 227.2px;
      padding: 16px 24px 16px 16px;
      justify-content: center;
      align-items: center;
      gap: 10px;
      border-radius: 24px;
      background: rgba(255, 255, 255, 0.20);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      border: none;
      color: #fff;
      font-family: var(--font-nunito-sans);
      font-size: 16px;
      font-weight: 600;
      cursor: pointer;
      transition: background .2s;
    }
    .tab-btn:hover { background: rgba(255,255,255,0.30); }
    .tab-btn.active {
      border-radius: 24px;
      background: #4B0082;
    }
    .tab-btn img {
      width: 40px;
      height: 40px;
      object-fit: contain;
      animation: icon-float 2.4s ease-in-out infinite;
    }

    .tab-btn:nth-child(1) img { animation-delay: 0.0s; }
    .tab-btn:nth-child(2) img { animation-delay: 0.5s; }
    .tab-btn:nth-child(3) img { animation-delay: 1.0s; }
    .tab-btn:nth-child(4) img { animation-delay: 1.5s; }
    .tab-btn:nth-child(5) img { animation-delay: 2.0s; }

    @keyframes icon-float {
      0%,  100% { transform: translateY(0) rotate(0deg); }
      30%        { transform: translateY(-7px) rotate(-5deg); }
      70%        { transform: translateY(-3px) rotate(4deg); }
    }

    .result-card {
      display: flex;
      gap: 16px;
      padding: 16px;
      border-radius: 32px;
      position: relative;
      z-index: 1;
      backdrop-filter: blur(30px);
      -webkit-backdrop-filter: blur(30px);
      max-width: 1200px;
      /* min-height: 552px; */
      height: auto;
      margin: 0 auto 32px;
      overflow: hidden;
    }
    .result-card-image {
      width: 555px;
      height: 344px;
      flex-shrink: 0;
      border-radius: 26px;
      background: url('../images/rso_project.png') center / cover no-repeat;
      background-color: #BDC9F5;
      position: relative;
      overflow: hidden;
    }
    .result-card-logo {
      position: absolute;
      bottom: 0;
      left: 0;
      border-radius: 26px 0 26px 0;
      padding: 16px 32px 32px 24px;
      background: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .result-card-logo img {
      height: 40px;
      width: auto;
    }
    .result-card-review {
      flex: 1;
      min-width: 0;
      max-height: 344px;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      padding: 24px 64px 24px 24px;
      overflow: hidden;
      background: #4B0082;
      border-radius: 26px;
    }
    .result-card-stats {
      display: flex;
      gap: 32px;
      align-items: flex-start;
      flex-wrap: wrap;
    }
    .result-stat-item {
      display: flex;
      flex-direction: column;
      gap: 4px;
      min-width: 0;
    }
    .result-stat-num {
      display: flex;
      height: 60px;
      padding: 12px 16px;
      flex-direction: column;
      align-items: flex-start;
      gap: 10px;
      border-radius: 20px 4px;
      background: var(--white, #FFF);
      color: #FFF;
      font-family: 'Onder', sans-serif;
      font-size: clamp(12px, 1vw, 18px);
      font-style: normal;
      font-weight: 500;
      line-height: 2.2;
      letter-spacing: 0.48px;
      overflow-wrap: break-word;
      justify-content: center;
    }
    .result-stat-label {
      margin-top: 8px;
      color: #FFF;
      font-family: "Nunito Sans", sans-serif;
      font-size: clamp(12px, 0.9vw, 15px);
      font-style: normal;
      font-weight: 400;
      line-height: 1.4;
      letter-spacing: -0.38px;
      word-break: break-word;
    }
    .result-card-text { display: flex; flex-direction: column; gap: 8px; flex: 1; min-height: 0; }
    .result-card-text h4 {
      color: #FFF;
      font-family: "Nunito Sans", sans-serif;
      font-size: 20px;
      font-style: normal;
      font-weight: 700;
      line-height: 28px;
      /* letter-spacing:-1.9%; */
      padding-top: 12px;
    }
    .result-card-text p {
      color: #FFF;
      font-family: "Nunito Sans", sans-serif;
      font-size: 14px;
      font-style: normal;
      font-weight: 400;
      line-height: 22px;
      letter-spacing: -0.3px;
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      overflow-x: hidden;
      scrollbar-width: thin;
      scrollbar-color: rgba(255,255,255,0.4) transparent;
    }
    .result-card-text p::-webkit-scrollbar { width: 4px; }
    .result-card-text p::-webkit-scrollbar-track { background: transparent; }
    .result-card-text p::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.4); border-radius: 4px; }
    /* Review block */
    .result-review-block {
      display: flex;
      flex-direction: column;
      gap: 16px;
      flex: 1;
      min-height: 0;
    }
    .result-review-author {
      display: flex;
      align-items: flex-start;
      gap: 12px;
    }
    .result-review-avatar {
      width: 56px;
      height: 56px;
      border-radius: 16px;
      object-fit: cover;
      flex-shrink: 0;
    }
    .result-review-author-info {
      display: flex;
      flex-direction: column;
      gap: 4px;
    }
    .result-review-name {
      color: #FFF;
      font-family: "Nunito Sans", sans-serif;
      font-size: 16px;
      font-weight: 700;
      line-height: 24px;
      letter-spacing: -0.3px;
    }
    .result-review-position {
      color: rgba(255,255,255,0.65);
      font-family: "Nunito Sans", sans-serif;
      font-size: 13px;
      font-weight: 400;
      line-height: 18px;
      letter-spacing: -0.25px;
    }
    .result-review-quote {
      position: relative;
      flex: 1;
      min-height: 0;
      display: flex;
    }
    .result-review-rect {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: fill;
      pointer-events: none;
    }
    .result-review-quote-inner {
      position: relative;
      display: flex;
      gap: 8px;
      align-items: stretch;
      flex: 1;
      min-height: 0;
    }
    .result-review-kavichki {
      width: 32px;
      height: auto;
      flex-shrink: 0;
      align-self: flex-start;
    }
    .result-review-text {
      color: #FFF;
      font-family: "Nunito Sans", sans-serif;
      font-size: 16px;
      font-weight: 400;
      line-height: 135%;
      letter-spacing: -2%;
      margin: 0;
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      overflow-x: hidden;
      scrollbar-width: thin;
      scrollbar-color: rgba(255,255,255,0.4) transparent;
    }
    .result-review-text::-webkit-scrollbar { width: 4px; }
    .result-review-text::-webkit-scrollbar-track { background: transparent; }
    .result-review-text::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.4); border-radius: 4px; }

    .result-card-figma-link {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      margin-top: auto;
      color: var(--1t-2, #B3AEF3);
      font-family: "Nunito Sans", sans-serif;
      font-size: 16px;
      font-style: normal;
      font-weight: 400;
      line-height: 28px;
      letter-spacing: -0.304px;
      text-decoration-line: underline;
      text-decoration-style: solid;
      text-decoration-skip-ink: auto;
      text-decoration-thickness: auto;
      text-underline-offset: auto;
      text-underline-position: from-font;
    }
    .result-card-figma-link img {
      width: 43px;
      height: 43px;
      flex-shrink: 0;
    }
    .result-card-pagination {
      display: flex;
      flex-direction: column;
      gap: 21px;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      position: absolute;
      right: 30px;
      top: 50%;
      transform: translateY(-50%);
      z-index: 2;
    }
    .result-card-pagination svg { cursor: pointer; display: block; }
    /* Result panels & slides */
    .result-panel { display: none; }
    .result-panel.active { display: block; }
    .result-card-slides {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
    }
    .result-slide { display: none; flex: 1;}
    .result-slide.active { display: flex; }

    /* Result timer dots (white on dark background) */
    .result-dot { cursor: pointer; display: block; flex-shrink: 0; }
    .result-dot .rdot-ring  { stroke: rgba(255,255,255,0.3); stroke-width: 2; }
    .result-dot .rdot-inner { fill: rgba(255,255,255,0.3); }
    .result-dot .rdot-arc   { stroke: #fff; stroke-width: 2; stroke-dashoffset: 94.25; }
    /* Кольцо-трек остаётся полупрозрачным, иначе дуга-таймер того же цвета на нём не видна */
    .result-dot.active .rdot-ring  { stroke: rgba(255,255,255,0.3); }
    .result-dot.active .rdot-inner { fill: #fff; }
    .result-dot.visited .rdot-ring  { stroke: rgba(255,255,255,0.6); }
    .result-dot.visited .rdot-inner { fill: #fff; }
    .result-dot.visited .rdot-arc   { stroke-dashoffset: 0; }
    .result-bottom {
      text-align: center;
      position: relative;
      z-index: 1;
    }
    .result-bottom_title {
      color: #FFF;
      font-family: "Nunito Sans", sans-serif;
      font-size: 24px;
      font-style: normal;
      font-weight: 600;
      line-height: 36px;
      letter-spacing: -0.456px;
      margin-bottom: 6px;
    }
    .result-bottom_subtitle {
      color: #FFF;
      font-family: "Nunito Sans", sans-serif;
      font-size: 20px;
      font-style: normal;
      font-weight: 400;
      line-height: 28px;
      letter-spacing: -0.38px;
      margin-bottom: 32px;
    }
    .result-bottom_btn {
      display: inline-flex;
      padding: 24px 48px;
      justify-content: center;
      align-items: center;
      gap: 24px;
      border-radius: 100px;
      background: var(--color-primary-white);
      backdrop-filter: blur(30px);
      border: none;
      text-decoration: none;
      color: var(--color-violet-main);
      font-family: "Nunito Sans", sans-serif;
      font-size: 20px;
      font-style: normal;
      font-weight: 600;
      line-height: 28px;
      letter-spacing: -0.38px;
      cursor: pointer;
    }
    .result-bottom_btn svg {
      width: 24px;
      height: 24px;
      flex-shrink: 0;
    }

    /* ─── PARTNERS ─── */
    .partners {
      padding: 80px 0;
      background: #F5F5F5;
      /* выходим за пределы page-wrapper на всю ширину вьюпорта */
      width: 100vw;
      margin-left: calc(50% - 50vw);
    }
    .partners-wrap {
      overflow: hidden;
    }
    .partners-track {
      display: flex;
      gap: 60px;
      align-items: center;
      animation: marquee 45s linear infinite;
      width: max-content;
    }
    .partner-logo {
      display: flex;
      align-items: center;
      flex-shrink: 0;
    }
    .partner-logo img {
      height: 40px;
      width: auto;
      display: block;
      object-fit: contain;
      transition: filter .2s;
    }
    @keyframes marquee {
      0% { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }

    /* ─── DEVELOPMENT ─── */
    .development {
      padding: 185px 60px 0;
      background: #F5F5F5;
      display: flex;
      align-items: flex-start;
      gap: 60px;
    }
    .development-left {
      flex: 1 1 0;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 0;
      padding-top: 8px;
      position: sticky;
      top: 23%;
      align-self: flex-start;
    }
    .development-left h2 {
      font-family: var(--font-onder);
      font-size: 28px;
      font-weight: 500;
      color: #4B0082;
      text-transform: uppercase;
      line-height: 58px;
      letter-spacing: 0.56px;
      margin: 0;
    }
    .development-left h2 em {
      font-family: var(--font-onder);
      font-size: 28px;
      font-weight: 500;
      font-style: normal;
      color: #9747FF;
      line-height: 58px;
      letter-spacing: 0.56px;
    }
    .dev-strela {
      margin-top: 16px;
      width: 374px;
      height: 322px;
      display: block;
      flex-shrink: 0;
    }
    .development-right {
      width: 608px;
      flex-shrink: 0;
      overflow: visible;
      position: relative;
    }
    .dev-carousel-track {
      display: flex;
      flex-direction: column;
      gap: 48px;
    }
    .dev-card {
      width: 608px;
      height: 460px;
      flex-shrink: 0;
      background: var(--white, #FFF);
      border-radius: 24px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      align-items: stretch;
      padding: 0;
      gap: 0;
      opacity: 0;
      transform: translateX(120px);
      transition: opacity 1.5s cubic-bezier(.65,.2,0,1), transform 1.5s cubic-bezier(.65,.2,0,1);
      will-change: opacity, transform;
    }
    .dev-card.is-visible {
      opacity: 1;
      transform: translateX(0);
    }
    .dev-card-video {
      position: relative;
      inset: auto;
      width: calc(100% - 32px);
      margin-left: 32px;
      /* height: 310px; */
      flex-shrink: 0;
      display: block;
      border-radius: 0 24px 0 24px;
      border: none;
      object-fit: cover;
    }
    .dev-card-cover {
      position: absolute;
      top: 0;
      right: 0;
      height: 330px;
      align-self: stretch;
      aspect-ratio: 192 / 149;
      border-radius: 0 24px;
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      cursor: pointer;
      z-index: 1;
      transition: opacity .3s;
      width: 96%;
    }
    .dev-card-cover.hidden { opacity: 0; pointer-events: none; }
    .dev-card-body {
      display: flex;
      flex-direction: column;
      gap: 0;
      flex-shrink: 0;
      padding: 20px 32px 28px;
    }
    .dev-card-body h4 {
      font-family: "Nunito Sans", sans-serif;
      font-size: 24px;
      font-weight: 600;
      color: #4B0082;
      line-height: 36px;
      letter-spacing: -0.456px;
      margin: 0;
    }
    .dev-card-body p {
      font-family: "Nunito Sans", sans-serif;
      font-size: 20px;
      font-weight: 400;
      color: #4B0082;
      line-height: 28px;
      letter-spacing: -1.9%;
      margin: 0;
    }
    .dev-card-tile {
      position: absolute;
      top: 32px;
      right: 32px;
      z-index: 2;
      display: flex;
      padding: 8px;
      justify-content: center;
      align-items: center;
      border-radius: 100px;
      border: 1px solid rgba(255, 255, 255, 0.70);
      background: rgba(15, 15, 15, 0.20);
      backdrop-filter: blur(30px);
      -webkit-backdrop-filter: blur(30px);
      cursor: pointer;
      z-index: 2;
      flex-shrink: 0;
    }
    .dev-card-tile:hover { background: rgba(15, 15, 15, 0.35); }

/* ─── EVENTS ─── */
    .events {
      padding: 100px 0;
      background: #F5F5F5;
    }
    .events-dots { display: none; }
    .events-header {
      display: flex;
      align-items: baseline;
      gap: 164px;
      margin-bottom: 32px;
    }
    .events-header h2 {
      font-family: var(--font-onder);
      font-size: 28px;
      font-weight: 500;
      color: #4B0082;
      text-transform: uppercase;
      line-height: 58px;
      letter-spacing: 0.56px;
      flex-shrink: 0;
      width: 460px;
      margin: 0;
    }
    .events-header p {
      font-family: "Nunito Sans", sans-serif;
      font-size: 20px;
      font-weight: 600;
      color: #4B0082;
      line-height: 28px;
      margin: 0;
      align-self: center;
    }
    .events-list {
      display: flex;
      gap: 16px;
      align-items: stretch;
    }
    .event-card {
      display: flex;
      flex-direction: column;
      gap: 8px;
      width: 456px;
      flex-shrink: 0;
    }
    .event-card-image {
      position: relative;
      border-radius: 32px;
      overflow: hidden;
      height: 312px;
      background: linear-gradient(135deg, #E1DDFC 0%, #9747FF 100%);
      flex-shrink: 0;
    }
    .event-join-btn {
      position: absolute;
      top: 230px;
      right: 0;
      display: flex;
      width: 81px;
      height: 81px;
      padding: 24px;
      justify-content: center;
      align-items: center;
      gap: 24px;
      border-radius: 100px;
      background: #9747FF;
      backdrop-filter: blur(30px);
      border: none;
      cursor: pointer;
      transition: opacity .2s;
      flex-shrink: 0;
    }
    .event-join-btn:hover { opacity: 0.85; }
    .event-join-btn svg {
      width: 24px;
      height: 24px;
      flex-shrink: 0;
      aspect-ratio: 1/1;
    }
    .event-card-info {
      background: #FFF;
      border-radius: 32px;
      padding: 24px;
      display: flex;
      flex-direction: column;
      gap: 16px;
      flex: 1;
    }
    .event-card-title {
      font-family: "Nunito Sans", sans-serif;
      font-size: 24px;
      font-weight: 600;
      color: #4B0082;
      line-height: 36px;
      margin: 0;
    }
    .event-chips {
      display: flex;
      gap: 10px;
      align-items: center;
      flex-wrap: wrap;
    }
    .event-chip {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 6px 12px 6px 8px;
      border-radius: 100px;
      background: #fff;
      font-family: "Montserrat", sans-serif;
      font-size: 12px;
      font-weight: 400;
      color: #3E1460;
      line-height: 1.33;
    }
    .event-chip svg { flex-shrink: 0; }
    .event-divider {
      width: 100%;
      height: 1px;
      background: #D7C9E2;
    }
    .event-meta {
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
    .event-meta-row {
      display: flex;
      align-items: baseline;
      gap: 6px;
      flex-wrap: wrap;
    }
    .event-meta-label {
      font-family: "Nunito Sans", sans-serif;
      font-size: 16px;
      font-weight: 400;
      color: #4B0082;
      opacity: 0.6;
      line-height: 24px;
    }
    .event-meta-value {
      font-family: "Nunito Sans", sans-serif;
      font-size: 20px;
      font-weight: 600;
      color: #4B0082;
      line-height: 28px;
    }
    .event-promo-card {
      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='456' height='500' viewBox='0 0 456 500' fill='none'%3E%3Cpath d='M0 0H228H345.5C358.755 0 369.5 10.7452 369.5 24V48.5846C369.5 72.8852 389.199 92.5846 413.5 92.5846H432C445.255 92.5846 456 103.33 456 116.585V136V272V394.051V500C456 524.301 436.301 544 412 544H369.5H228H0V0Z' fill='%239747FF'/%3E%3C/svg%3E") no-repeat center/cover;
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding: 32px;
      overflow: hidden;
      border-radius: 32px;
      max-width: 456px;
      width: 100%;
      flex-shrink: 0;
    }
    .event-promo-btn {
      position: absolute;
      top: 0;
      right: 0;
      width: 81px;
      height: 81px;
      border-radius: 100px;
      background: #E1DDFC;
      border: none;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: opacity .2s;
    }
    .event-promo-btn:hover { opacity: 0.85; }
    .event-promo-title {
      font-family: var(--font-onder);
      font-size: 16px;
      font-style: normal;
      font-weight: 500;
      color: #FFF;
      line-height: 32px;
      letter-spacing: 0.32px;
      margin: 0;
    }

    /* ─── PATH ─── */
    .path {
      background: #F5F5F5;
      padding-top: 24px;
    }
    .path-block {
      border-radius: 68px;
      background: var(--1t-3, #E1DDFC);
      padding: 100px;
      display: flex;
      flex-direction: column;
      position: relative;
      overflow: hidden;
    }
    .path-block::before {
      content: '';
      position: absolute;
      left: 50%;
      top: 40%;
      transform: translate(-50%, -50%);
      width: 1144px;
      height: 756px;
      background: radial-gradient(ellipse, rgba(151,71,255,0.18) 0%, transparent 70%);
      border-radius: 50%;
      pointer-events: none;
      z-index: 0;
    }

    .path-block_titles {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    .path-block_titles > .path-title {
      font-family: var(--font-onder);
      font-size: 28px;
      font-style: normal;
      font-weight: 500;
      color: #4B0082;
      text-align: center;
      line-height: 58px;
      letter-spacing: 0.56px;
      margin: 0;
      position: relative;
      z-index: 1;
      padding-bottom: 6px;
    }
    .path-block_titles > .path-title span .color {
      font-family: var(--font-onder);
      font-size: 28px;
      font-style: normal;
      font-weight: 500;
      color: #9747FF;
      line-height: 58px;
      letter-spacing: 0.56px;
      padding-left: 3px;
    }

    .path-block_titles > .path-subtitle {
      color: var(--1t-1, #4B0082);
      font-family: "Nunito Sans", sans-serif;
      font-size: 16px;
      font-style: normal;
      font-weight: 600;
      line-height: 36px; /* 225% */
      letter-spacing: -0.304px;
      padding-bottom: 32px;
    }
    .path-top-row {
      display: flex;
      justify-content: space-between;
      gap: 24px;
    }
    .path-col {
      display: flex;
      flex-direction: column;
      gap: 32px;
      width: 388px;
      flex-shrink: 0;
    }
    .path-role-badge {
      display: flex;
      padding: 12px 24px;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      border-radius: 68px;
      background: var(--1t-3, #E1DDFC);
    }
    .path-role-badge span {
      font-family: "Nunito Sans", sans-serif;
      font-size: 24px;
      font-weight: 600;
      color: #fff;
      line-height: 36px;
    }
    .path-role-badge.specialist {
      border-radius: 24px;
      background: var(--1t-2, #B3AEF3);
    }
    .path-role-badge.customer {
      background: linear-gradient(90deg, #733F89 0%, #221228 100%);
    }
    .path-steps {
      display: flex;
      flex-direction: column;
      align-items: center;

    }
    .path-step-item {
      display: flex;
      align-items: center;
      background: #F2F1FF;
      border-radius: 24px;
      background: var(--1t-5, #F2F1FF);
      display: flex;
      padding: 12px 24px;
      align-items: center;
      gap: 24px;
      align-self: stretch;
      height: 90px;
    }
    .path-step-num {
      font-family: var(--font-onder);
      font-size: 24px;
      font-weight: 500;
      line-height: 1;
      flex-shrink: 0;
      width: 28px;
      text-align: center;
    }
    .path-step-num.specialist-num { 
      display: flex;
      width: 64px;
      height: 56px;
      justify-content: center;
      align-items: center;
      gap: 10px;border-radius: 16px;
      background: var(--1t-2, #B3AEF3);
      box-shadow: 0 6px 15px 0 rgba(75, 0, 130, 0.15); 
    }
    .path-step-num.customer-num   { 
      border-radius: 16px;
      background: linear-gradient(270deg, #733F89 0%, #221228 100%);
      box-shadow: 0 6px 15px 0 rgba(75, 0, 130, 0.15); display: flex;
      width: 64px;
      height: 56px;
      justify-content: center;
      align-items: center;
      gap: 10px; 
    }
    .path-step-text {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }
    .path-step-dots {
      display: flex;
      width: 12px;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      flex-shrink: 0;
    }
    .path-step-label {
      color: var(--1t-1, #4B0082);
      font-family: "Nunito Sans", sans-serif;
      font-size: 16px;
      font-style: normal;
      font-weight: 700;
      line-height: 24px;
      letter-spacing: -0.304px;
    }
    .path-step-label2 {
      color: var(--1t-1, #4B0082);
      font-family: "Nunito Sans", sans-serif;
      font-size: 14px;
      font-style: normal;
      font-weight: 400;
      line-height: 20px; /* 142.857% */
      letter-spacing: -0.266px;
    }
    .path-arrows-row {
      display: flex;
      justify-content: space-between;
      padding: 0 194px;
      align-items: center;
    }
    .path-stages-wrap {
      display: flex;
      justify-content: center;
      align-self: flex-start;
      flex: 1;
      margin-top: 79px;
    }
    .path-stages {
      display: flex;
      flex-direction: column;
      gap: 0;
      width: 412px;
    }
    .path-stage {
      display: flex;
      padding: 12px 24px;
      align-items: center;
      gap: 16px;
      align-self: stretch;
      border-radius: 24px;
      background: linear-gradient(90deg, #4B0082 -33.73%, #B3AEF3 108.63%);
;
    }
    .path-stage-icon {
      display: flex;
      width: 64px;
      height: 56px;
      flex-shrink: 0;
      justify-content: center;
      align-items: center;
      gap: 10px;
      border-radius: 16px;
      background: var(--white, #FFF);
      box-shadow: 0 6px 15px 0 rgba(75, 0, 130, 0.15);
    }
    .path-stage-text {
      display: flex;
      flex-direction: column;
      gap: 4px;
    }
    .path-stage-title {
      font-family: "Nunito Sans", sans-serif;
      color: var(--white, #FFF);
      font-size: 16px;
      font-style: normal;
      font-weight: 700;
      line-height: 24px; /* 150% */
      letter-spacing: -0.304px;
    }
    .path-stage-desc {
      font-family: "Nunito Sans", sans-serif;
      color: #fff;
      font-size: 14px;
      font-style: normal;
      font-weight: 400;
      line-height: 20px; /* 142.857% */
      letter-spacing: -0.266px;
    }
    .path-stage-connector {
      width: 14px;
      height: 32px;
      margin: 0 auto;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .path-stage-connector svg { display: block; }

    .path-stage-dots {
      display: block;
      width: 12px;
      margin: 0 auto;
    }

    /* ─── COOPERATION ─── */
    .cooperation {
      padding: 16px 0;
      background: #F5F5F5;
    }
    .coop-block {
      background: linear-gradient(90deg, #4B0082 -33.73%, #B3AEF3 108.63%);
      border-radius: 64px;
      padding: 60px 100px;
      position: relative;
      overflow: hidden;
      isolation: isolate;
      display: flex;
      flex-direction: column;
      gap: 40px;
      /* Safari: overflow-клип с border-radius слетает из-за backdrop-filter
         дочерних .coop-stripe / mix-blend-mode у .glow-spot. */
      -webkit-mask-image: -webkit-radial-gradient(white, black);
      mask-image: radial-gradient(white, black);
    }
    .coop-stripes {
      position: absolute;
      inset: 0;
      display: flex;
      gap: 0;
      pointer-events: none;
      z-index: 0;
    }
    .coop-stripe {
      width: 66.7px;
      flex-shrink: 0;
      background: linear-gradient(270deg, rgba(255,255,255,0.01) 0%, rgba(0,0,0,0.05) 39.4%, rgba(255,255,255,0.01) 100%);
      background-blend-mode: overlay;
      backdrop-filter: blur(90px);
      -webkit-backdrop-filter: blur(90px);
    }
    .coop-content {
      position: relative;
      z-index: 2;
      display: flex;
      flex-direction: column;
      gap: 40px;
    }
    .coop-header { display: flex; flex-direction: column; gap: 16px; }
    .coop-header h2 {
      font-family: var(--font-onder);
      font-size: 28px;
      font-weight: 500;
      color: #fff;
      line-height: 58px;
      letter-spacing: 0.56px;
      text-transform: uppercase;
      margin: 0;
    }
    .coop-header p {
      font-family: "Nunito Sans", sans-serif;
      font-size: 20px;
      font-weight: 400;
      color: #fff;
      line-height: 28px;
      margin: 0;
    }
    .coop-form {
      display: flex;
      gap: 24px;
      align-items: flex-start;
    }
    .coop-field {
      flex: 1;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }
    .coop-error {
      font-family: "Nunito Sans", sans-serif;
      font-size: 13px;
      color: rgba(255, 160, 160, 1);
      min-height: 18px;
      padding: 0 4px;
    }
    .coop-field.has-error > .coop-input {
      outline: 2px solid rgba(255, 100, 100, 0.85);
      outline-offset: -2px;
    }
    .coop-field.has-error .coop-phone-code-btn,
    .coop-field.has-error .coop-phone-input {
      outline: 2px solid rgba(255, 100, 100, 0.85);
      outline-offset: -2px;
    }
    .coop-phone-row {
      display: flex;
      gap: 0;
      position: relative;
    }
    .coop-phone-code-btn {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 32px 20px;
      background: rgba(255,255,255,0.2);
      border: none;
      border-radius: 16px 0 0 16px;
      color: #fff;
      font-family: "Nunito Sans", sans-serif;
      font-size: 20px;
      cursor: pointer;
      white-space: nowrap;
      flex-shrink: 0;
      transition: background .2s;
    }
    .coop-phone-code-btn:hover { background: rgba(255,255,255,0.28); }
    .coop-phone-input {
      border-radius: 0 16px 16px 0 !important;
    }
    .coop-phone-dropdown {
      position: fixed;
      background: #fff;
      border-radius: 16px;
      box-shadow: 0 8px 32px rgba(75, 0, 130, 0.2);
      z-index: 500;
      min-width: 260px;
      max-height: 280px;
      overflow-y: auto;
      padding: 8px;
      scrollbar-width: thin;
      scrollbar-color: #b3aef3 transparent;
    }
    .coop-phone-dropdown::-webkit-scrollbar { width: 4px; }
    .coop-phone-dropdown::-webkit-scrollbar-track { background: transparent; }
    .coop-phone-dropdown::-webkit-scrollbar-thumb { background: #b3aef3; border-radius: 4px; }
    .coop-success {
      font-family: "Nunito Sans", sans-serif;
      font-size: 22px;
      font-weight: 600;
      color: #fff;
      line-height: 1.6;
    }
    .coop-input {
      flex: 1;
      padding: 32px;
      background: rgba(255,255,255,0.2);
      border: none;
      border-radius: 16px;
      font-family: "Nunito Sans", sans-serif;
      font-size: 20px;
      font-weight: 400;
      color: #fff;
      line-height: 28px;
      outline: none;
      transition: background .2s;
    }
    .coop-input::placeholder { color: rgba(255,255,255,0.6); }
    .coop-input:focus { background: rgba(255,255,255,0.28); }
    /* ─── 404 ─── */
    .nf404 {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      padding: 80px 20px 120px;
    }
    .nf404-img {
      width: 100%;
      max-width: 700px;
      height: auto;
      display: block;
      margin-bottom: 24px;
    }
    .nf404-title {
      width: 100%;
      font-family: var(--font-onder);
      font-size: 24px;
      font-weight: 500;
      line-height: 54px;
      letter-spacing: 0.48px;
      text-align: center;
      text-transform: uppercase;
      color: #4B0082;
      margin-bottom: 16px;
    }
    .nf404-subtitle {
      width: 100%;
      font-family: var(--font-nunito-sans);
      font-size: 16px;
      font-weight: 400;
      line-height: 20px;
      letter-spacing: -0.304px;
      text-align: center;
      color: #4B0082;
      margin-bottom: 40px;
    }
    .nf404-btns {
      display: flex;
      align-items: center;
      gap: 16px;
    }
    .nf404-btn {
      padding: 20px 32px;
      font-size: 16px;
    }
    .nf404-btns .btn-outline-white {
      background: var(--bg-white, #FFFFFF);
      color: #4B0082;
    }
    @media (max-width: 610px) {
      .nf404-title { font-size: 16px; line-height: 1.4; }
      .nf404-subtitle { margin-bottom: 28px; }
      .nf404-btns { flex-direction: column; width: 100%; }
      .nf404-btn { width: 100%; }
    }

    /* ─── FOOTER ─── */
    .footer {
      background: #F5F5F5;
      margin-bottom: 12px;
    }
    .footer-block {
      background: #fff;
      border-radius: 64px;
      padding: 60px 100px;
      position: relative;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      gap: 64px;
    }
    .footer-main-row {
      display: flex;
      align-items: flex-start;
      gap: 40px;
      position: relative;
      z-index: 1;
      justify-content: space-between;
    }
    .footer-nav {
      display: flex;
      gap: 40px;
      flex: 0 0 481px;
    }
    .footer-nav-col {
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
    .footer-nav-col a {
      font-family: "Montserrat", sans-serif;
      font-size: 16px;
      font-weight: 400;
      color: #4B0082;
      text-decoration: none;
      line-height: 24px;
      transition: opacity .2s;
    }
    .footer-nav-col a:hover { opacity: 0.7; }
    .footer-contact {
      display: flex;
      flex-direction: column;
      gap: 8px;
      flex: 0 0 312px;
    }
    .footer-phone {
      font-family: "Nunito Sans", sans-serif;
      font-size: 26px;
      font-weight: 700;
      color: #4B0082;
      text-decoration: none;
      line-height: 36px;
      display: block;
    }
    .footer-email {
      font-family: "Montserrat", sans-serif;
      font-size: 16px;
      font-weight: 400;
      color: #4B0082;
      text-decoration: none;
      line-height: 24px;
    }
    .footer-socials {
      display: flex;
      gap: 16px;
      align-items: center;
      flex: 0 0 240px;
    }
    .footer-social-btn {
      width: 48px;
      height: 48px;
      border-radius: 100px;
      background: #4B0082;
      border: none;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: opacity .2s;
    }
    .footer-social-btn:hover { opacity: 0.8; }
    .footer-social-btn svg,
    .footer-social-btn img { width: 24px; height: 24px; display: block; filter: brightness(0) invert(1); }
    .footer-bottom-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      position: relative;
      z-index: 1;
    }
    .footer-bg-cells {
      display: none;
      position: absolute;
      left: -20px;
      right: -20px;
      bottom: -20px;
      height: 260px;
      display: none;
      grid-template-columns: repeat(8, 135px);
      grid-template-rows: repeat(2, 120px);
      gap: 26px;
      z-index: 0;
      pointer-events: none;
    }
    .footer-bg-cell {
      width: 120px;
      height: 120px;
      border-radius: 16px;
      border: 1px solid rgba(223, 184, 255, 0.70);
      background: rgba(223, 184, 255, 0.01);
      backdrop-filter: blur(30px);
      -webkit-backdrop-filter: blur(30px);
      margin-left: -26px;
    }
    /* скрытые ячейки */
    .footer-bg-cell:nth-child(2),
    .footer-bg-cell:nth-child(3),
    .footer-bg-cell:nth-child(4),
    .footer-bg-cell:nth-child(5),
    .footer-bg-cell:nth-child(7),
    .footer-bg-cell:nth-child(8),
    .footer-bg-cell:nth-child(6),
    /* .footer-bg-cell:nth-child(12), */
    .footer-bg-cell:nth-child(13),
    /* .footer-bg-cell:nth-child(14), */
    .footer-bg-cell:nth-child(15) {
      visibility: hidden;
    }
    .footer-legal {
      display: flex;
      gap: 12px;
      align-items: center;
    }
    .footer-legal a {
      font-family: "Montserrat", sans-serif;
      font-size: 16px;
      font-weight: 500;
      color: #4B0082;
      line-height: 24px;
      transition: opacity .2s;
    }
    .footer-legal a:hover { opacity: 0.7; }
    .footer-copy {
      font-family: "Montserrat", sans-serif;
      font-size: 16px;
      font-weight: 600;
      color: #4B0082;
      line-height: 24px;
    }

    /* ─── GLOW CURSOR ─── */
    .glow-spot {
      position: absolute;
      width: 393px;
      height: 542px;
      border-radius: 542px;
      background: radial-gradient(50% 50% at 50% 50%, #4B0082 4.33%, #B3AEF3 72.12%);
      transform: translate(-50%, -50%) rotate(-33.01deg);
      pointer-events: none;
      opacity: 0;
      mix-blend-mode: screen;
      filter: blur(70px);
      transition: opacity 0.3s ease;
      z-index: 0;
      will-change: left, top, transform;
      /* Собственный композитный слой: без него на маскированном (mask-image)
         родителе Safari не перерисовывает предыдущий кадр целиком и пятно
         оставляет «следы» при движении. */
      -webkit-transform: translate(-50%, -50%) rotate(-33.01deg) translateZ(0);
      transform: translate(-50%, -50%) rotate(-33.01deg) translateZ(0);
    }
    .glow-spot.active { opacity: 0.40; }
    .hero .glow-spot {
      background: radial-gradient(50% 50% at 50% 50%, #4B0082 4.33%, #B3AEF3 72.12%);
    }.cust-hero .glow-spot,
.cust-form .glow-spot {
      background: radial-gradient(50% 50% at 50% 50%, #CDB154 4.33%, #462D4B 72.12%);
    }
    .jr-hero .glow-spot {
      background: radial-gradient(50% 50% at 50% 50%, #4B0082 4.33%, #B3AEF3 72.12%);
    }
    .md-hero .glow-spot {
      background: radial-gradient(50% 50% at 50% 50%, #4B0082 4.33%, #B3AEF3 72.12%);
    }

    /* ─── UTILS ─── */
    .container { max-width: 1200px; margin: 0 auto; }
    .text-center { text-align: center; }
    .mt-8 { margin-top: 32px; }
    .clearfix::after { content: ''; display: table; clear: both; }

    /* ─── RESPONSIVE ─── */


    /* ─── MODAL ─── */
    .modal-overlay {
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.45);
      z-index: 1000;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 16px;
      opacity: 0;
      pointer-events: none;
      transition: opacity .25s;
    }
    .modal-wrapper {
      display: flex;
      align-items: flex-start;
      gap: 24px;
    }
    .modal-overlay.is-open {
      opacity: 1;
      pointer-events: auto;
    }
    .modal {
      display: flex;
      padding: 60px;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 48px;
      border-radius: 64px;
      background: var(--1t-3, #E1DDFC);
      width: 100%;
      max-width: 1000px;
      position: relative;
      overflow: hidden;
      transform: translateY(24px);
      transition: transform .25s;
    }
    .modal-overlay.is-open .modal { transform: translateY(0); }

    /* Стеклянные полосы */
    .modal-stripes {
      position: absolute;
      inset: 0;
      display: flex;
      pointer-events: none;
      z-index: 0;
    }
    .modal-stripe {
      flex: 1;
      background: linear-gradient(270deg, rgba(255, 255, 255, 0.01) 0%, rgba(0, 0, 0, 0.05) 39.4%, rgba(255, 255, 255, 0.01) 100%);
      background-blend-mode: overlay;
      backdrop-filter: blur(90px);
      -webkit-backdrop-filter: blur(90px);
    }
    .modal-stripe:first-child,
    .modal-stripe:last-child {
      opacity: 0;
    }

    .modal-title {
      font-family: 'Onder', sans-serif;
      font-size: 28px;
      font-style: normal;
      font-weight: 500;
      color: var(--1t-1, #4B0082);
      text-align: center;
      line-height: 58px;
      letter-spacing: 0.56px;
      text-transform: uppercase;
      white-space: nowrap;
      margin: 0;
      position: relative;
      z-index: 1;
    }
    .modal-title em {
      font-family: 'Onder', sans-serif;
      font-size: 28px;
      font-style: normal;
      font-weight: 500;
      color: var(--tex-violet, #9747FF);
      line-height: 58px;
      letter-spacing: 0.56px;
    }
    .modal-subtitle {
      font-family: "Nunito Sans", sans-serif;
      font-size: 20px;
      font-style: normal;
      font-weight: 400;
      color: var(--1t-1, #4B0082);
      text-align: center;
      line-height: 28px;
      letter-spacing: -0.38px;
      margin: -32px 0 0;
      position: relative;
      z-index: 1;
    }
    .modal-form {
      display: flex;
      flex-direction: column;
      gap: 20px;
      width: 100%;
      position: relative;
      z-index: 1;
    }
    .modal-inputs-row {
      display: flex;
      gap: 16px;
    }
    .modal-field {
      display: flex;
      flex-direction: column;
      gap: 4px;
      flex: 1;
    }
    .modal-field--phone { flex: 1; position: relative; z-index: 10; }
    .modal-form .field::placeholder { color: var(--color-violet-main); opacity: 0.5; }
    .modal-form .field:focus { background: rgba(255, 255, 255, 0.6); }
    .modal-field.has-error .field { outline: 2px solid #E53E3E; }
    .modal-error {
      font-family: var(--font-nunito-sans);
      font-size: 12px;
      color: #E53E3E;
      min-height: 14px;
    }
    .modal-phone-row {
      display: flex;
      align-items: center;
      position: relative;
      width: 398px;
      max-width: 100%;
      height: 76px;
      box-sizing: border-box;
      background: rgba(255, 255, 255, 0.30);
      backdrop-filter: blur(18.53px);
      -webkit-backdrop-filter: blur(18.53px);
      border-radius: 16px;
      padding: 0 16px 0 0;
    }
    .modal-phone-code-btn {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 24px 16px;
      border: none;
      border-right: 1px solid rgba(75,0,130,0.15);
      border-radius: 0;
      background: transparent;
      cursor: pointer;
      font-family: var(--font-nunito-sans);
      font-size: 16px;
      color: #4B0082;
      white-space: nowrap;
      flex-shrink: 0;
      transition: background .2s;
    }
    .modal-phone-code-btn:hover { background: rgba(255,255,255,0.2); }
    .modal-phone-input {
      flex: 1;
      min-width: 0;
      width: auto;
      background: transparent;
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
      border-radius: 0;
      padding-left: 16px;
    }
    /* Крестик вне попапа */
    .modal-close {
      display: flex;
      padding: 16px;
      justify-content: center;
      align-items: center;
      gap: 24px;
      border-radius: 100px;
      background: var(--white, #FFF);
      backdrop-filter: blur(30px);
      -webkit-backdrop-filter: blur(30px);
      border: none;
      cursor: pointer;
      flex-shrink: 0;
      transition: box-shadow .2s;
    }
    .modal-close:hover { box-shadow: 0 4px 16px rgba(75,0,130,0.2); }
    .modal-phone-dropdown {
      position: absolute;
      top: calc(100% + 6px);
      left: 0;
      background: #fff;
      border: 1.5px solid #E0D8F5;
      border-radius: 16px;
      box-shadow: 0 8px 32px rgba(0,0,0,0.12);
      z-index: 1000;
      max-height: 240px;
      overflow-y: auto;
      min-width: 280px;
      scrollbar-width: thin;
      scrollbar-color: #C4BDEF transparent;
    }
    .modal-phone-dropdown::-webkit-scrollbar {
      width: 4px;
    }
    .modal-phone-dropdown::-webkit-scrollbar-track {
      background: transparent;
    }
    .modal-phone-dropdown::-webkit-scrollbar-thumb {
      background: #C4BDEF;
      border-radius: 4px;
    }
    .modal-phone-dropdown::-webkit-scrollbar-thumb:hover {
      background: #B3AEF3;
    }
    .phone-dropdown-item {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 10px 16px;
      background: none;
      border: none;
      cursor: pointer;
      width: 100%;
      text-align: left;
      font-family: var(--font-nunito-sans);
      font-size: 14px;
      color: #1E1E28;
      transition: background .15s;
    }
    .phone-dropdown-item:hover { background: #F5F0FF; }
    .phone-dropdown-flag { font-size: 18px; line-height: 1; }
    .flag-icon { display: inline-block; width: 20px; height: 15px; object-fit: cover; border-radius: 2px; vertical-align: middle; }
    .phone-dropdown-dial { color: #9747FF; font-weight: 600; min-width: 48px; }
    .phone-dropdown-name { color: #666; }
    .modal-submit {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      border: none;
      border-radius: 100px;
      background: #fff;
      color: #4B0082;
      font-family: var(--font-nunito-sans);
      font-size: 20px;
      font-weight: 600;
      padding: 24px;
      width: 100%;
      cursor: pointer;
      transition: box-shadow .2s;
    }
    .modal-submit svg { flex-shrink: 0; }
    .modal-submit:hover:not(:disabled) { box-shadow: 0 6px 24px rgba(75,0,130,0.18); }
    .modal-submit:disabled {
      background: #fff;
      color: rgba(75,0,130,0.4);
      cursor: not-allowed;
    }
    .modal-submit:disabled svg { opacity: 0.4; }

    /* ─── SUCCESS TOAST ─── */
    .success-toast {
      position: fixed;
      top: 24px;
      left: 50%;
      transform: translateX(-50%) translateY(-120px);
      z-index: 2000;
      display: inline-flex;
      padding: 16px 32px;
      align-items: center;
      gap: 24px;
      background: #fff;
      border-radius: 20px;
      box-shadow: 0 8px 40px rgba(75, 0, 130, 0.15);
      opacity: 0;
      transition: transform 0.4s cubic-bezier(0.34,1.56,0.64,1), opacity 0.3s ease;
      pointer-events: none;
    }
    .success-toast.is-visible {
      transform: translateX(-50%) translateY(0);
      opacity: 1;
    }
    .success-toast__title {
      font-family: "Nunito Sans", sans-serif;
      font-size: 24px;
      font-style: normal;
      font-weight: 700;
      color: var(--1t-1, #4B0082);
      line-height: 36px;
      letter-spacing: -0.456px;
      margin: 0 0 4px;
    }
    .success-toast__sub {
      font-family: "Nunito Sans", sans-serif;
      font-size: 20px;
      font-style: normal;
      font-weight: 400;
      color: var(--1t-1, #4B0082);
      line-height: 28px;
      letter-spacing: -0.38px;
      margin: 0;
    }


/* ═══════════════════════════════════════════
   CUSTOMERS PAGE
   ═══════════════════════════════════════════ */

.cust-wrap {
  position: relative;
  border-radius: 64px;
  overflow: hidden;
  background: linear-gradient(90deg, #2E1D5D 0%, #221227 99.01%);
}

/* ── Hero ── */
.cust-hero {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  min-height: 420px;
  padding: 60px 60px 80px 60px;
  overflow: visible;
  background: linear-gradient(135deg, #0F0421 0%, #3E1460 55%, #581C87 100%);
}

.cust-hero-stripes {
  position: absolute;
  inset: 0;
  display: flex;
  gap: 0;
  pointer-events: none;
  z-index: 3;
}

.cust-hero-stripe {
  width: 66.7px;
  flex-shrink: 0;
  background: linear-gradient(270deg, rgba(255, 255, 255, 0.01) 0%, rgba(0, 0, 0, 0.05) 39.4%, rgba(255, 255, 255, 0.01) 100%);
  background-blend-mode: overlay;
  backdrop-filter: blur(90px);
  -webkit-backdrop-filter: blur(90px);
}

.cust-hero-content {
  position: relative;
  z-index: 6;
  max-width: 53%;
  display: flex;
  flex-direction: column;
  /* gap: 20px; */
}

.hero-title-br { display: none; }

.cust-hero-title {
  font-family: 'Onder', sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 500;
  line-height: 64px;
  letter-spacing: 0.64px;
  color: #FFF;
  text-shadow: 0 4px 53.7px rgba(97, 70, 94, 0.10);
  margin: 0;
  white-space: nowrap;
  padding-bottom: 16px;
}

.cust-hero-subtitle {
  font-family: "Nunito Sans", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
  letter-spacing: -0.38px;
  color: #FFF;
  text-shadow: 0 4px 53.7px #61465E;
  margin: 0;
  padding-bottom: 48px;
}

.cust-hero-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 18px 36px;
  border-radius: 100px;
  background: var(--color-primary-white);
  color: var(--color-violet-main);
  font-family: var(--font-nunito-sans, 'Nunito Sans', sans-serif);
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-decoration: none;
  width: fit-content;
  margin-top: 16px;
  transition: opacity 0.2s;
}

.cust-hero-btn:hover { opacity: 0.88; }

.cust-hero-btn span {
  font-size: 18px;
}

.cust-hero-photo {
  position: absolute;
  top: 20px;
  left: 727px;
  width: 546px;
  height: 643px;
  z-index: 5;
  pointer-events: none;
  opacity: 1;
}


.cust-hero-photo-bg {
  position: absolute;
  right: -69px;
  bottom: 0;
  height: 109%;
  width: auto;
  object-fit: contain;
  object-position: bottom;
  display: block;
  z-index: 4;
  /* Отключаем hover-иконку «поиск по картинке» в Яндекс.Браузере —
     фото чисто декоративное, кликов/наведений не требует. */
  pointer-events: none;
}

.cust-hero-photo-fg {
  width: 100%;
  height: 84%;
  object-fit: contain;
  object-position: bottom;
  display: block;
  pointer-events: none;
}

/* ── Stats ── */
.cust-stats {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 80px;
  padding: 116px 80px 60px;
  background: transparent;
  overflow: visible;
}

.cust-stat-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: center;
  opacity: 0;
  overflow: visible;
}

.cust-stat-number {
  font-family: var(--font-onder);
  font-size: 64px;
  font-weight: 500;
  line-height: 1.3;
  padding: 4px 0;
  display: flex;
  align-items: baseline;
  gap: 0;
  letter-spacing: 0.64px;
  white-space: nowrap;
}

.cust-stat-item:nth-child(1) .cust-stat-number {
  padding-top: 20px;
}

.cust-stat-number--gradient {
  background: linear-gradient(180deg, #221228 0%, #733F89 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.cust-stat-number--dark {
  color: #393939;
  font-family: Onder;
  font-size: 32px;
  font-style: normal;
  font-weight: 500;
  line-height: 64px;
  letter-spacing: 0.64px;
}

.cust-stat-number .cust-counter {
  display: inline-block;
}

.cust-stat-plus {
  display: inline-block;
}

.cust-stat-label {
  font-family: "Nunito Sans", var(--font-nunito-sans), sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: #4B0082;
  line-height: 28px;
  letter-spacing: -0.38px;
  margin-top: 12px;
  max-width: 200px;
  text-align: left;
}

.cust-stat-label_2, .cust-stat-label_3 {
  color:black
}

.cust-stat-label_3 {
  white-space: nowrap;
}
/* ── Features ── */
.cust-features {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border: 1px solid rgba(255, 255, 255, 0.40);
  background: rgba(66, 48, 80, 0.20);
  backdrop-filter: blur(30px);
  margin-top: -40px;
}

.cust-feature {
  height: 180px;
  padding: 32px 28px;
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 8px;
  box-sizing: border-box;
}

.cust-feature:last-child { border-right: none; }

.cust-feature-icon {
  margin-bottom: 4px;
  opacity: 0.9;
}

.cust-feature-title {
  font-family: var(--font-nunito-sans, 'Nunito Sans', sans-serif);
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -0.38px;
  color: #fff;
  text-align: center;
  margin: 0;
}

.cust-feature-desc {
  font-family: var(--font-nunito-sans, 'Nunito Sans', sans-serif);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: -0.304px;
  color: #7C68A6;
  text-align: center;
  margin: 0;
}

/* ── Partners ── */
.cust-partners {
  position: relative;
  z-index: 2;
  overflow: hidden;
  padding-left: 26px;
  padding-right: 26px;
  padding-bottom: 24px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(0, 0, 0, 0.2);
}

.cust-partners-track {
  display: flex;
  align-items: center;
  gap: 60px;
  width: max-content;
  animation: partners-scroll 24s linear infinite;
}

@keyframes partners-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.cust-partner-logo {
  height: 28px;
  width: auto;
  object-fit: contain;
  filter: brightness(0) invert(1);
  opacity: 0.7;
  transition: opacity 0.2s;
}

.cust-partner-logo:hover { opacity: 1; }

/* ── Process Carousel ── */
.cust-proc-wrapper {
  position: relative;
  margin-top: 100px;
}

.cust-proc {
  display: flex;
  align-items: center;
  background: #F5F5F5;
  gap: 0;
  overflow: visible;
  position: sticky;
  top: 0;
  padding: 48px 0;
}

.cust-proc-photo-outer {
  position: relative;
  width: 560px;
  height: 700px;
  flex-shrink: 0;
  align-self: center;
  z-index: 2;
}

.cust-proc-carousel {
  width: 100%;
  height: 100%;
  border-radius: 64px;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.cp-slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  opacity: 0;
  transition: opacity 0.6s ease;
}

.cp-slide.active { opacity: 1; }

.cust-proc[data-slide="2"] .cp-slide {
  right: -8px;
}

.cust-proc-content {
  flex: 1 1 0;
  min-width: 0;
  background: #2e1d5c;
  border-radius: 64px;
  height: 628px;
  align-self: center;
  position: relative;
  z-index: 1;
  margin-left: 0;
  margin-top: 69px;
  overflow: hidden;
  /* Safari: overflow-клип с border-radius слетает из-за backdrop-filter
     дочерних .cust-proc-stripe / mix-blend-mode у .glow-spot. Сплошная
     непрозрачная mask ничего не меняет визуально, но заставляет Safari
     рендерить через маскирующий слой, где border-radius клип снова работает.
     (radial-gradient(white, black) — это НЕ сплошная маска, а настоящий
     радиальный градиент прозрачности, из-за которого края становились
     прозрачными и всё равно без скругления.) */
  -webkit-mask-image: -webkit-radial-gradient(#000, #000);
  mask-image: radial-gradient(#000, #000);
}

.cust-proc[data-slide="1"] .cust-proc-content {
  height: 608px;
  margin-top: 98px;
}

.cust-proc[data-slide="2"] .cust-proc-content {
  height: 599px;
  margin-top: 99px;
}

/* Glass stripes inside content panel */
/* Decorative glow ellipse */
.cust-proc-content::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 700px;
  height: 700px;
  background: radial-gradient(ellipse, rgba(180,120,230,0.30) 0%, rgba(115,63,137,0.15) 40%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

/* Glass stripes — аналог .cust-hero-stripe */
.cust-proc-stripes {
  position: absolute;
  inset: 0;
  display: flex;
  gap: 0;
  pointer-events: none;
  z-index: 1;
}

.cust-proc-stripe {
  width: 66.7px;
  flex-shrink: 0;
  background: linear-gradient(270deg, rgba(255,255,255,0.01) 0%, rgba(0,0,0,0.05) 39.4%, rgba(255,255,255,0.01) 100%);
  background-blend-mode: overlay;
  backdrop-filter: blur(90px);
  -webkit-backdrop-filter: blur(90px);
}

.cust-proc-content .glow-spot {
  background: radial-gradient(50% 50% at 50% 50%, #CDB154 4.33%, #462D4B 72.12%);
}

/* Slide text — аналог .sp-unit из SPECIALISTS */
.cp-text {
  position: absolute;
  inset: 0;
  padding: 80px 80px 80px 100px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 20px;
  width: 100%;
  box-sizing: border-box;
  opacity: 0;
  transform: translateY(72px);
  transition: transform 1.0s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              opacity   0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  z-index: 2;
}

.cp-text.active {
  opacity: 1;
  transform: translateY(0);
}

.cp-text.slide-exit-up {
  opacity: 0;
  transform: translateY(-48px);
  transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              opacity   0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.cp-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-style: normal;
  font-weight: 500;
  color: #fff;
  line-height: 58px;
  letter-spacing: 0.56px;
  text-transform: uppercase;
  margin: 0 0 12px;
}

.cp-gold {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-style: normal;
  font-weight: 500;
  line-height: 58px;
  letter-spacing: 0.56px;
  color: #FFCA70;
}

.cp-row {
  font-family: "Nunito Sans", sans-serif;
  font-size: 24px;
  font-weight: 600;
  color: #fff;
  line-height: 36px;
  letter-spacing: -0.456px;
  margin: 0;
}

.cp-row u {
  color: #fff;
  font-family: "Nunito Sans", sans-serif;
  font-size: 24px;
  font-weight: 600;
  line-height: 36px;
  letter-spacing: -0.456px;
  text-decoration: none;
}

.cp-who {
  font-family: 'Onder', sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 32px;
  letter-spacing: 0.32px;
  color: #FFCA70;
}

.cp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  /* margin-top: 16px; */
  padding: 24px 48px;
  border-radius: 100px;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(60px);
  -webkit-backdrop-filter: blur(60px);
  border: none;
  color: #fff;
  font-family: "Nunito Sans", sans-serif;
  font-size: 18px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.2s;
}
.mt_over  {
  margin-top: -17% !important;
}
.cp-btn:hover { background: rgba(15, 15, 15, 0.35); }

.cp-pagination {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  position: absolute;
  right: 28px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
}

.cp-dot { cursor: pointer; flex-shrink: 0; }

.cp-dot .cp-dot-ring  { stroke: rgba(255,255,255,0.3); stroke-width: 2; }
.cp-dot .cp-dot-inner { fill: rgba(255,255,255,0.3); }
.cp-dot .cp-dot-arc   { stroke: #fff; stroke-width: 2; stroke-dashoffset: 94.25; }

/* Кольцо-трек остаётся полупрозрачным, иначе дуга того же цвета на нём не видна */
.cp-dot.active .cp-dot-arc { stroke-dashoffset: 94.25; }
.cp-dot.active .cp-dot-ring  { stroke: rgba(255,255,255,0.3); stroke-width: 2; }
.cp-dot.active .cp-dot-inner { fill: #fff; }

.cp-dot.visited .cp-dot-ring  { stroke: #fff; stroke-width: 2; }
.cp-dot.visited .cp-dot-inner { fill: #fff; }
.cp-dot.visited .cp-dot-arc   { stroke-dashoffset: 0; transition: none; }

/* ── Result dark variant (for_customers) ── */
.result--dark {
  background: linear-gradient(270deg, #733F89 0%, #221228 100%) !important;
  border-radius: 68px !important;
  /* Safari: с более тяжёлым набором вложенных backdrop-filter (карточка, табы,
     полосы) базового mask-image на .result недостаточно — держим слой
     скомпонованным заранее. */
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.result--dark .result-card {
  border-radius: 32px;
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  /* собственный слой, чтобы его backdrop-filter не ломал клип родителя в Safari */
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.result--dark .result-card-review {
  background: #211640;
  border-radius: 26px;
}

.result--dark .tab-btn.active {
  background: #211640;
}

.result-header-gold {
  color: #FFCA70;
  padding-left: 3px;
}

/* ── Moderator block ── */
.cust-moderator {
  padding: 100px 100px 120px;
  background: #F5F5F5;
}

.cust-mod-text {
  text-align: center;
  margin-bottom: 60px;
}

.cust-mod-title {
  font-family: Onder, sans-serif;
  font-size: 28px;
  font-style: normal;
  font-weight: 500;
  line-height: 58px;
  letter-spacing: 0.56px;
  text-transform: uppercase;
  text-align: center;
  color: #393939;
  margin: 0 0 20px;
}

.cust-mod-title-gold {
  font-family: Onder, sans-serif;
  font-size: 28px;
  font-style: normal;
  font-weight: 500;
  line-height: 58px;
  letter-spacing: 0.56px;
  color: #FFCA70;
}

.cust-mod-subtitle {
  font-family: "Nunito Sans", sans-serif;
  font-size: 20px;
  font-weight: 400;
  color: #393939;
  line-height: 1.5;
  margin: 0;
}

.cust-mod-visual {
  position: relative;
  max-width: 800px;
  margin: 0 auto;
  height: 560px;
}

.cust-mod-photo {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  object-fit: contain;
  object-position: bottom center;
  z-index: 1;
}

.cust-mod-name {
  position: absolute;
  top: 196px;
  right: 90px;
  background: #fff;
  border-radius: 100px;
  padding: 12px 24px;
  font-family: "Nunito Sans", sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #1E1E28;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  z-index: 2;
}

.cust-mod-bubble {
  position: absolute;
  bottom: 120px;
  left: -50px;
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 2px;
  padding: 24px;
  border-radius: 32px 32px 8px 32px;
  background: #FFCA70;
  box-shadow: -4px -4px 35px 0 rgba(169, 151, 255, 0.10), 4px 4px 35px 0 rgba(169, 151, 255, 0.10);
  font-family: "Nunito Sans", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  color: #393939;
  line-height: 28px;
  letter-spacing: -0.38px;
  z-index: 2;
}

.cust-mod-contact {
  position: absolute;
  bottom: 60px;
  right: -35px;
  background: #fff;
  border-radius: 20px;
  padding: 24px 28px;
  min-width: 260px;
  box-shadow: 0 4px 24px rgba(0,0,0,0.08);
  z-index: 2;
}

.cust-mod-contact-title {
  font-family: "Nunito Sans", sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #1E1E28;
  margin: 0 0 16px;
}

.cust-mod-contact-label {
  font-family: "Nunito Sans", sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: #888;
  margin: 0 0 4px;
}

.cust-mod-contact-value {
  font-family: "Nunito Sans", sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #1E1E28;
  margin: 0 0 12px;
}

.cust-mod-contact-value:last-child { margin-bottom: 0; }

/* ── Storis storytelling block ── */
.storis-wrapper {
  position: relative;
  margin-top: 120px;
}

.storis-section {
  position: sticky;
  top: 0;
  background: #F5F5F5;
  padding: clamp(40px, 6vh, 100px) 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

/* Sliding card container.
   clamp по высоте вьюпорта — иначе на невысоких экранах (ноутбук с масштабированием
   ОС, 1366×768 и т.п.) блок выше видимой области и нижние карточки/бейджи обрезаются. */
.storis-cards-container {
  position: relative;
  width: 100%;
  max-width: 1400px;
  height: clamp(460px, 66vh, 640px);
  overflow: hidden;
  border-radius: 24px;
  --storis-title-h: clamp(79px, 11.35vh, 110px);
}

.storis-card {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: #F5F5F5;
  border-radius: 24px;
  overflow: visible;
  transform: translateX(105%);
  transition: transform 0.65s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
}

.storis-card.active {
  transform: translateX(0);
}

.storis-card.slide-done {
  transform: translateX(-105%);
}

.storis-photo {
  position: absolute;
  top: var(--storis-title-h, 110px);
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  /* height: calc(100% - var(--storis-title-h, 110px)); */
  width: auto;
  object-fit: contain;
  object-position: bottom center;
  pointer-events: none;
  z-index: 2;
  height: 100%;
  padding-bottom: 6%;
}

.storis-title {
  position: absolute;
  top:0;
  left: 0; right: 0;
  text-align: center;
  font-family: Onder, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  color: #4B0082;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  line-height: 48px;
  margin: 0 0 20px;
  z-index: 2;
  pointer-events: none;
}

.storis-title--left { text-align: left; padding-left: 36px; }
.storis-gold { color: #FFCA70; }

/* — Base hidden state for animated elements — */
.storis-elem {
  position: absolute;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.7s ease, transform 0.7s ease;
  z-index: 4;
}

.storis-elem.visible {
  opacity: 1;
  transform: translateY(0);
}

/* .storis-word spans are kept for per-word text styling (gradient/underline
   on highlighted words) — they no longer animate individually, the whole
   .storis-elem fades in as one block via the rules above. */
.storis-word {
  display: inline-block;
}

/* badge uses flex+gap — override so word spans don't spread */
.storis-badge-yellow.storis-elem--split {
  gap: 0;
}

.storis-badge-yellow .storis-word {
  margin-right: 0.3em;
}

.storis-badge-yellow .storis-word:last-child {
  margin-right: 0;
}

/* Card 0 — problem */
.storis-c0-problem {
  position: absolute;
  left: 60px;
  top: 150px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Children of problem block animate in-flow (not absolute) */
.storis-c0-problem > .storis-elem {
  position: relative;
  z-index: 3;
}

.storis-problem-label {
  font-family: "Nunito Sans", sans-serif;
  font-size: 24px;
  font-weight: 700;
  color: #393939;
  display: block;
  line-height: 36px;
  letter-spacing: -0.456px;
  max-width: 308px;
}

.storis-problem-text {
  font-family: "Nunito Sans", sans-serif;
  font-size: 20px;
  font-weight: 400;
  color: #393939;
  line-height: 28px;
  letter-spacing: -0.38px;
  display: block;
  max-width: 308px;
}

.storis-badge-yellow {
  display: inline-flex;
  white-space: nowrap;
  justify-content: center;
  align-items: center;
  gap: 10px;
  transform: rotate(-2deg);
  padding: 16px;
  border-radius: 8px;
  border: 1px solid #B3AEF3;
  background: #FFCA70;
  color: #1E1E28;
  font-family: "Nunito Sans", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  line-height: 28px;
  letter-spacing: -0.456px;
  text-transform: uppercase;
}

/* preserve rotation when badge becomes visible */
.storis-badge-yellow.visible {
  transform: rotate(-2deg);
}

/* Card 0 — cloud */
.storis-cloud {
  right: 197px;
  top: 60px;
  width: 429px;
  height: 234px;
  pointer-events: none;
}

.storis-cloud--mobile { display: none; }

/* Card 1 — search bubbles row */
.storis-bubble {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(180deg, #fff 0%, #f5f2ff 100%);
  border: 1px solid rgba(75, 0, 130, 0.10);
  border-radius: 60px;
  padding: 0 24px;
  height: 56px;
  font-family: "Nunito Sans", sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: #4B0082;
  white-space: nowrap;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}

.storis-search-icon { flex-shrink: 0; }

/* Card 1 — bubble positions */
.storis-c1-b1 { left: 210px; top: 250px; }
.storis-c1-b2 { right: 247px; top: 215px; }
.storis-c1-b3 { left: 258px; top: 450px; }
.storis-c1-b4 { right: 218px; top: 353px; }

/* Card 2 — steps */
.storis-step-item {
  display: inline-flex;
  min-height: 110px;
  padding: 24px;
  box-sizing: border-box;
  align-items: center;
  gap: 24px;
  border-top-left-radius: 32px;
  border-top-right-radius: 32px;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 32px;
  background: rgba(255, 255, 255, 1);
  box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.04);
  backdrop-filter: blur(15px);
  font-family: "Nunito Sans", sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -0.38px;
  color: rgba(57, 57, 57, 1);
}

.storis-step-item--right {
  border-bottom-right-radius: 32px;
  border-bottom-left-radius: 8px;
}

.storis-step-num {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  min-width: 50px;
}

.storis-step-num svg {
  display: block;
}

.storis-step-num svg,
.storis-step-num svg path {
  opacity: 1;
}

.storis-step-item > span:last-child {
  flex: 1;
  min-width: 0;
  max-width: 286px;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: break-word;
}

.storis-step-item u {
  font-family: "Nunito Sans", sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-decoration: none;
}

/* декорация и градиент — на самом слове, чтобы совпадали с его opacity-анимацией */
.storis-step-item u .storis-word {
  display: inline;
  text-decoration: underline;
  text-decoration-style: solid;
  text-decoration-color: #733F89;
  text-decoration-skip-ink: auto;
  background: linear-gradient(270deg, #733F89 -13.84%, #221228 113.84%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.storis-step--tl { top: clamp(160px, 22.9vh, 222px); left: 159px; }
.storis-step--tr { top: clamp(151px, 21.6vh, 210px); right: 215px; }
.storis-step--bl { top: clamp(328px, 47.1vh, 457px); left: 191px; width: 304px; }
.storis-step--br { top: clamp(311px, 44.55vh, 432px); right: 260px; width: 308px; }

.storis-c2-s2 { top: 260px; right: 28px; }

/* Card 1 — junior story2 bubbles */
.storis-card[data-card="1"] .storis-step-item {
  background: #B3AEF3;
  font-family: "Nunito Sans", sans-serif;
  font-weight: 600;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.38px;
  color: #FFFFFF;
}

.storis-card[data-card="1"] .storis-step-item u {
  font-family: "Nunito Sans", sans-serif;
  font-weight: 600;
  font-size: 24px;
  line-height: 36px;
  letter-spacing: -0.456px;
  color: #FFFFFF;
  text-decoration: underline;
  text-decoration-style: solid;
  text-decoration-color: #FFFFFF;
  text-decoration-skip-ink: auto;
}

.storis-card[data-card="1"] .storis-step--bl {
  width: 500px;
}

/* Card 2 junior — bubble styles */
.storis-card[data-card="2"] .storis-step-item {
  background: linear-gradient(180deg, #FFFFFF 0%, #E1DDFC 100%);
  font-family: "Nunito Sans", sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.38px;
  color: #4B0082;
}

.storis-card[data-card="2"] .storis-step-item u {
  font-family: "Nunito Sans", sans-serif;
  font-weight: 600;
  font-size: 24px;
  line-height: 36px;
  letter-spacing: -0.456px;
  color: #9747FF;
  text-decoration: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: auto;
}

.storis-card[data-card="2"] .storis-step-item u .storis-word {
  background: none;
  -webkit-background-clip: unset;
  background-clip: unset;
  -webkit-text-fill-color: #9747FF;
  text-decoration: none;
}

.storis-card[data-card="2"] .storis-step-item > span:last-child {
  max-width: 380px;
}

.storis-card[data-card="2"] .storis-step--bl {
  width: auto;
}

.storis-card[data-card="2"] .storis-step-highlight {
  color: #9747FF;
  font-family: "Nunito Sans", sans-serif;
  font-weight: 600;
  font-size: 24px;
  line-height: 36px;
  letter-spacing: -0.456px;
  text-decoration: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: auto;
}

.storis-card[data-card="2"] .storis-step-highlight .storis-word {
  text-decoration: inherit;
  text-decoration-style: inherit;
  text-decoration-skip-ink: inherit;
}

.storis-card[data-card="1"] .storis-step--bl .storis-step-item > span:last-child {
  max-width: 440px;
}

.storis-card[data-card="1"] .storis-step-item u .storis-word {
  background: none;
  -webkit-background-clip: unset;
  background-clip: unset;
  -webkit-text-fill-color: #FFFFFF;
  text-decoration: none;
}

.storis-title-violet { color: #9747FF; }

.storis-title-eyebrow {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #4B0082;
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.4;
}

/* Card 3 — leader bubbles */
.storis-leader-bubble {
  padding: 24px;
  align-items: center;
  gap: 24px;
  border-radius: 32px 32px 8px 32px;
  background: var(--1t-2, #B3AEF3);
  box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.04);
  width: 407px;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -0.38px;
  color: var(--white, #FFF);
  box-sizing: border-box;
}

.storis-c3-b2 .storis-leader-bubble {
  border-radius: 32px 32px 32px 8px;
}

.storis-leader-highlight {
  color: var(--white, #FFF);
  font-size: 24px;
  font-weight: 600;
  line-height: 36px;
  letter-spacing: -0.456px;
  text-decoration: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: auto;
  text-underline-position: from-font;
}

.storis-leader-highlight .storis-word {
  text-decoration: inherit;
  text-decoration-style: inherit;
  text-decoration-skip-ink: inherit;
}

.storis-c3-b1 { top: 177px; left: 77px; }
.storis-c3-b2 { top: 250px; right: 231px; }
.storis-c3-b3 { top: 375px; left: 124px; }

/* Card 4 — results */
.storis-result {
  background: #FFCA70;
  padding: 24px;
  box-sizing: border-box;
  height: 84px;
  display: inline-block;
  line-height: calc(84px - 48px);
  font-family: "Nunito Sans", sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #1E1E28;
  white-space: nowrap;
}

/* left-side results: sharp bottom-right corner */
.storis-result--tr,
.storis-result--br {
  width: 433px;
  left: 94px;
  border-radius: 32px 32px 8px 32px;
}

/* right-side results: sharp bottom-left corner */
.storis-result--tl,
.storis-result--bl {
  width: 396px;
  border-radius: 32px 32px 32px 8px;
}

.storis-result--tr { top: 195px; }
.storis-result--tl { top: 222px; left: 772px; }
.storis-result--br { top: 430px; }
.storis-result--bl { top: 375px; left: 768px; }

.storis-badge-inline {
  position: absolute;
  top: 97px;
  left: 775px;
  width: 194px;
  height: 60px;
  padding: 16px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  border: 1px solid #B3AEF3;
  background: #FFCA70;
  color: #2D0060;
  font-family: "Nunito Sans", sans-serif;
  font-size: 24px;
  font-weight: 900;
  line-height: 28px;
  letter-spacing: -0.456px;
  text-transform: uppercase;
  white-space: nowrap;
  transform: rotate(2deg);
  z-index: 5;
}

.storis-badge-inline.visible {
  transform: rotate(-4deg);
}

/* Dots */
.storis-dots {
  display: flex;
  gap: 8px;
  align-items: center;
}

.storis-dot {
  position: relative;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  overflow: hidden;
  background: rgba(75, 0, 130, 0.18);
  transition: width 0.3s ease, border-radius 0.3s ease;
  cursor: pointer;
}

.storis-dot.active {
  width: 56px;
  border-radius: 100px;
}

/* Fill sweeps over AUTO_NEXT_DELAY (landing.js) — keep the two in sync. */
.storis-dot.active::after {
  content: '';
  position: absolute;
  inset: 0;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #2E1D5D 0%, #221227 99.01%);
  animation: storisDotFill 4.5s linear forwards;
}

@keyframes storisDotFill {
  from { width: 0; }
  to { width: 100%; }
}

/* ── STORIS mobile ── */


/* ── Launch block ── */
.launch {
  position: relative;
  overflow: hidden;
  border-radius: 68px;
  margin: 0 16px 24px;
  padding: 80px 100px;
  background: #F5F5F5;
}

.launch-blob {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 1143px;
  height: 756px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, #ccb054 0%, #ccb054 4%, #452c4a 72%, transparent 100%);
  pointer-events: none;
  z-index: 0;
}


.launch-inner {
  position: relative;
  z-index: 2;
}

.launch-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-style: normal;
  font-weight: 500;
  color: #393939;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.56px;
  line-height: 58px;
  margin: 0 0 48px;
}

.launch-gold {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-style: normal;
  font-weight: 500;
  line-height: 58px;
  letter-spacing: 0.56px;
  color: #FFCA70;
}

.launch-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.launch-card-decor {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 0;
}


.launch-card-num {
  font-family: 'Onder', sans-serif;
  font-size: 80px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
  letter-spacing: 1.6px;
  color: rgba(255, 255, 255, 0.60);
  text-align: center;
  position: absolute;
  top: 24px;
  left: 32px;
  z-index: 1;
  user-select: none;
  pointer-events: none;
}

.launch-card-body {
  position: relative;
  z-index: 1;
}

.launch-card-title {
  font-family: "Nunito Sans", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  color: #fff;
  margin: 0 0 12px;
  line-height: 28px;
  letter-spacing: -0.38px;
}

.launch-card-desc {
  font-family: "Nunito Sans", sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.60);
  margin: 0;
  line-height: 28px;
  letter-spacing: -0.38px;
}

/* ── Responsive ── */


/* ── Split heading reveal (word-by-word, ordrhealth-style) ── */
.split-heading .word-outer {
  display: inline-block;
  overflow: hidden;
  vertical-align: bottom;
  line-height: inherit;
}
.split-heading .word-inner {
  display: inline-block;
  transform: translateY(115%);
  transition: transform 0.75s cubic-bezier(0.16, 1, 0.3, 1);
}
.split-heading.is-visible .word-inner {
  transform: translateY(0);
}

/* ── Section reveal (blueprintapps-style, fade + slide up) ── */
.reveal-section {
  opacity: 0;
  transform: translateY(48px);
  transition: opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
.reveal-section.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ── Stagger child reveal ── */
.sr-child {
  opacity: 0;
  transform: translateY(44px);
  transition: opacity 0.75s cubic-bezier(0.16, 1, 0.3, 1) var(--sd, 0s),
              transform 0.85s cubic-bezier(0.16, 1, 0.3, 1) var(--sd, 0s);
  will-change: opacity, transform;
}
.sr-child.sr-in {
  opacity: 1;
  transform: translateY(0);
}

/* ── Platform CTA-кнопка hidden until reveal ── */
.platform .btn {
  margin-top: 48px;
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.platform.platform-anim .btn {
  opacity: 1;
  transform: translateY(0);
}

/* ── Specialists: показывается сразу, без зависимости от счётчиков STATS ── */


/* ── Events section: staggered reveal ── */
.events-header > div {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1) var(--ev-delay, 0s),
              transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) var(--ev-delay, 0s);
}
.events .event-card,
.events .event-promo-card {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.65s cubic-bezier(0.16, 1, 0.3, 1) var(--ev-delay, 0s),
              transform 0.65s cubic-bezier(0.16, 1, 0.3, 1) var(--ev-delay, 0s);
}
.events.events-anim .events-header > div,
.events.events-anim .event-card,
.events.events-anim .event-promo-card {
  opacity: 1;
  transform: translateY(0);
}

/* ═══════════════════════════════════════════
   CUST FORM — «Оставьте заявку»
   ═══════════════════════════════════════════ */
.cust-form {
  position: relative;
  overflow: hidden;
  z-index: 10;
  background: #2e1d5d;
  border-radius: 64px;
  margin: 0 16px 24px;
  padding: 60px 100px;
  /* Safari: overflow-клип с border-radius слетает из-за backdrop-filter/
     mix-blend-mode у дочерних декоративных элементов и .glow-spot. */
  -webkit-mask-image: -webkit-radial-gradient(white, black);
  mask-image: radial-gradient(white, black);
}

.cust-form-stripes::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 800px;
  height: 500px;
  background: radial-gradient(ellipse, rgba(180,120,230,0.35) 0%, rgba(115,63,137,0.20) 40%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

/* Vertical glass stripes background */
.cust-form-stripes {
  position: absolute;
  inset: 0;
  display: flex;
  gap: 0;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
  border-radius: 64px;
  clip-path: inset(0 round 64px);
  contain: paint;
}

.cust-form-stripe {
  width: 66.7px;
  flex-shrink: 0;
  background: linear-gradient(270deg, rgba(255,255,255,0.01) 0%, rgba(0,0,0,0.05) 39.4%, rgba(255,255,255,0.01) 100%);
  background-blend-mode: overlay;
  backdrop-filter: blur(90px);
  -webkit-backdrop-filter: blur(90px);
}

/* Content stacked vertically, centered */
.cust-form-inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  gap: 32px;
  max-width: 1200px;
  margin: 0 auto;
}

.cust-form-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-style: normal;
  font-weight: 500;
  margin: 0;
  line-height: 58px;
  letter-spacing: 0.56px;
}

.cust-form-title-white { color: #fff; }
.cust-form-title-gold { color: #FFCA70; }

.cust-form-subtitle {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  color: #fff;
  margin: -16px 0 0;
  line-height: 28px;
  letter-spacing: -0.38px;
  max-width: 560px;
}

.cust-form-fields {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

.cust-form-inputs {
  display: flex;
  gap: 24px;
  width: 100%;
  justify-content: flex-start;
}

.cust-form-input-wrap {
  flex: 1 1 371px;       
  min-width: 0;          
}

.cust-form-input {
  width: 100%;
  height: 76px;
  gap: 24px;
  padding: 24px 32px;
  border-radius: 16px;
  border: none;
  background: #FFFFFF4D;
  backdrop-filter: blur(37.06666564941406px);
  -webkit-backdrop-filter: blur(37.06666564941406px);
  color: #fff;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 400;
  outline: none;
  transition: background 0.2s;
  box-sizing: border-box;
}

.cust-form-input::placeholder { color: rgba(255,255,255,0.80); }
.cust-form-input:focus {
  background: rgba(255,255,255,0.16);
}

.cust-form-btn {
  width: 243px;
  height: 72px;
  border-radius: 100px;
  border: none;
  background: var(--color-primary-white);
  color: #383838;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 4px 4px 35px 0px #A997FF0D, -4px -4px 35px 0px #A997FF0D;
  transition: transform 0.2s;
}
.cust-form-btn:hover:not(:disabled) { transform: translateY(-2px); }
.cust-form-btn:disabled { cursor: not-allowed; transform: none; }

.cust-form-error {
  display: block;
  min-height: 18px;
  margin-top: 6px;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 13px;
  color: #ff6b6b;
}
.cust-form-input-wrap.has-error .cust-form-input,
.cust-form-input-wrap.has-error .cust-form-input--phone {
  border-color: #ff6b6b;
}

/* Phone selector in cust-form */
.cust-form-input-wrap--phone { position: relative; overflow: visible; }
.cust-phone-group {
  display: flex;
  align-items: stretch;
  gap: 0;
  width: 100%;
}
.cust-phone-code-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 76px;
  padding: 0 16px;
  border-radius: 16px 0 0 16px;
  border: none;
  background: #FFFFFF4D;
  backdrop-filter: blur(37.06666564941406px);
  -webkit-backdrop-filter: blur(37.06666564941406px);
  color: var(--color-primary-white);
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.2s;
  flex-shrink: 0;
}
.cust-phone-code-btn:hover { background: rgba(255,255,255,0.18); }
.cust-form-input--phone {
  border-radius: 0 16px 16px 0 !important;
  flex: 1;
  min-width: 0;
}
.cust-phone-dropdown {
  position: fixed;
  z-index: 1000;
  background: rgba(255,255,255,0.10);
  backdrop-filter: blur(37.06666564941406px);
  -webkit-backdrop-filter: blur(37.06666564941406px);
  border: 1.5px solid rgba(255,255,255,0.25);
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.12);
  overflow-y: auto;
  max-height: 240px;
  min-width: 280px;
  scrollbar-width: thin;
  scrollbar-color: #733F89 transparent;
}
.cust-phone-dropdown::-webkit-scrollbar { width: 4px; }
.cust-phone-dropdown::-webkit-scrollbar-track { background: transparent; }
.cust-phone-dropdown::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #733F89 0%, #221228 99.01%); border-radius: 4px; }
.cust-phone-dropdown::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #8a4fa3 0%, #2e1840 99.01%); }
.cust-phone-dropdown-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 16px;
  border: none;
  background: none;
  cursor: pointer;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 15px;
  color: #fff;
  text-align: left;
  transition: background 0.15s;
}
.cust-phone-dropdown-item:hover { background: rgba(255,255,255,0.18); }
.cust-phone-dropdown-flag { font-size: 20px; }
.cust-phone-dropdown-dial { font-weight: 600; min-width: 44px; }
.cust-phone-dropdown-name { color: rgba(255,255,255,0.7); }


/* Toast для страницы заказчика */
#custSuccessToast {
  position: fixed;
  top: 24px;
  left: 50%;
  transform: translateX(-50%) translateY(-120px);
  z-index: 2000;
  display: inline-flex;
  padding: 16px 32px;
  align-items: center;
  gap: 24px;
  background: #fff;
  border-radius: 20px;
  box-shadow: 0px 0px 25px 0px rgba(46, 37, 52, 0.15), 0px 0px 5px 0px rgba(141, 117, 250, 0.8);
  opacity: 0;
  transition: transform 0.4s cubic-bezier(0.34,1.56,0.64,1), opacity 0.3s ease;
  pointer-events: none;
}
#custSuccessToast.is-visible {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}
#custSuccessToast .success-toast__title {
  color: rgba(57, 57, 57, 1);
}
#custSuccessToast .success-toast__sub {
  color: rgba(57, 57, 57, 1);
}

/* ═══════════════════════════════════════════
   CUST FOOTER — страница «Заказчик»
   ═══════════════════════════════════════════ */
.cust-footer {
  position: relative;
  overflow: visible;
  background: linear-gradient(90deg, #733F89 0%, #221228 99.01%);
  border-radius: 64px;
  margin: 0 16px 24px;
  padding: 48px 64px 40px;
}

/* Декоративные плитки */
.cust-footer-tiles {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: repeat(13, 120px);
  grid-template-rows: repeat(3, 120px);
  gap: 8px;
  pointer-events: none;
  opacity: 0.12;
  overflow: hidden;
  border-radius: 64px;
}
.cust-footer-tile {
  width: 120px;
  height: 120px;
  border-radius: 16px;
  border: 1px solid rgba(223, 184, 255, 0.70);
  background: rgba(223, 184, 255, 0.01);
  backdrop-filter: blur(30px);
  -webkit-backdrop-filter: blur(30px);

}
/* первая плитка в каждой строке — непрозрачная */
.cust-footer-tile:nth-child(1),
.cust-footer-tile:nth-child(14),
.cust-footer-tile:nth-child(27) {
  border: 1px solid rgba(223, 184, 255, 0.70);
  opacity: 1.12;
}

/* Основная строка */
.cust-footer-main {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 40px;
  margin-bottom: 32px;
}

/* Навигация */
.cust-footer-nav {
  display: flex;
  gap: 40px;
}
.cust-footer-nav-col {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.cust-footer-nav-col a {
  color: #fff;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  font-weight: 400;
  text-decoration: none;
  opacity: 0.9;
  transition: opacity 0.2s;
}
.cust-footer-nav-col a:hover { opacity: 1; text-decoration: underline; }

/* Контакты */
.cust-footer-contact {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cust-footer-phone {
  color: #fff;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 700;
  line-height: 135%;
  letter-spacing: -0.608px;
  text-decoration: none;
  white-space: nowrap;
}
.cust-footer-email {
  color: #fff;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  font-weight: 400;
  text-decoration: none;
  opacity: 0.9;
}
.cust-footer-email:hover { opacity: 1; text-decoration: underline; }

/* Соцсети */
.cust-footer-socials {
  display: flex;
  gap: 12px;
  align-items: center;
}
.cust-footer-social {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 100px;
  background: #fff;
  transition: opacity 0.2s, transform 0.2s;
  flex-shrink: 0;
}
.cust-footer-social:hover { opacity: 0.85; transform: translateY(-2px); }
.cust-footer-social img { width: 24px; height: 24px; display: block; }

/* Нижняя строка */
.cust-footer-bottom {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-top: 24px;
}
.cust-footer-legal {
  display: flex;
  gap: 32px;
  flex-wrap: wrap;
}
.cust-footer-legal a {
  color: #fff;
  font-family: 'Montserrat', sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: auto;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
  transition: opacity 0.2s;
}
.cust-footer-legal a:hover { opacity: 0.75; }
.cust-footer-copy {
  color: #fff;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  font-weight: 600;
  white-space: nowrap;
  opacity: 0.9;
}

/* Responsive */


/* ════════════════════════════════════════
   FOR JUNIOR PAGE  (jr- prefix)
   ════════════════════════════════════════ */

.jr-gold { color: #FFCA70; }

/* ── Hero ── */
.jr-hero {
  position: relative;
  overflow: hidden;
  border-radius: 64px;
  margin: 0 0 24px;
  background: linear-gradient(90deg, #4B0082 -33.73%, #B3AEF3 108.63%);
  height: 614px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* Safari: overflow-клип с border-radius слетает из-за backdrop-filter
     дочерних .jr-hero-stripe / mix-blend-mode у .glow-spot. */
  -webkit-mask-image: -webkit-radial-gradient(white 100%, black 100%);
  mask-image: radial-gradient(white 100%, black 100%);
}

.jr-hero-stripes {
  position: absolute;
  inset: 0;
  display: flex;
  pointer-events: none;
  z-index: 0;
}

.jr-hero-stripe {
  width: 66.7px;
  flex-shrink: 0;
  background: linear-gradient(270deg, rgba(255,255,255,0.04) 0%, rgba(0,0,0,0.06) 39.4%, rgba(255,255,255,0.04) 100%);
  backdrop-filter: blur(90px);
}

.jr-hero-inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 80px 60px 40px;
  flex: 1;
  gap: 40px;
}

.jr-hero-text {
  /* flex: 0 0 560px; */
  display: flex;
  flex-direction: column;
}

.jr-hero-subtitle {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 400;
  color: #FFF;
  text-shadow: 0 4px 53.7px #61465E;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-transform: none;
  margin: 0 0 48px;
}

.jr-hero-title {
  font-family: 'Onder', sans-serif;
  font-size: 32px;
  font-weight: 500;
  color: #FFF;
  text-shadow: 0 4px 53.7px rgba(97, 70, 94, 0.10);
  line-height: 64px;
  letter-spacing: 0.64px;
  text-transform: uppercase;
  animation: jrHeroTitleIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) both;
  margin: 0 0 16px;
}

@keyframes jrHeroTitleIn {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}

.jr-hero-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 260px;
  height: 72px;
  border-radius: 100px;
  background: #FFF;
  backdrop-filter: blur(30px);
  color: #4B0082;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-decoration: none;
  transition: opacity 0.2s;
}
.jr-hero-btn:hover { opacity: 0.9; }

.jr-hero-img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 38%;
  overflow: hidden;
  z-index: 0;
}
.jr-hero-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  /* Отключаем hover-иконку «поиск по картинке» в Яндекс.Браузере —
     фото чисто декоративное, кликов/наведений не требует. */
  pointer-events: none;
}

.jr-hero-features {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border: 1px solid rgba(255, 255, 255, 0.50);
  background: rgba(66, 48, 80, 0.35);
  backdrop-filter: blur(20px);
  border-radius: 0 0 68px 68px;
  animation: jrHeroTitleIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both;
}

.jr-hero-feature {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  padding: 28px 32px;
  border-right: 1px solid rgba(255,255,255,0.12);
}
.jr-hero-feature:last-child { border-right: none; }

/* На этой ширине (991–1050px) заголовок/описание карточки переносились
   на 2 строки из-за нехватки места в 4-колоночной сетке — сужаем паддинги,
   чтобы текст помещался в одну строку */
@media (min-width: 991px) and (max-width: 1050px) {
  .jr-hero-feature { padding: 28px 24px; }
}


.jr-hero-feature-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 4px;
}

.jr-hero-feature-label {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: #FFF;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-align: center;
  animation: jrHeroTitleIn 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.4s both;
}

.jr-hero-feature-title {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: rgba(226, 216, 228, 0.80);
  line-height: 20px;
  letter-spacing: -0.304px;
  text-align: center;
  animation: jrHeroTitleIn 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.5s both;
}

/* ── Команды союза ── */
.jr-teams {
  position: relative;
  background: #E1DDFC;
  border-radius: 64px;
  margin: 0 16px 24px;
  padding: 60px ;
  overflow: hidden;
}

.jr-teams-bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 60%;
  pointer-events: none;
}

.jr-teams-bg-img {
  position: absolute;
  height: auto;
  display: flex;
  align-items: center;
}
.jr-teams-bg-mobile { display: none; }
.jr-teams-lenta--1 {
  top: 0;
  left: 0;
  width: 100%;
  transform: none;
}
.jr-teams-lenta--2 {
  top: -16px;
  left: 0;
  width: 100%;
  transform: none;
}

.jr-teams-bg-img--1 {
  right: -3.152px;
  top: 1px;
  transform: rotate(0deg);
  gap: 12px;
  z-index: 2;
}

.jr-teams-bg-img--2 {
  right: -109.261px;
  transform: rotate(-4deg);
  padding: 0 42px;
  gap: 12px;
  bottom: 21px;
  z-index: 1;
}

.jr-teams-header {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
    flex-direction: column;
}

.jr-teams-text { flex: 1 1 0; }

.jr-teams-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  color: #4B0082;
  line-height: 58px;
  letter-spacing: 0.56px;
  text-transform: uppercase;
  margin: 0 0 8px;
}

.jr-teams-subtitle {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 400;
  color: #4B0082;
  line-height: 28px;
  letter-spacing: -0.38px;
  max-width: 560px;
}

.jr-teams-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  height: 72px;
  padding: 0 40px;
  border-radius: 100px;
  background: var(--color-primary-white);
  backdrop-filter: blur(30px);
  color: var(--color-violet-main);
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  transition: opacity 0.2s;
}
.jr-teams-btn:hover { opacity: 0.9; }

/* Partner logos scroll */
.jr-partners {
  display: flex;
  flex-direction: column;
  gap: 24px;
  overflow: hidden;
}

.jr-partners-track {
  display: flex;
  gap: 32px;
  align-items: center;
  animation: jr-scroll-left 30s linear infinite;
  width: max-content;
}

.jr-partners-track--reverse {
  animation-direction: reverse;
}

.jr-partners-track img {
  height: 48px;
  width: auto;
  flex-shrink: 0;
  opacity: 0.7;
  filter: grayscale(30%);
  object-fit: contain;
}

@keyframes jr-scroll-left {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ── Статистика ── */
.jr-stats {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 60px 100px;
  margin: 0 16px 24px;
  background: #fff;
  border-radius: 32px;
}

.jr-stats-item {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-align: center;
}

.jr-stats-num {
  font-family: 'Onder', sans-serif;
  font-size: 64px;
  font-weight: 500;
  color: #4B0082;
  line-height: 1;
  letter-spacing: 1.28px;
}

.jr-stats-label {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: #383838;
  line-height: 24px;
  letter-spacing: -0.342px;
}

.jr-stats-divider {
  width: 1px;
  height: 80px;
  background: rgba(0,0,0,0.12);
  flex-shrink: 0;
}

/* ── Слайдер ── */
.jr-slider-wrapper {
  position: relative;
}

.jr-slider {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  padding: clamp(40px, 8vh, 80px) 0;
  position: sticky;
  top: 0;
  box-sizing: border-box;
  align-content: center;
}

.jr-slider-unit {
  grid-area: 1 / 1;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 0;
  min-height: 600px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.5s ease;
}

.jr-slider-unit.active {
  opacity: 1;
  pointer-events: auto;
}

.jr-slider-photo-unit {
  position: relative;
  flex: 0 0 560px;
  width: 560px;
  background: linear-gradient(90deg, #4B0082 0%, #B3AEF3 100%);
  background-size: cover;
  background-position: center top;
  border-radius: 68px;
  overflow: hidden;
}

.jr-slider-photo-unit--cover {
  background-position: right center;
}

.jr-slider-photo-unit--slide1 {
  overflow: visible;
  position: relative;
  clip-path: inset(-2000px 0 0 0 round 68px);
}

.jr-slider-spec {
  position: absolute;
  bottom: -7%;
  left: -3%;
  object-fit: cover;
  object-position: bottom center;
  pointer-events: none;
}

.jr-slider-spec--slide2 {
  bottom: 13%;
  left: 0%;
  width: 99%;
}

.jr-slider-photo-unit--slide3 {
  clip-path: inset(-2000px -2000px 0 -2000px round 68px);
}

.jr-slider-spec--slide3 {
  bottom: -7%;
  left: -46%;
}

.jr-slider-spec--slide4 {
  bottom: -7%;
  left: 0;
}

.jr-slider-unit-body {
  flex: 1 1 0;
  min-width: 0;
  background: #E1DDFC;
  border-radius: 68px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 152px 64px 152px 96px;
  box-sizing: border-box;
  position: relative;
}

.jr-slider-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  color: #9747FF;
  line-height: 58px;
  letter-spacing: 0.56px;
  margin: 0;
}

.jr-slider-title-accent {
  color: #9747FF;
}

.jr-slider-subtitle {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 400;
  color: #4B0082;
  line-height: 28px;
  letter-spacing: -0.38px;
  margin-top: 16px;
  margin-bottom: 64px;
}

.jr-slider-btn {
  display: inline-flex;
  padding: 24px 48px;
  justify-content: center;
  align-items: center;
  gap: 24px;
  border-radius: 16px;
  border: 1px solid #E1DDFC;
  background: #F2F1FF;
  backdrop-filter: blur(30px);
  color: #4B0082;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-decoration: none;
  align-self: flex-start;
}

/* ── Новые слайды (готовые изображения фото + сиреневый блок) — только
   для страницы «Специалисты с опытом», по аналогии с SPECIALISTS на index ── */
.jr-new-slide { display: none; }
.jr-slide-img {
  width: 100%;
  height: auto;
  display: block;
}
.jr-slide-img--1024 { display: none; }
.jr-slide-img--768 { display: none; }
.jr-slide-img--390 { display: none; }


@media (max-width: 1170px) and (min-width: 1001px) {
  .jr-slide-img--desktop { display: none; }
  .jr-slide-img--1024 { display: block; }


}


@media (max-width: 1000px) and (min-width: 692px) {
  .jr-slide-img--desktop { display: none; }
  .jr-slide-img--768 { display: block; }

      .path-step-item {
      padding: 12px 12px;
    height: 90px;   
   }
}


@media (max-width: 691px) {
  .jr-slide-img--desktop { display: none; }
  .jr-slide-img--390 { display: block; }
     .path-step-item {
      padding: 12px 12px;
   }
  .jr-slider-dot {
    width: 20px;
    height: 20px;
  }
  .jr-slider-dot .jd-arc { display: none; }
}


.jr-slider-dots {
  grid-area: 1 / 1;
  align-self: center;
  justify-self: end;
  margin-right: 30px;
  display: flex;
  flex-direction: column;
  gap: 21px;
  z-index: 2;
  pointer-events: auto;
}

.jr-slider-dot {
  cursor: pointer;
  flex-shrink: 0;
}

.jr-slider-dot .jd-ring  { stroke: #B3AEF3; stroke-width: 2; }
.jr-slider-dot .jd-inner { fill: #B3AEF3; }
.jr-slider-dot .jd-arc   { stroke: #4B0082; stroke-width: 2; stroke-dashoffset: 94.25; transition: none; }

/* Кольцо-трек остаётся светлым, иначе дуга того же цвета на нём не видна */
.jr-slider-dot.active .jd-ring  { stroke: #B3AEF3; stroke-width: 2; }
.jr-slider-dot.active .jd-inner { fill: #4B0082; }

.jr-slider-dot.visited .jd-ring  { stroke: #4B0082; stroke-width: 2; }
.jr-slider-dot.visited .jd-inner { fill: #4B0082; }
.jr-slider-dot.visited .jd-arc   { stroke-dashoffset: 0; }

/* ── История Ани ── */
.jr-story {
  display: flex;
  gap: 40px;
  background: #F5F5F5;
  border-radius: 68px;
  margin: 0 16px 24px;
  padding: 80px 100px;
  align-items: flex-start;
}

.jr-story-left {
  flex: 0 0 440px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.jr-story-person {
  display: flex;
  align-items: center;
  gap: 20px;
}

.jr-story-photo {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  object-fit: cover;
}

.jr-story-label {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.jr-story-name {
  font-family: 'Onder', sans-serif;
  font-size: 24px;
  font-weight: 500;
  color: #383838;
  text-transform: uppercase;
}

.jr-story-age {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  color: #6b6b6b;
}

.jr-story-facts {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.jr-story-fact {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #383838;
  line-height: 26px;
}

.jr-story-fact-cont {
  display: block;
  font-weight: 400;
  color: #6b6b6b;
}

.jr-story-right {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.jr-story-title {
  font-family: 'Onder', sans-serif;
  font-size: 48px;
  font-weight: 500;
  color: #383838;
  line-height: 1.15;
  letter-spacing: 0.96px;
  text-transform: uppercase;
}

.jr-story-bubbles {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.jr-story-bubble {
  display: inline-flex;
  flex-direction: column;
  background: #fff;
  border-radius: 24px;
  padding: 20px 28px;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #383838;
  box-shadow: 0 2px 16px rgba(0,0,0,0.06);
  align-self: flex-start;
}

.jr-story-bubble-label {
  font-size: 14px;
  font-weight: 400;
  color: #6b6b6b;
  margin-bottom: 4px;
}

.jr-story-bubble--question {
  background: #FFCA70;
}

/* ── Ваш путь ── */
.jr-path {
  position: relative;
  overflow: hidden;
  border-radius: 68px;
  margin: 0 16px 24px;
  padding: 80px 100px;
  background: #F5F5F5;
}

.jr-path-blob {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 1143px;
  height: 756px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, #ccb054 0%, #ccb054 4%, #452c4a 72%, transparent 100%);
  pointer-events: none;
  z-index: 0;
}

.jr-path-stripes {
  position: absolute;
  inset: 0;
  display: flex;
  pointer-events: none;
  z-index: 1;
}

.jr-path-stripe {
  width: 66.7px;
  flex-shrink: 0;
  background: linear-gradient(270deg, rgba(255,255,255,0.04) 0%, rgba(0,0,0,0.06) 39.4%, rgba(255,255,255,0.04) 100%);
  backdrop-filter: blur(90px);
}

.jr-path-inner {
  position: relative;
  z-index: 2;
}

.jr-path-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  color: #4B0082;
  line-height: 58px;
  letter-spacing: 0.56px;
  text-transform: uppercase;
  text-align: center;
  margin: 0 0 48px;
}

.jr-path-title .jr-gold {
  color: #9747FF;
}

.jr-path-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}


.jr-path-card-decor {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 0;
}

.jr-path-card-num {
  font-family: 'Onder', sans-serif;
  font-size: 80px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
  letter-spacing: 1.6px;
  color: #E1DDFC;
  position: absolute;
  top: 24px;
  left: 32px;
  z-index: 1;
  user-select: none;
}

.jr-path-card-body { position: relative; z-index: 1; }

.path-title-br { display: none; }

.jr-path-card-title {
  font-family: 'Noto Sans', sans-serif;
  font-size: 24px;
  font-weight: 700;
  color: #4B0082;
  margin: 0 0 12px;
  line-height: 135%;
  letter-spacing: -0.528px;
  white-space: nowrap;
}

.jr-path-card-desc {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 400;
  color: #4B0082;
  line-height: 28px;
  letter-spacing: -0.38px;
  opacity: 0.6;
}

/* Текст третьей карточки чуть длиннее — 1px меньше шрифта, чтобы уместиться
   в 3 строки как у остальных карточек, без сокращения текста */
.jr-path-card-desc--sm {
  font-size: 19.5px;
}

/* ── Менторы ── */
.jr-mentors {
  background: #E1DDFC;
  border-radius: 64px;
  margin: 0 16px 24px;
  padding: 80px 100px;
}

.jr-mentors-header {
  text-align: center;
  margin-bottom: 48px;
}

.jr-mentors-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  color: #4B0082;
  line-height: 58px;
  letter-spacing: 0.56px;
  text-transform: uppercase;
  margin: 0 0 12px;
}

.jr-mentors-title .jr-gold {
  color: #9747FF;
}

.jr-mentors-subtitle {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 400;
  color: #4B0082;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-align: center;
  max-width: 600px;
  margin: 0 auto;
}

.jr-mentors-steps {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-bottom: 48px;
  background: #F2F1FF;
  border-radius: 24px;
  padding: 20px 32px;
}

.jr-mentors-step {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 24px;
  border-radius: 16px;
  flex: 1 1 0;
}

.jr-mentors-step--active {
  background: #4B0082;
}

.jr-mentors-step--active .jr-mentors-step-num,
.jr-mentors-step--active .jr-mentors-step-text {
  color: #fff;
}

.jr-mentors-step-icon {
  border-radius: 12px;
  background: #B3AEF3;
  box-shadow: 0 6px 15px 0 rgba(75, 0, 130, 0.10);
  display: flex;
  width: 56px;
  height: 56px;
  padding: 12px;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  box-sizing: border-box;
}

.jr-mentors-step-text {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #4B0082;
  line-height: 28px;
  letter-spacing: -0.38px;
}

.jr-mentors-step-arrow {
  flex-shrink: 0;
}

.jr-mentors-carousel {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-bottom: 40px;
}

.jr-mentors-cards-viewport {
  overflow: hidden;
  touch-action: pan-y;
}

.jr-mentors-cards {
  display: flex;
  gap: 16px;
  transition: transform 0.4s ease;
  will-change: transform;
}

.jr-mentors-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
}

.jr-carousel-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid #C8C2E8;
  background: #fff;
  color: #4B0082;
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s, opacity .2s;
}

.jr-carousel-arrow:hover:not(:disabled) { background: #4B0082; color: #fff; border-color: #4B0082; }

.jr-carousel-arrow:disabled { opacity: 0.35; cursor: default; }

.jr-carousel-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.jr-carousel-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  border: none;
  background: #C8C2E8;
  cursor: pointer;
  padding: 0;
  transition: width 0.3s ease, background 0.3s ease;
}

.jr-carousel-dot--active {
  width: 28px;
  background: #4B0082;
}

.jr-reviews-dots {
  display: none;
}

.jr-reviews-dots .jr-carousel-dot {
  background: rgba(255, 255, 255, 0.35);
}

.jr-reviews-dots .jr-carousel-dot--active {
  background: #fff;
}

.jr-mentor-card {
  background: #fff;
  border-radius: 24px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  flex: 0 0 calc((100% - 32px) / 3);
  min-width: 0;
  box-sizing: border-box;
}

.jr-mentor-card:hover {
  border: 1px solid #9747FF;
  box-shadow: 0 0 10px 0 rgba(141, 117, 250, 0.20), 0 0 35px 2px rgba(169, 151, 255, 0.25);
}

.jr-mentor-top {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.jr-mentor-photo {
  width: 140px;
  height: 140px;
  object-fit: cover;
  border-radius: 16px;
  flex-shrink: 0;
  display: block;
}

.jr-mentor-info {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.jr-mentor-name {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 28px;
  font-weight: 700;
  color: #4B0082;
  line-height: 1.25;
  margin: 0;
}

.jr-mentor-occupation-icon {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  margin-right: 6px;
}

.jr-mentor-occupation {
  display: flex;
  align-items: center;
  white-space: nowrap;
  font-family: 'Nunito Sans', sans-serif;
  font-weight: 400;
  font-style: Regular;
  font-size: 14px;
  leading-trim: NONE;
  line-height: 24px;
  letter-spacing: -1.9%;
  color: #4B0082;

}

.jr-mentor-stats {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.jr-mentor-stat {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #383838;
  white-space: nowrap;
}

.jr-mentor-stat--hl {
  background: #E1DDFC;
  border-radius: 12px;
  padding: 12px 16px;
  font-weight: 700;
  color: #4B0082;
}

.jr-mentor-helps {
  background: #F2F1FF;
  border-radius: 16px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.jr-mentor-helps-title {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #383838;
  margin: 0;
}

.jr-mentor-helps-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.jr-mentor-helps-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  color: #383838;
}

.jr-mentor-helps-list li svg {
  flex-shrink: 0;
}

.jr-mentors-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.jr-mentors-btn {
  display: inline-flex;
  width: 382px;
  padding: 24px 48px;
  justify-content: center;
  align-items: center;
  gap: 16px;
  border-radius: 100px;
  background: linear-gradient(90deg, var(--color-violet-main) -33.73%, var(--color-violet-light) 108.63%);
  color: var(--color-primary-white);
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-decoration: none;
  box-sizing: border-box;
  transition: opacity 0.2s;
}
.jr-mentors-btn:hover { opacity: 0.9; }

.jr-mentors-note {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #4B0082;
  line-height: 24px;
  letter-spacing: -0.304px;
  text-align: center;
  opacity: 0.6;
}

/* ── Отзывы новичков ── */
.jr-reviews {
  position: relative;
  overflow: hidden;
  border-radius: 64px;
  margin: 0 16px 24px;
  padding: 60px 80px 80px;
  background: linear-gradient(135deg, #7B52C7 0%, #4B0082 55%, #2D0060 100%);
}

.jr-reviews-tiles {
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Crect x='6' y='6' width='128' height='128' rx='20' fill='none' stroke='rgba(255,255,255,0.07)' stroke-width='1'/%3E%3C/svg%3E");
  background-size: 140px 140px;
  pointer-events: none;
  z-index: 0;
}

.jr-reviews-inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.jr-reviews-title {
  font-family: 'Onder', sans-serif;
  color: #fff;
  font-size: 28px;
  font-style: normal;
  font-weight: 500;
  line-height: 58px; /* 207.143% */
  letter-spacing: 0.56px;
  display: inline-block;
  padding-bottom: 40px;
}

.jr-reviews-viewport {
  width: 100%;
  overflow: hidden;
  /* запас сверху/снизу под scale(1.08) активного кружка — иначе он обрезается
     о overflow:hidden контейнера в момент воспроизведения отзыва */
  padding: 16px 0;
  margin: -16px 0;
}

.jr-reviews-circles {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 40px;
  width: 100%;
  will-change: transform;
}

.jr-review-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
}

.jr-review-circle-wrap {
  position: relative;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  overflow: hidden;
  background: rgba(255,255,255,0.12);
  flex-shrink: 0;
  border: none;
  padding: 0;
  display: block;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  transform: scale(1);
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.jr-review-circle-wrap.is-active {
  transform: scale(1.08);
}

.jr-review-circle-img,
.jr-review-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}

.jr-review-timer {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
}

.jr-review-circle-wrap.is-active .jr-review-timer {
  opacity: 1;
}

.jr-review-timer-track {
  fill: none;
  stroke: rgba(255, 255, 255, 0.25);
  stroke-width: 3;
}

.jr-review-timer-progress {
  fill: none;
  stroke: #fff;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-dasharray: 295.31;
  stroke-dashoffset: 295.31;
  transition: stroke-dashoffset 0.1s linear;
}

.jr-review-circle-name {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 24px;
  font-weight: 700;
  color: #fff;
  margin: 0;
  text-align: center;
}

.jr-review-circle-role {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: rgba(255,255,255,0.70);
  margin: 0;
  text-align: center;
}

/* ── Займи место в команде ── */
.jr-team {
  padding: 80px 60px;
  background: #F5F5F5;
  text-align: center;
}

.jr-team-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  font-style: normal;
  color: #4B0082;
  text-align: center;
  line-height: 58px;
  letter-spacing: 0.56px;
  text-transform: uppercase;
  margin: 0;
}

.jr-team-title em {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  font-style: normal;
  /* color: #9747FF; */
  line-height: 58px;
  letter-spacing: 0.56px;
  padding-left: 3px;
}

.color {
  color: #9747FF;
}

.jr-team .tags-cloud {
  height: 310px;
}

.jr-team .btn-join {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.jr-team.jr-team-anim .btn-join {
  opacity: 1;
  transform: translateY(0);
}

/* ── Кросс-промо ── */
.jr-promo {
  display: flex;
  margin: 0 16px 24px;
}
/* .page-junior .jr-promo {
  margin-top: -21%;
} */


/* .jr-promo-left {
  flex: 0 0 698px;
  border-radius: 68px;
  background: linear-gradient(90deg, #4B0082 -33.73%, #B3AEF3 108.63%);
  overflow: hidden;
} */

.jr-promo-left {
  flex: 1 1 0;
  min-width: 0;
}


.jr-promo-left picture,
.jr-promo-left img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}


.jr-promo-left .jr-promo-img--mobile { display: none; }
.jr-promo-left .jr-promo-img--mobile-sm { display: none; }

@media (max-width: 895px) {
  .jr-promo-left .jr-promo-img--desktop { display: none; }
  .jr-promo-left .jr-promo-img--mobile { display: block; }
  .jr-promo-right {
    border-radius: 53px;
  }
}


@media (max-width: 765px) {
  .jr-promo-left .jr-promo-img--mobile { display: none; }
  .jr-promo-left .jr-promo-img--mobile-sm { display: block; }
}


.jr-promo-right {
  flex: 1 1 0;
  border-radius: 68px;
  background: #E1DDFC;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
  padding: 60px;
  margin-top: 13.5%;
  margin-left: -8px;
}

.jr-promo-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  color: #4B0082;
  line-height: 58px;
  letter-spacing: 0.56px;
  text-transform: uppercase;
  margin: 0;
  padding-left: 90px;
}

.jr-promo-title-hl {
  color: #9747FF;
}

.jr-promo-text {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 24px;
  font-weight: 600;
  color: #4B0082;
  line-height: 36px;
  letter-spacing: -0.456px;
  padding-left: 90px;
  padding-top: 16px;
  padding-bottom: 96px;
}

.jr-promo-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 24px 48px;
  margin-left: 90px;
  border-radius: 100px;
  background: var(--color-primary-white);
  backdrop-filter: blur(30px);
  -webkit-backdrop-filter: blur(30px);
  color: var(--color-violet-main);
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-decoration: none;
  align-self: flex-start;
  transition: opacity 0.2s;
}
.jr-promo-btn:hover { opacity: 0.9; }
.jr-promo-new-img {
  width: 100%;
  height: auto;
  display: block;
}
.jr-promo-new-img--1024,
.jr-promo-new-img--768,
.jr-promo-new-img--390 {
  display: none;
}
@media (max-width: 1170px) and (min-width: 1001px) {
  .jr-promo-new-img--desktop { display: none; }
  .jr-promo-new-img--1024 { display: block; }
}

@media (max-width: 1000px) and (min-width: 692px) {
  .jr-promo-new-img--desktop { display: none; }
  .jr-promo-new-img--768 { display: block; }
}

@media (max-width: 691px) {
  .jr-promo-new-img--desktop { display: none; }
  .jr-promo-new-img--390 { display: block; }


}

.jr-promo-new .jr-promo-new-btn {
  position: absolute;
  left: 58%;
  top: 68%;
  margin-left: 0;
  align-self: auto;
}
.jr-promo-new-btn-label { display: none; }
@media (max-width: 691px) {
  .jr-promo-new-btn-label { display: inline; }
  .jr-promo-new .jr-promo-new-btn {
    left: 50%;
    top: auto;
    bottom: 3%;
    transform: translateX(-50%);
  } 
}


/* ── Блог ── */
.jr-blog {
  position: relative;
  overflow: hidden;
  border-radius: 68px;
  margin: 0 16px 24px;
  padding: 60px 80px 60px;
  background: linear-gradient(90deg, #4B0082 -33.73%, #B3AEF3 108.63%);
  /* Safari: overflow-клип с border-radius слетает из-за backdrop-filter
     дочерних .jr-blog-stripe / mix-blend-mode у .glow-spot. */
  -webkit-mask-image: -webkit-radial-gradient(white, black);
  mask-image: radial-gradient(white, black);
}

.jr-blog-stripes {
  position: absolute;
  inset: 0;
  display: flex;
  pointer-events: none;
  z-index: 0;
}

.jr-blog-stripe {
  width: 66.7px;
  flex-shrink: 0;
  background: linear-gradient(270deg, rgba(255,255,255,0.04) 0%, rgba(0,0,0,0.06) 39.4%, rgba(255,255,255,0.04) 100%);
  backdrop-filter: blur(90px);
}

.jr-blog-inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 32px;
  width: 100%;
}

.jr-blog-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.jr-blog-header-text {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.jr-blog-subtitle {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  color: #fff;
  line-height: 28px;
  letter-spacing: -0.38px;
  margin: 0;
}

.jr-blog-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  font-style: normal;
  color: #fff;
  line-height: 58px;
  letter-spacing: 0.56px;
  text-transform: uppercase;
  margin: 0;
}

.jr-blog-nav {
  display: flex;
  gap: 12px;
}

.jr-blog-nav-btn {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--color-primary-white);
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.2s;
}
.jr-blog-nav-btn:hover { background: var(--color-violet-bg); }

.jr-blog-track-wrap {
  overflow: hidden;
}

.jr-blog-track {
  display: flex;
  gap: 24px;
  transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
}

.jr-blog-card {
  flex: 0 0 760px;
  display: flex;
  height: 320px;
  text-decoration: none;
  cursor: pointer;

}

.jr-blog-card-body {
  flex: 1 1 0;
  padding: 36px 40px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
  background: #fff;
  border-radius: 32px;
}

.jr-blog-card-tag {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: #4B0082;
}

.jr-blog-card-title {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 24px;
  font-weight: 700;
  color: #4B0082;
  line-height: 1.35;
  margin: 0;
}

.jr-blog-card-desc {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  font-weight: 400;
    color: #4B0082;
  line-height: 24px;
  margin: 0;
}

.jr-blog-card-img {
  flex: 0 0 280px;
  background-size: cover;
  background-position: center;
  background-color: #E1DDFC;
  border-radius: 32px;
}

.jr-blog-footer {
  display: flex;
  justify-content: center;
}

.jr-blog-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  height: 72px;
  padding: 0 48px;
  border-radius: 100px;
  background: rgba(255,255,255,0.90);
  backdrop-filter: blur(30px);
  color: var(--color-violet-main);
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-decoration: none;
  transition: background 0.2s;
}
.jr-blog-btn:hover { background: var(--color-primary-white); }

.jr-blog-dots { display: none; }

/* ── FAQ ── */
.jr-faq {
  background: #F5F5F5;
  border-radius: 68px;
  margin: 0 16px 24px;
  padding: 80px 100px;
}

.jr-faq-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  font-style: normal;
  color: #4B0082;
  line-height: 58px;
  letter-spacing: 0.56px;
  text-transform: uppercase;
  text-align: left;
  margin: 0 0 40px;
}

.jr-faq-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.jr-faq-item {
  background: #fff;
  border-radius: 20px;
  border: 1px solid rgba(75, 0, 130, 0.10);
  overflow: hidden;
}

.jr-faq-q {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 28px 32px;
  background: none;
  border: none;
  cursor: pointer;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: #4B0082;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-align: left;
}

.jr-faq-icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  font-weight: 300;
  color: #4B0082;
  line-height: 1;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.jr-faq-q:hover .jr-faq-icon {
  transform: rotate(90deg);
}

.jr-faq-icon::before { content: '+'; }
.jr-faq-q[aria-expanded="true"] .jr-faq-icon::before { content: '—'; }
.jr-faq-q[aria-expanded="true"] .jr-faq-icon { transform: none; }

.jr-faq-a {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.jr-faq-a.open {
  grid-template-rows: 1fr;
}

.jr-faq-a-inner {
  overflow: hidden;
}

.jr-faq-a p {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #4B0082;
  line-height: 24px;
  letter-spacing: -0.304px;
  margin: 0;
  padding: 0 32px 28px;
}

/* ════════════════════════════════════════
   FOR MIDDLE PAGE  (md- prefix)
   ════════════════════════════════════════ */

.md-gold { color: #FFCA70; }

/* ── Hero ── */
.md-hero {
  position: relative;
  overflow: hidden;
  border-radius: 64px;
  margin: 0 0 16px;
  background: linear-gradient(90deg, #4B0082 -33.73%, #B3AEF3 108.63%);
  height: 614px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* Safari: overflow-клип с border-radius слетает из-за backdrop-filter
     дочерних .md-hero-stripe / mix-blend-mode у .glow-spot. */
  -webkit-mask-image: -webkit-radial-gradient(white, black);
  mask-image: radial-gradient(white, black);
}

.md-hero-stripes {
  position: absolute;
  inset: 0;
  display: flex;
  pointer-events: none;
  z-index: 0;
}

.md-hero-stripe {
  width: 66.7px;
  flex-shrink: 0;
  background: linear-gradient(270deg, rgba(255,255,255,0.04) 0%, rgba(0,0,0,0.06) 39.4%, rgba(255,255,255,0.04) 100%);
  backdrop-filter: blur(90px);
}

.md-hero-inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 80px 79px 40px;
  flex: 1;
  gap: 40px;
}

.md-hero-text {
  flex: 0 0 560px;
  display: flex;
  flex-direction: column;
  /* gap: 24px; */
}

.md-hero-title {
  font-family: 'Onder', sans-serif;
  font-size: 32px;
  font-weight: 500;
  color: var(--white, #FFF);
  text-shadow: 0 4px 53.7px rgba(97, 70, 94, 0.10);
  line-height: 64px;
  letter-spacing: 0.64px;
  text-transform: uppercase;
  margin: 0;
  animation: jrHeroTitleIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) both;
  padding-bottom: 16px;
}

.md-hero-desc {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 400;
  color: var(--white, #FFF);
  text-shadow: 0 4px 53.7px #61465E;
  line-height: 28px;
  letter-spacing: -0.38px;
  margin: 0;
  padding-bottom: 48px;
}

.md-hero-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 36px;
  height: 72px;
  border-radius: 100px;
  background: var(--color-primary-white);
  backdrop-filter: blur(30px);
  color: var(--color-violet-main);
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-decoration: none;
  transition: opacity 0.2s;
  align-self: flex-start;
}
.md-hero-btn:hover { opacity: 0.9; }

.md-hero-img {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 45%;
  pointer-events: none;
}
.md-hero-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left top;
  display: block;
}


@media (max-width: 1400px) {
  .storis-card[data-card="2"] .storis-step-item {
    width: 76%;
  }
  .storis-c3-b1 {
    top: 263px;
    left: 5px;
  }
  .storis-c3-b2 {
    top: 297px;
    right: 64px;
  }
  .storis-c3-b3 {
    top: 454px;
    left: 44px;
  }
  .jr-path-cards .card {
    padding: 24px;
  }
}

@media (max-width: 1355px) {
  .md-hero-inner {
    padding: 60px 60px 40px;
  }
  .md-hero-img {
    width: 54%;
    top: 14%;
  }
}


.md-hero-features {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-radius: 0 0 64px 64px;
  border: 1px solid rgba(255, 255, 255, 0.50);
  background: rgba(66, 48, 80, 0.35);
  backdrop-filter: blur(30px);
  overflow: hidden;
  animation: jrHeroTitleIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both;
}

.md-hero-feature {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  padding: 20px 32px;
  border-right: 1px solid rgba(255,255,255,0.12);
}

.md-hero-feature svg { flex-shrink: 0; }
.md-hero-feature:last-child { border-right: none; }


@media (max-width: 1217px) {
  .md-effect-title span {
    white-space: normal !important;
  }
}

@media (max-width: 1200px) {
 .jr-blog-title{
    font-size: 24px;
    line-height:48px;
    letter-spacing: 2%;
 }
 .jr-blog-card-body {
    padding: 48px;
    height: 300px;
  }
.jr-blog-card-img {
    height: 300px;
  }
.jr-blog-card-tag {
  padding-bottom: 16px;
}

}
@media (max-width: 960px) {
    .md-hero-img {
        width: 47%;
        top: 29%;
    }
  }
@media (max-width: 900px) {
  .md-hero {
    height: auto;
  }
  .md-hero-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 200%;
    letter-spacing: 0.4px;
  }
  .md-hero-img {
    width: 47%;
    top: 154px;
  }
  .md-hero-features {
    grid-template-columns: repeat(2, 1fr);
  }
  .md-hero-feature:nth-child(2n) {
    border-right: none;
  }
  .md-hero-feature:nth-child(-n+2) {
    border-bottom: 1px solid rgba(255,255,255,0.12);
  }
}


.md-hero-feature-label {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: #FFF;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-align: center;
  animation: jrHeroTitleIn 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.4s both;
}

.md-hero-feature-note {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #E1DDFC;
  line-height: 20px;
  letter-spacing: -0.304px;
  text-align: center;
  animation: jrHeroTitleIn 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.5s both;
}

@media (max-width: 680px) {
     .jr-hero-img {
        top: 21%;
        width: 80%;
  }
  .md-hero {
    margin: 0 8px 16px;
    border-radius: 32px;
    min-height: auto;
  }
  .md-hero-features {
    border-radius: 0;
  }
  .md-hero-inner {
    flex-direction: column;
    align-items: stretch;
    padding: 32px 24px 0;
    gap: 0;
  }
  .md-hero-text {
    flex: none;
    width: 100%;
    gap: 16px;
    position: relative;
    z-index: 2;
  }
  .md-hero-title {
    font-size: 13px;
    line-height: 1.5;
    letter-spacing: 0;
  }
  .md-hero-title br {
    display: none;
  }
  .md-hero-desc {
    font-size: 16px;
    line-height: 1.4;
  }
  .md-hero-btn {
    align-self: center;
    margin-top: 295px;
    margin-bottom: 20px;
  }
  .md-hero-img {
    position: absolute;
    left: 0;
    right: 0;
    top: 25%;
    bottom: auto;
    width: 100%;
    height: 80%;
    z-index: 1;
  }
  .md-hero-img img {
    object-position: center top;
  }
  .md-hero-feature-label {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 600;
    font-size: 14px;
    line-height: 135%;
    letter-spacing: -0.266px;
    text-align: center;
  }
  .md-hero-feature-note {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 135%;
    letter-spacing: -0.228px;
    text-align: center;
  }
}


/* ── Слайдер ── */
.md-slider {
  display: flex;
  border-radius: 68px;
  overflow: hidden;
  margin: 0 16px 24px;
  min-height: 700px;
}

.md-slider-left {
  flex: 0 0 740px;
  background: linear-gradient(90deg, #4B0082 -33.73%, #B3AEF3 108.63%);
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 60px;
}

.md-slider-tiles {
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    90deg,
    transparent,
    transparent 119px,
    rgba(255,255,255,0.06) 119px,
    rgba(255,255,255,0.06) 120px
  ),
  repeating-linear-gradient(
    0deg,
    transparent,
    transparent 119px,
    rgba(255,255,255,0.06) 119px,
    rgba(255,255,255,0.06) 120px
  );
  pointer-events: none;
  z-index: 0;
}

.md-slider-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.md-slider-eyebrow {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #FFCA70;
  letter-spacing: 0.32px;
  text-transform: uppercase;
}

.md-slider-title {
  font-family: 'Onder', sans-serif;
  font-size: 40px;
  font-weight: 500;
  color: #fff;
  line-height: 1.2;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  margin: 0;
}

.md-slider-note {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: rgba(255,255,255,0.70);
  line-height: 26px;
  margin: 0;
}

.md-slider-right {
  flex: 1 1 0;
  background: #E1DDFC;
  overflow: hidden;
  position: relative;
}

.md-slider-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ── История ── */
.md-story {
  display: flex;
  gap: 40px;
  background: #F5F5F5;
  border-radius: 68px;
  margin: 0 16px 24px;
  padding: 80px 100px;
  align-items: flex-start;
}

.md-story-left {
  flex: 0 0 440px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.md-story-person {
  display: flex;
  align-items: center;
  gap: 20px;
}

.md-story-photo {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  object-fit: cover;
}

.md-story-label {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.md-story-name {
  font-family: 'Onder', sans-serif;
  font-size: 24px;
  font-weight: 500;
  color: #383838;
  text-transform: uppercase;
}

.md-story-age {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 16px;
  color: #6b6b6b;
}

.md-story-facts {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.md-story-fact {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #383838;
  line-height: 26px;
}

.md-story-fact-cont {
  display: block;
  font-weight: 400;
  color: #6b6b6b;
}

.md-story-right {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.md-story-title {
  font-family: 'Onder', sans-serif;
  font-size: 48px;
  font-weight: 500;
  color: #383838;
  line-height: 1.15;
  letter-spacing: 0.96px;
  text-transform: uppercase;
}

.md-story-bubbles {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.md-story-bubble {
  display: inline-flex;
  flex-direction: column;
  background: #fff;
  border-radius: 24px;
  padding: 20px 28px;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #383838;
  box-shadow: 0 2px 16px rgba(0,0,0,0.06);
  align-self: flex-start;
}

.md-story-bubble-label {
  font-size: 14px;
  font-weight: 400;
  color: #6b6b6b;
  margin-bottom: 4px;
}

.md-story-bubble--question {
  background: #FFCA70;
}

/* ── Ваш путь ── */
.md-path {
  position: relative;
  overflow: hidden;
  border-radius: 68px;
  margin: 0 16px 24px;
  padding: 80px 100px;
  background: linear-gradient(90deg, #723E89 0%, #221228 99.01%);
}

.md-path-blob {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 1143px;
  height: 756px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, #ccb054 0%, #ccb054 4%, #452c4a 72%, transparent 100%);
  pointer-events: none;
  z-index: 0;
}

.md-path-stripes {
  position: absolute;
  inset: 0;
  display: flex;
  pointer-events: none;
  z-index: 1;
}

.md-path-stripe {
  width: 66.7px;
  flex-shrink: 0;
  background: linear-gradient(270deg, rgba(255,255,255,0.04) 0%, rgba(0,0,0,0.06) 39.4%, rgba(255,255,255,0.04) 100%);
  backdrop-filter: blur(90px);
}

.md-path-inner {
  position: relative;
  z-index: 2;
}

.md-path-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  color: #fff;
  line-height: 58px;
  letter-spacing: 0.56px;
  text-transform: uppercase;
  text-align: center;
  margin: 0 0 48px;
}

.md-path-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.md-path-card {
  background: #E1DDFC;
  border-radius: 32px;
  padding: 32px;
  min-height: 480px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  position: relative;
  overflow: hidden;
}

.md-path-card-num {
  font-family: 'Onder', sans-serif;
  font-size: 80px;
  font-weight: 500;
  line-height: 150%;
  letter-spacing: 1.6px;
  color: rgba(75,0,130,0.20);
  position: absolute;
  top: 24px;
  left: 32px;
  user-select: none;
}

.md-path-card-body { position: relative; z-index: 1; }

.md-path-card-title {
  font-family: 'Noto Sans', sans-serif;
  font-size: 24px;
  font-weight: 700;
  color: #383838;
  margin: 0 0 12px;
  line-height: 135%;
  letter-spacing: -0.528px;
}

.md-path-card-desc {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: rgba(56,56,56,0.70);
  line-height: 26px;
  letter-spacing: -0.342px;
}

/* ── Стать ментором ── */
.md-become-mentor {
  padding: 80px 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
}

.md-become-mentor-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  color: var(--1t-1, #4B0082);
  line-height: 58px;
  letter-spacing: 0.56px;
  text-transform: uppercase;
  text-align: center;
  margin: 0;
}

.md-mentor-violet {
  color: var(--tex-violet, #9747FF);
}

.md-become-mentor-desc {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 400;
  color: var(--1t-1, #4B0082);
  line-height: 28px;
  letter-spacing: -0.38px;
  text-align: center;
  margin: 0;
}

.md-mentor-cards {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  width: 100%;
  max-width: 1100px;
}

.md-mentor-card {
  flex: 1;
  border-radius: 24px;
  overflow: visible;
  display: flex;
  flex-direction: column;
}

.md-mentor-card--center {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  overflow: hidden;
}

.md-mentor-photo-wrap {
  position: relative;
  width: 100%;
  overflow: visible;
}

.md-mentor-photo {
  width: 340px;
  height: 444px;
  object-fit: cover;
  object-position: top;
  display: block;
  border-radius: 24px 24px 0 0;
}

.md-mentor-name-badge {
  position: absolute;
  bottom: 175px;
  left: 12px;
  display: inline-flex;
  padding: 16px 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  border-radius: 100px;
  background: var(--white, #FFF);
  box-shadow: -4px -4px 35px 0 rgba(169, 151, 255, 0.05), 4px 4px 35px 0 rgba(169, 151, 255, 0.05);
  font-family: 'Nunito Sans', sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: #383838;
}

.md-mentor-card:last-child .md-mentor-name-badge {
  left: auto;
  right: 12px;
}

.md-mentor-card-bottom {
  position: absolute;
  display: flex;
  padding: 20px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 16px;
  background: linear-gradient(90deg, #4B0082 -33.73%, #B3AEF3 108.63%);
  box-shadow: -4px -4px 35px 0 rgba(169, 151, 255, 0.10), 4px 4px 35px 0 rgba(169, 151, 255, 0.10);
}

.md-mentor-card:first-child .md-mentor-card-bottom {
  bottom: 16px;
  left: -103px;
  right: 127px;
  border-radius: 32px 32px 8px 32px;
}

.md-mentor-card:last-child .md-mentor-card-bottom {
  bottom: 16px;
  left: 159px;
  right: -103px;
  border-radius: 32px 32px 32px 8px;
}

.md-mentor-role-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255, 255, 255, 0.15);
  border-radius: 100px;
  padding: 6px 14px;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  align-self: flex-start;
}

.md-mentor-role-tag svg path {
  stroke: #fff;
}

.md-mentor-card:last-child .md-mentor-card-bottom {
  border-radius: 32px 32px 32px 8px;
}

.md-mentor-skills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.md-mentor-skill {
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.30);
  border-radius: 100px;
  padding: 4px 12px;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 13px;
  color: #fff;
}

.md-mentor-center-img {
  width: 335px;
  height: 425px;
  display: block;
  object-fit: cover;
  object-position: top;
}

.md-mentor-center-text {
  font-family: 'Onder', sans-serif;
  font-size: 22px;
  font-weight: 500;
  color: #4B0082;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: 0.44px;
  margin: 0;
  padding: 20px 16px 24px;
}

.md-become-mentor-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 64px;
  padding: 0 40px;
  border-radius: 100px;
  background: linear-gradient(90deg, var(--color-violet-main) -33.73%, var(--color-violet-light) 108.63%);
  box-shadow: -4px -4px 35px 0 rgba(169,151,255,0.05), 4px 4px 35px 0 rgba(169,151,255,0.05);
  color: var(--color-primary-white);
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -0.38px;
  text-decoration: none;
  transition: opacity 0.2s;
}
.md-become-mentor-btn:hover { opacity: 0.9; }

/* ── Лучшие условия ── */
.md-features {
  background: #fff;
  border-radius: 68px;
  margin: 0 16px 24px;
  padding: 80px 100px;
}

.md-features-inner {
  display: flex;
  gap: 60px;
  align-items: flex-start;
}

.md-features-header {
  flex: 0 0 420px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.md-features-eyebrow {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #4B0082;
  letter-spacing: 0.28px;
  text-transform: uppercase;
}

.md-features-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  color: #383838;
  line-height: 1.3;
  letter-spacing: 0.56px;
  text-transform: uppercase;
  margin: 0;
}

.md-features-subtitle {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: rgba(56,56,56,0.70);
  line-height: 26px;
  margin: 0;
}

.md-features-cards {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.md-feature-card {
  background: #F2F1FF;
  border-radius: 32px;
  padding: 36px 40px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.md-feature-badge {
  display: inline-block;
  background: #4B0082;
  color: #fff;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 13px;
  font-weight: 600;
  padding: 4px 14px;
  border-radius: 100px;
  align-self: flex-start;
  letter-spacing: 0.26px;
}

.md-feature-card-title {
  font-family: 'Noto Sans', sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: #383838;
  margin: 0;
  line-height: 1.3;
}

.md-feature-card-desc {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: rgba(56,56,56,0.70);
  line-height: 26px;
  margin: 0;
}

/* ── Блог ── */
.md-blog {
  position: relative;
  overflow: hidden;
  border-radius: 68px;
  margin: 0 16px 24px;
  padding: 80px 100px;
  background: linear-gradient(90deg, #4B0082 -33.73%, #B3AEF3 108.63%);
  display: flex;
  align-items: center;
}

.md-blog-stripes {
  position: absolute;
  inset: 0;
  display: flex;
  pointer-events: none;
  z-index: 0;
}

.md-blog-stripe {
  width: 66.7px;
  flex-shrink: 0;
  background: linear-gradient(270deg, rgba(255,255,255,0.04) 0%, rgba(0,0,0,0.06) 39.4%, rgba(255,255,255,0.04) 100%);
  backdrop-filter: blur(90px);
}

.md-blog-inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 40px;
}

.md-blog-text {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1 1 0;
}

.md-blog-title {
  font-family: 'Onder', sans-serif;
  font-size: 48px;
  font-weight: 500;
  color: #fff;
  line-height: 1.15;
  letter-spacing: 0.96px;
  text-transform: uppercase;
  margin: 0;
}

.md-blog-desc {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: rgba(255,255,255,0.75);
  line-height: 26px;
  margin: 0;
  max-width: 440px;
}

.md-blog-preview {
  flex-shrink: 0;
}

.md-blog-tag {
  display: inline-block;
  background: rgba(255,255,255,0.15);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,0.25);
  color: #fff;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 14px;
  font-weight: 600;
  padding: 8px 20px;
  border-radius: 100px;
}

.md-blog-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 72px;
  padding: 0 48px;
  border-radius: 100px;
  background: rgba(255,255,255,0.15);
  backdrop-filter: blur(30px);
  color: #fff;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid rgba(255,255,255,0.25);
  transition: background 0.2s;
  flex-shrink: 0;
}
.md-blog-btn:hover { background: rgba(255,255,255,0.25); }

/* ── Кросс-промо ── */
.md-promo {
  display: flex;
  border-radius: 68px;
  overflow: hidden;
  margin: 0 16px 24px;
  min-height: 700px;
}

.md-promo-left {
  flex: 0 0 698px;
  background: linear-gradient(90deg, #4B0082 -33.73%, #B3AEF3 108.63%);
  overflow: hidden;
}

.md-promo-left img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.md-promo-right {
  flex: 1 1 0;
  background: #E1DDFC;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
  padding: 60px;
}

.md-promo-title {
  font-family: 'Onder', sans-serif;
  font-size: 48px;
  font-weight: 500;
  color: #383838;
  line-height: 1.15;
  letter-spacing: 0.96px;
  text-transform: uppercase;
  margin: 0;
}

.md-promo-text {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 400;
  color: rgba(56,56,56,0.70);
  line-height: 28px;
  margin: 0;
}

.md-promo-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 72px;
  padding: 0 48px;
  border-radius: 100px;
  background: #4B0082;
  color: #fff;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 600;
  text-decoration: none;
  align-self: flex-start;
  transition: opacity 0.2s;
}
.md-promo-btn:hover { opacity: 0.9; }

/* ── FAQ ── */
.md-faq {
  background: #F5F5F5;
  border-radius: 68px;
  margin: 0 16px 24px;
  padding: 80px 100px;
}

.md-faq-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  color: #383838;
  line-height: 58px;
  letter-spacing: 0.56px;
  text-transform: uppercase;
  text-align: center;
  margin: 0 0 48px;
}

.md-faq-list {
  max-width: 960px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.md-faq-item {
  border-bottom: 1px solid rgba(56,56,56,0.12);
}
.md-faq-item:first-child { border-top: 1px solid rgba(56,56,56,0.12); }

.md-faq-q {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 24px 0;
  background: none;
  border: none;
  cursor: pointer;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: #383838;
  text-align: left;
  line-height: 1.4;
}

.md-faq-icon {
  flex-shrink: 0;
  transition: transform 0.3s ease;
}

.md-faq-q[aria-expanded="true"] .md-faq-icon {
  transform: rotate(180deg);
}

.md-faq-a {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.35s ease, padding 0.35s ease;
}

.md-faq-a.open {
  max-height: 300px;
  padding-bottom: 24px;
}

.md-faq-a p {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: rgba(56,56,56,0.70);
  line-height: 27px;
  margin: 0;
}

/* ── Лучшие условия для эффективности ── */
.md-effect {
  background: #F5F5F5;
  margin: 0 16px 24px;
  border-radius: 68px;
  padding: 80px 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

.md-effect-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 24px;
  border-radius: 16px;
  border: 1px solid var(--1t-2, #B3AEF3);
  background: var(--1t-5, #F2F1FF);
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 28px;
  color: var(--1t-1, #4B0082);
  letter-spacing: -0.38px;
  text-transform: uppercase;
}

@media (max-width: 640px) {
  .md-effect-badge {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 135%;
    letter-spacing: -0.304px;
    vertical-align: middle;
    text-transform: uppercase;
  }
}


.md-effect-title {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  font-style: normal;
  color: #4B0082;
  text-transform: uppercase;
  text-align: center;
  line-height: 58px;
  letter-spacing: 0.56px;
  margin: 0;
}

.md-effect-title em {
  font-family: 'Onder', sans-serif;
  font-size: 28px;
  font-weight: 500;
  font-style: normal;
  color: #9747FF;
  line-height: 58px;
  letter-spacing: 0.56px;
}

@media (max-width: 900px) {
  .md-effect-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 200%;
    letter-spacing: 0.48px;
    text-align: center;
  }
  .md-effect-title em {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 200%;
    letter-spacing: 0.48px;
    text-align: center;
  }
}


@media (max-width: 705px) {
  .md-effect-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 200%;
    letter-spacing: 0.48px;
    text-align: center;
  }
  .md-effect-title em {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 200%;
    letter-spacing: 0.48px;
    text-align: center;
  }
}


@media (max-width: 640px) {
  .md-effect-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 12px;
    line-height: 212%;
    letter-spacing: 0.24px;
    text-align: center;
  }
  .md-effect-title em {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 12px;
    line-height: 212%;
    letter-spacing: 0.24px;
    text-align: center;
  }
}


.md-effect-subtitle {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 20px;
  font-weight: 400;
  color: #4B0082;
  text-align: center;
  line-height: 28px;
  letter-spacing: -0.38px;
  margin: 0;
}

.md-effect-content {
  display: flex;
  width: 100%;
  align-items: center;
  margin-top: 16px;
}

/* .md-effect-img-wrap {
  flex: 1 1 0;
  border-radius: 24px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
} */

.md-effect-img {
  width: 810px;
  height: 664px;
  object-fit: contain;
  display: block;
}

.md-effect-cards {
  display: flex;
  flex-direction: column;
  gap: 16px;
  /* flex: 0 0 320px; */
}

.md-effect-card {
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
  border-radius: 32px;
  background: #fff;
}

.md-effect-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.md-effect-card-icon {
  width: 84px;
  height: 84px;
  flex-shrink: 0;
  border-radius: 16px;
  background: #B3AEF3;
  box-shadow: 0 6px 15px 0 rgba(75, 0, 130, 0.10);
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.md-effect-card-icon svg {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
}

.md-effect-card-badge {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #4B0082;
  background: #F2F1FF;
  border-radius: 100px;
  padding: 4px 14px;
  white-space: nowrap;
}

.md-effect-card-title {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #1E1E1E;
  margin: 0;
  line-height: 1.35;
}

.md-effect-card-desc {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 15px;
  font-weight: 400;
  color: rgba(56,56,56,0.70);
  line-height: 22px;
  margin: 0;
}

@media (max-width: 1360px) {
  .md-effect-content {
    flex-direction: column;
    align-items: stretch;
  }
  .md-effect-img {
    width: 100%;
    height: auto;
  }
  .md-effect-cards {
    flex-direction: row;
  }
  .md-effect-card {
    flex: 1 1 0;
  }
}


@media (max-width: 990px) {
  .md-effect {
    padding: 0;
  }
}


@media (max-width: 640px) {
  .md-effect-cards {
    flex-direction: column;
  }
}

@media (max-width: 1440px) {
  .jr-promo-right {
    flex: 1 1 0;
    border-radius: 61px;
  }
}


@media (max-width: 1431px) {
  /* ── EVENTS ── */
  .events-header { gap: 48px; }
  .events-header h2 {  font-size: 24px; line-height: 44px; }
  .events-header p { font-size: 17px; }
  .event-card { width: calc(33.333% - 11px); flex-shrink: 1; }
  .event-card-image { height: 310px; }
  .event-join-btn svg { width: 20px; height: 20px; }

  .event-card-image { height: 301px; }
}


@media (max-width: 1400px) {
  /* ── МЕНТОРЫ ── */
  .jr-mentors {
    padding: 60px 24px;
    border-radius: 48px;
  }
  .jr-mentors-header {
    margin-bottom: 32px;
  }
  .jr-mentors-subtitle {
    font-size: 16px;
    line-height: 24px;
  }
  .jr-mentors-steps {
    padding: 16px 20px;
    gap: 8px;
    margin-bottom: 32px;
  }
  .jr-mentors-step {
    gap: 12px;
    padding: 12px 16px;
  }
  .jr-mentors-step-icon {
    width: 44px;
    height: 44px;
    padding: 10px;
  }
  .jr-mentors-step-text {
    font-size: 16px;
    line-height: 22px;
  }
  .jr-mentors-carousel {
    margin-left: -24px;
    margin-right: -24px;
  }
  .jr-mentors-cards-viewport {
    padding-left: 24px;
    padding-right: 24px;
  }
  .jr-mentor-card {
    padding: 20px;
    gap: 16px;
    flex: 0 0 calc((100% - 32px) / 3);
  }
  .jr-mentor-photo {
    width: 110px;
    height: 110px;
  }
  .jr-mentor-top {
    gap: 12px;
  }
  .jr-mentor-info {
    min-width: 0;
  }
  .jr-mentor-name {
    font-size: 20px;
  }
  .jr-mentor-occupation {
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
  }
  .jr-mentor-stat {
    white-space: normal;
  }
  .jr-mentor-stat--hl {
    padding: 10px 12px;
    font-size: 14px;
  }
  .jr-mentor-helps {
    padding: 16px;
  }
  .jr-mentor-helps-title {
    font-size: 16px;
  }
  .jr-mentor-helps-list li {
    font-size: 14px;
  }
  .jr-mentors-btn {
    font-size: 16px;
    padding: 20px 40px;
    width: auto;
  }

  /* ── КРОСС-ПРОМО ── */
  .jr-promo-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 28px;
    line-height: 58px;
    letter-spacing: 0.56px;
  }

  /* ── ВАШ ПУТЬ ── */
  .jr-path-card-title {
    font-family: 'Nunito Sans', sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    letter-spacing: -0.38px;
  }
  .path-title-br { display: block; }
  .jr-path-card-desc {
    font-size: 16px;
    line-height: 135%;
    letter-spacing: -0.304px;
  }
}


@media (max-width: 1370px) {
  .jr-promo-right {
    flex: 1 1 0;
    border-radius: 53px;
  }
}


@media (max-width: 1340px) {
  .storis-c1-b1 { left: 71px; top: 255px; right: auto; }
  .storis-c1-b2 { right: 100px; top: 224px; left: auto; }
  .storis-c1-b3 { left: 167px; top: 482px; right: auto; }
  .storis-c1-b4 { right: 61px; top: 406px; left: auto; }
  .storis-step--tr { top: 210px; right: 49px; }
  .storis-step--tl { top: 222px; left: 3px; }
  .storis-step--br { top: 408px; right: 60px; width: 308px; }
  .storis-step--bl { top: 457px; left: 100px; }
  .storis-section {
  padding: 0px;
  }
  .storis-cloud {
  right: 34px;
  }
  .storis-badge-yellow.visible {
  top: 37px;
  }
}


@media (max-width: 1286px) {
  /* .sp-photo { width: 380px; }
  .sp-stage { height: 460px; } */
  /* .sp-text { height: 425px; border-radius: 48px; margin-left: -32px; padding: 32px 44px 24px 60px; } */
  .sp-text h2 { font-size: 20px; line-height: 30px; margin-bottom: 6px; }
  .sp-text h2 em { font-size: 20px; line-height: 34px; }
  .specialists-subtitle { font-size: 14px; line-height: 20px; margin-bottom: 8px; }
  .check-list { gap: 6px; }
  .check-list li { font-size: 14px; line-height: 20px; }
  .check-icon { width: 28px; height: 24px; }
  .spec-more-btn { padding: 12px 28px; font-size: 14px; gap: 12px; margin-top: 12px; }
}


@media (max-width: 1285px) {
  /* ── EVENTS ── */
  .events { padding: 60px 0; }
  /* заголовок: меньше gap */
  .events-header { gap: 32px; margin-bottom: 24px; }
  .events-header h2 { font-size: 22px; line-height: 40px; }
  .events-header p { font-size: 16px; }
  .events-carousel-track { gap: 12px; }
  .event-card-image {border-radius: 24px; }
  .event-card-info { padding: 16px; gap: 12px; border-radius: 24px; }
  .event-card-title { font-size: 17px; line-height: 26px; }
  .event-meta-label { font-size: 13px; }
  .event-meta-value { font-size: 15px; line-height: 22px; }
  .event-promo-title { font-size: 14px; line-height: 26px; }
}


@media (max-width: 1244px) {
  /* ── RESULT ── */
  /* .result-slide.active  {
  display: flex;
  } */
  /* .result-card-image {
  width: 100%
  }  */
  .modal-wrapper {
  width: 100%
  }

  .event-card-image {
  height: 278px;
  }
}


@media (max-width: 1205px) {
  .storis-badge-inline { position: absolute; top: 81px; }
  .storis-result--tr { top: 301px; left: 130px; right: auto; width: fit-content; }
  .storis-result--br { top: 489px; left: 174px; right: auto; width: fit-content; }
  .storis-result--tl { top: 222px; left: 757px; right: auto; width: fit-content; }
  .storis-result--bl { top: 445px; left: 725px; right: auto; width: fit-content; }
}


@media (max-width: 1200px) {
  /* ── ТЕГИ ── */
  .tags-cloud .tag:nth-child(1) { left: 19% !important; top: 54% !important; }
  .tags-cloud .tag:nth-child(2) { left: 69% !important; top: 10% !important; }
  .tags-cloud .tag:nth-child(3) { left: 20% !important; top: 14% !important; }

  /* ── HEADER → BURGER ── */
  .nav { display: none; }
  .burger-btn { display: flex; width: 30px; height: 30px; margin-left: 32px; }
  .burger-btn svg { width: 30px; height: 30px; }
  .header { justify-content: space-between; }
  /* кнопки + бургер прижаты вправо вместе */
  .header-btns { margin-left: auto; }
  /* dropdown на всю ширину экрана (кнопки уже в хедере, в меню не дублируем) */
  .mobile-menu { left: 16px; right: 16px; max-width: none; }
  .mobile-menu-btns { display: none; }

  .cust-form-inputs {  
    display: grid;
    
      grid-template-columns: 1fr 1fr; /* две равные колонки */
      gap: 12px;          
  }
  .input-email {
    grid-column: 1 / -1;
  }
  .cust-form-fields { gap: 12px; }
  .cust-form-input-wrap { flex: 0 1 280px; }
  .result-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: visible;
    justify-content: flex-start;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .result-tabs::-webkit-scrollbar { display: none; }
  .tab-btn { flex-shrink: 0; }
  .result-card { padding: 0; }
  .result-card-image {
    width: 336px;
    border-radius: 26px;
  }


  /* Stats */
  .cust-stat-number--gradient {
  font-family: 'Onder', sans-serif;
  font-weight: 500;
  font-size: 40px;
  line-height: 64px;
  letter-spacing: 0;
  }
  .cust-stat-number--dark {
  font-family: 'Onder', sans-serif;
  font-weight: 500;
  font-size: 28px;
  line-height: 58px;
  letter-spacing: 0.02em;
  }

  /* Hero junior */
  .jr-hero {
    height: 800px;
  }
  .jr-hero-inner {
    padding: 80px 60px 32px;
    gap: 24px;
  }
  .jr-hero-text {
    flex-shrink: 1;
    min-width: 0;
    margin-bottom: 116px;
  }
  .jr-hero-features {
    height: 228px;
  }
  .jr-hero-img {
    top: 13%;
    width: 56%;
  }
  .jr-hero-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 28px;
    line-height: 58px;
    letter-spacing: 0.56px;

  }
  .jr-hero-subtitle {
    font-size: 16px;
    line-height: 22px;
    margin: 0 0 96px;
  }

  /* Hero */
  .hero-title-br { display: block; }
  .cust-hero-title {
  font-family: 'Onder', sans-serif !important;
  font-weight: 500 !important;
  font-size: 32px !important;
  line-height: 64px !important;
  letter-spacing: 0.02em !important;
  }
  .cust-hero-subtitle {
  font-family: 'Nunito Sans', sans-serif !important;
  font-weight: 400 !important;
  font-size: 20px !important;
  line-height: 28px !important;
  letter-spacing: -0.019em !important;
  }

  /* Process carousel */
  .cust-proc { align-items: flex-start; }
  .cust-proc-photo-outer {
    width: 420px;
    height: 700px;
    left: 0;
  }
  .cust-proc-carousel { border-radius: 64px; }
  .cp-slide { top: 0; }
  .cust-proc[data-slide="0"] .cp-slide { background-image: url('../images/customer/slides/slide1_1024.webp') !important; }
  .cust-proc[data-slide="1"] .cp-slide { background-image: url('../images/customer/slides/slide2_1024.webp') !important; }
  .cust-proc[data-slide="2"] .cp-slide { background-image: url('../images/customer/slides/slide3_1024.webp') !important; }
  .cust-proc[data-slide="3"] .cp-slide { background-image: url('../images/customer/slides/slide4_1024.webp') !important; }
  .cust-proc-content {
  height: 657px;
  border-radius: 48px;
  margin-top: 46px;
  }
  .cust-proc[data-slide="3"] .cust-proc-content {
  height: 626px;
  border-radius: 48px;
  margin-top: 67px;
  }
  .cust-proc[data-slide="1"] .cust-proc-content {
  height: 590px;
  margin-top: 79px;
  }
  .cust-proc[data-slide="2"] .cp-slide {
  right: 0px;
  }
  .cust-proc[data-slide="2"] .cust-proc-content {
  height: 613px;
  margin-top: 53px;
  }
  .cp-text {
  padding: 60px 24px 120px 48px;
  align-items: stretch;
  }
  .cp-pagination {
  position: absolute;
  right: auto;
  top: auto;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  flex-direction: row;
  gap: 12px;
  }
  .cp-title {
  font-family: 'Onder', sans-serif;
  font-weight: 500;
  font-size: 20px;
  line-height: 1.35;
  letter-spacing: 0.02em;
  white-space: nowrap;
  }
  .cp-gold {
  font-family: 'Onder', sans-serif;
  font-weight: 500;
  font-size: 20px;
  line-height: 1.35;
  letter-spacing: 0.02em;
  }
  .cp-row {
  font-family: 'Nunito Sans', sans-serif;
  font-weight: 600;
  font-size: 24px;
  line-height: 36px;
  letter-spacing: -0.019em;
  vertical-align: middle;
  }
  .cp-row u {
  font-family: 'Nunito Sans', sans-serif;
  font-weight: 600;
  font-size: 24px;
  line-height: 36px;
  letter-spacing: -0.019em;
  vertical-align: middle;
  text-decoration: none;
  }
  .cp-who {
  font-family: 'Onder', sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 32px;
  letter-spacing: 0.02em;
  vertical-align: middle;
  }
  .sp-unit .sp-text {
    padding: 43px 64px 64px 54px;
  }
  .sp-unit:nth-child(3) .sp-text {
    padding: 43px 64px 64px 41px;
  }
}


@media (max-width: 1183px) {
  .event-card-image {
  height: 265px;
  }
  .event-promo-title {
  font-size: 13px
  };
}


@media (max-width: 1181px) {
  .storis-badge-inline { left: 663px; top: 77px; }
  .storis-result--tr { top: 239px; left: 25px; }
  .storis-result--br { left: 78px; }
  .storis-result--tl { top: 206px; left: 672px; }
  .storis-result--bl { top: 432px; left: 630px; }
}


@media (max-width: 1170px) and (min-width: 1001px) {
  .sp-unit:nth-child(1) .sp-text,
  .sp-unit:nth-child(2) .sp-text,
  .sp-unit:nth-child(3) .sp-text {
    padding-bottom: 100px;
  }
  .spec-pagination {
    position: absolute;
    bottom: 3%;
    left: 70%;
    top: auto;
    right: auto;
    transform: translateX(-50%);
    flex-direction: row;
    width: auto;
    gap: 12px;
  }

  /* ── Новые слайды: адаптированные изображения под более узкий экран ── */
  .sp-slide-img--desktop { display: none; }
  .sp-slide-img--1024 { display: block; }
  .sp-stage {
    flex: 1 1 0;
    width: auto;
    height: auto;
    aspect-ratio: 1.2865;
  }
  .sp-unit:nth-child(1) .spec-more-overlay.spec-more-btn,
  .sp-unit:nth-child(2) .spec-more-overlay.spec-more-btn,
  .sp-unit:nth-child(3) .spec-more-overlay.spec-more-btn {
    top: auto;
    left: 51%;
    right: 60px;
    bottom: 60px;
    width: auto;
    justify-content: center;
  }
}


@media (max-width: 1138px) {
  .event-card-image {
  height: 245px;
  }
}


@media (max-width: 1110px) {
  /* ── ОТЗЫВЫ НОВИЧКОВ — mobile carousel ── */
  .jr-reviews-viewport {
    overflow: hidden;
    touch-action: pan-y;
  }
  /* .jr-reviews-circles {
    justify-content: flex-start;
    gap: 16px;
    transition: transform 0.4s ease;
  } */
  .jr-review-item {
    flex: 0 0 auto;
  }
  .jr-review-circle-wrap {
    width: 220px;
    height: 220px;
  }
  .jr-reviews-dots {
    display: flex;
    margin-top: 24px;
  }
}


@media (max-width: 1100px) {
  .storis-badge-inline { left: 587px; top: 73px; }
  .storis-result--tr { top: 239px; left: 3px; }
  .storis-result--tl { top: 206px; left: 585px; }
  .storis-result--bl { top: 432px; left: 557px; }

  .cust-footer { padding: 48px 40px 36px; }
  .cust-footer-phone { font-size: 24px; }
}


@media (max-width: 1090px) {
  .spec-pagination {
    left: 71%;
  }
  .sp-unit:nth-child(1).active ~ .spec-pagination { bottom: 6%; }
  .sp-unit:nth-child(2).active ~ .spec-pagination { bottom: 5%; }
  .sp-unit:nth-child(3).active ~ .spec-pagination { bottom: 3%; }

  .jr-hero-img {
    top: 37%;
    width: 61%;
  }
.jr-hero-img {
  top: 29%;
  width: 50%;
  }
}


@media (max-width: 1060px) {
  .event-card-image {
  height: 220px;
  }
}


/* Отдельно от мобильной раскладки STORIS (она начинается с 990px и ниже,
   там своя схема позиционирования .storis-photo) — этот отступ только
   для десктопной sticky-раскладки на узких десктопах/планшетах. */
@media (min-width: 991px) and (max-width: 1024px) {
  .storis-photo { padding-bottom: 9%; }
}


@media (max-width: 1024px) {

  .jr-promo-right {
    margin-top: 0;
    margin-left: 0;
    border-radius: 43px;
  }
  .jr-promo-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 28px;
    line-height: 58px;
    letter-spacing: 0.56px;
  }
  .jr-promo-text {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 600;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: -0.456px;
  }

  /* ── HEADER ── */
  .header { padding: 12px 20px; }
  .nav { gap: 16px; }
  .nav a { font-size: 13px; }
  .btn-purple, .btn-outline-white { font-size: 13px; padding: 12px 18px; }

  /* ── HERO ── */
  .hero {
  padding: 100px 48px;
  min-height: auto;
  gap: 24px;
  border-radius: 40px;
  }
  .hero-content { max-width: 868px; }
  .hero-content h1 { font-size: 26px; line-height: 58px; margin-bottom: 32px; }
  .hero-content h1 span { white-space: nowrap !important; }
  .hero-content p { font-size: 17px; line-height: 28px; width: 868px; max-width: 100%; margin-bottom: 32px; }
  .hero-btns { margin-top: 0; }
  .btn-ghost { height: 60px; font-size: 17px; padding: 0 24px; }

  /* ── STATS ── */
  .stats {         padding: 100px 60px 32px; justify-content: space-around; }

  /* ── PLATFORM ── */
  .platform .section-title { font-size: 26px; }
  .platform .section-title em { font-size: 26px; }
  /* .stat-number-gradient { font-size: 44px; }
  .stat-number { font-size: 26px; }
  .stat-label { font-size: 16px; line-height: 28px; white-space: normal; max-width: 200px; } */

  /* ── SPECIALISTS ── */
  .sp-text { border-radius: 40px; padding: 40px 48px 24px 48px; }
  .sp-text h2,.sp-text h2 em  { font-size: 18px; line-height: 30px; margin-bottom: 6px; }
  .specialists-subtitle { font-size: 16px; line-height: 20px; margin-bottom: 12px; }
  .check-list { gap: 8px; }
  .check-list li { font-size: 16px; line-height: 20px; }
  .check-icon { width: 28px; height: 24px; }
  .spec-more-btn { padding: 14px 28px; font-size: 15px; gap: 12px; margin-top: 16px; }

  /* ── PLATFORM ── */
  .platform { padding: 110px 40px; }
  .tags-cloud { gap: 12px; }

  /* ── DEVELOPMENT ── */
  .development { padding: 100px 40px 0; gap: 40px; }
  .development-right { width: 460px; }
  .dev-card { width: 460px; }
  .dev-card-image { height: 250px; }
  .dev-strela { width: 280px; height: 240px; }

  /* ── EVENTS ── */
  .events { padding: 60px 0; }
  /* заголовок: меньше gap */
  .events-header { gap: 32px; margin-bottom: 24px; }
  .events-header h2 { font-size: 22px; line-height: 40px; }
  .events-header p { font-size: 16px; }
  .events-carousel-track { gap: 12px; }
  .event-card-image { height: 312px; border-radius: 32px; }
  .event-card-info { padding: 16px; gap: 12px; border-radius: 24px; }
  .event-card-title { font-size: 17px; line-height: 26px; }
  .event-meta-label { font-size: 13px; }
  .event-meta-value { font-size: 15px; line-height: 22px; }
  .event-promo-card { flex: 0 0 412px; border-radius: 24px; }

  /* ── PATH ── */
  .path-block { padding: 60px 40px; border-radius: 48px; }
  .path-col { width: 290px; }
  .path-step-label { font-size: 16px; line-height: 28px; }
  .path-role-badge span { font-size: 18px; }
  .path-arrows-row { padding: 0 91px; }
  .path-stages { width: 320px; }
  .path-stage-title { font-size: 18px; }
  .path-stage-desc { font-size: 16px; }

  /* ── COOPERATION ── */
  .coop-block { padding: 48px 60px; border-radius: 40px; }
  .coop-header h2 { font-size: 24px; line-height: 44px; }
  .coop-input { padding: 24px; font-size: 17px; }
  .coop-phone-code-btn { padding: 24px 16px; font-size: 17px; }

  /* ── FOOTER ── */
  .footer-block { padding: 48px 60px; border-radius: 48px; }
  .footer-nav { flex: 0 0 320px; gap: 28px; }
  .footer-contact { flex: 0 0 220px; }
  .footer-socials { flex: 0 0 auto; }
  .footer-phone { font-size: 20px; }
  .footer-email { font-size: 14px; }
  .footer-nav-col a { font-size: 14px; }
  .footer-legal { font-size: 14px; }
  .footer-legal a { font-size: 14px; }
  .footer-copy { font-size: 14px; }
}


@media (max-width: 1000px) {
  /* ── RESULT card → column ── */
  .result-card {
    flex-direction: column;
    height: auto;
    border-radius: 24px;
    padding: 12px;
    gap: 12px;
  }
  .result-slide.active { flex-direction: column; }
  .result-card-image { width: 100%; }
  .result-card-review { padding: 12px 24px 56px; gap: 20px; margin-top: -32px; position: relative; z-index: 1; }
  .result-card-pagination { position: absolute; top: auto; bottom: 24px; left: 50%; right: auto; transform: translateX(-50%); flex-direction: row; justify-content: center; z-index: 2; }
  .result-card-text h4 {
    flex-shrink: 0;
    max-height: 56px;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.4) transparent;
  }
  .result-card-text h4::-webkit-scrollbar { width: 4px; }
  .result-card-text h4::-webkit-scrollbar-track { background: transparent; }
  .result-card-text h4::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.4); border-radius: 4px; }

  /* ── RESULT TABS ── */
  .result-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: visible;
    justify-content: flex-start;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .result-tabs::-webkit-scrollbar { display: none; }
  .tab-btn { flex-shrink: 0; }

  /* ── STATS ── */
  .stat-number-gradient {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 48px;
    line-height: 135%;
    letter-spacing: 0.02em;
  }
  .stat-number:not(.stat-number-gradient) {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 135%;
    letter-spacing: 0.02em;
  }

  /* ── PATH ── */
  .path-arrows-row { display: none; }

  .footer-block {
  padding: 40px;
  }
  .development { padding: 96px 0; flex-direction: column; }
  .development-left { width: 100%; position: static; top: auto; }
  .development-right { width: 100%;  }
  .dev-card { width: 100%; height: auto; }
  .dev-strela { display: none; }
  .development-left h2 { font-size: 24px; }
  .development-left h2 em { font-size: 24px; }
  .events-header h2 { font-size: 18px; }
  .path-stages-wrap {
  flex: none;
  width: 100%;
  }
}


@media (max-width: 990px) {
  .md-hero-feature { padding: 20px; }
  /* .header-btns { display: none; } */
  .logo-soyuz img { width: 159px; height: 24px; }
  /* кнопки снова показываем в меню, т.к. в хедере их нет */
  /* .mobile-menu { left: 16px; right: 16px; max-width: 358px; } */
  /* .mobile-menu-btns { display: flex; } */
    .jr-reviews-circles {
    justify-content: flex-start;
    gap: 16px;
    transition: transform 0.4s ease;
  }

  /* ── HERO ── */
  .hero-content h1 { font-size: 24px; }
  .jr-hero {
    height: auto;
  }
  .jr-hero-title {
    font-size: 20px;
    line-height: 200%;
    letter-spacing: 0.4px;
  }
  .jr-hero-subtitle {
    font-size: 20px;
    line-height: 28px;
    letter-spacing: -0.38px;
    max-width: 240px;
  }
  .jr-hero-features {
    grid-template-columns: repeat(2, 1fr);
    height: auto;
  }

  .jr-hero-feature:nth-child(-n+2) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }

  /* ── STORIS ── */
  .storis-wrapper { margin-top: 80px; height: auto !important; }
  .storis-section {
    position: relative;
    top: auto;
    padding: 24px 16px;
    gap: 20px;
  }
  .storis-cards-container {
    width: 100%;
    height: clamp(380px, 58vh, 700px);
    border-radius: 16px;
  }
  .storis-card { border-radius: 16px; overflow: hidden; }
  .storis-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 212%;
    letter-spacing: 0.02em;
    text-align: center;
    top: 0;
    left: 16px;
    right: 16px;
    margin-bottom: 32px;
  }
  .storis-photo {
    top: 70px;
    bottom: 0;

    left: 0;
    right: 0;
    transform: none;
    width: 100%;
    object-fit: contain;
    object-position: top center;
  }
  .storis-c0-problem {
    left: 16px;
    right: 16px;
    top: 68px;
    gap: 8px;
    max-width: none;
    align-items: center;
    text-align: center;
    z-index: 2;
  }
  .storis-problem-label {
    font-size: 14px;
    line-height: 20px;
    max-width: none;
    text-align: center;
  }
  .storis-problem-text {
    font-size: 13px;
    line-height: 18px;
    max-width: none;
    text-align: center;
  }
  .storis-badge-yellow {
    font-size: 14px;
    padding: 10px 14px;
    white-space: normal;
    max-width: none;
    width: 100%;
    text-align: center;
    justify-content: center;
    transform: rotate(-2deg);
    box-sizing: border-box;
  }
  .storis-cloud--desktop { display: none; }
  .storis-cloud--mobile {
    display: block;
    left: 55%;
    right: auto;
    transform: none;
    top: 358px;
    width: 220px;
    height: auto;
    z-index: 2;
  }
  .storis-bubble {
    white-space: nowrap;
    height: auto;
    min-height: 44px;
    padding: 8px 12px;
    font-size: 13px;
    width: max-content !important;
    max-width: calc(100% - 32px) !important;
  }
  .storis-c1-b1 { top: 284px; padding: 8px 12px; left: 30%; right: auto; transform: none; }
  .storis-c1-b2 { top: 347px; padding: 8px 12px; left: 30%; right: auto; transform: none; }
  .storis-c1-b3 { top: 410px; padding: 8px 12px; left: 30%; right: auto; transform: none; }
  .storis-c1-b4 { top: 473px; padding: 8px 12px; left: 30%; right: auto; transform: none; }
  .storis-step-item {
    min-height: 54px;
    padding: 12px 14px;
    gap: 10px;
    font-size: 13px;
    line-height: 18px;
    width: fit-content;
    max-width: calc(100% - 44px);
    left: 34% !important;
    right: auto !important;
    transform: translateX(-50%);
    box-sizing: border-box;
    border-radius: 24px 24px 4px 24px;
    top: 25px;
    margin-top: 72px;
  }
  .storis-step-item > span:last-child { max-width: none; font-size: 13px; }
  .storis-step-num { min-width: auto; }
  .storis-step-num svg { width: auto; height: 29px; opacity: 1; }
  .storis-step--tl { top: 299px; }
  .storis-step--tr { top: 359px; }
  .storis-step--bl { top: 422px; }
  .storis-step--br { top: 483px; }
  .storis-step--tl > span:last-child,
  .storis-step--tr > span:last-child,
  .storis-step--bl > span:last-child,
  .storis-step--br > span:last-child,
  .storis-step--tl > span:last-child u,
  .storis-step--tr > span:last-child u,
  .storis-step--bl > span:last-child u,
  .storis-step--br > span:last-child u {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 600;
    font-size: 12px;
    line-height: 135%;
    letter-spacing: -0.019em;
  }
  .storis-result {
    white-space: normal;
    height: auto;
    line-height: 22px;
    font-size: 13px;
    padding: 10px 14px;
    display: block;
  }
  .storis-result--tr,
  .storis-result--br,
  .storis-result--tl,
  .storis-result--bl { width: fit-content; max-width: calc(100% - 25px); left: 50%; right: auto; transform: translateX(-50%); border-radius: 24px 24px 4px 24px; }
  .storis-result--tr { top: 303px; white-space: nowrap; }
  .storis-result--tl { top: 362px; }
  .storis-result--br { top: 420px; }
  .storis-result--bl { top: 476px; white-space: nowrap; padding-right: 3px; }
  .storis-badge-inline {
    left: auto;
    right: 26%;
    top: 8%;
    width: auto;
    height: auto;
    font-size: 13px;
    padding: 8px 12px;
  }

  .jr-teams-subtitle {
    max-width: 556px;
  }
  .jr-teams-bg-img--2 {
    right: -286.261px;
    transform: rotate(-29deg);
  }

  .storis-card[data-card="1"] .storis-step--bl {
    width: 416px;
  }

  .storis-card[data-card="1"] .storis-step-item,
  .storis-card[data-card="2"] .storis-step-item {
    line-height: 18px;
  }
  .storis-c3-b2 .storis-leader-bubble {
    border-radius: 32px 32px 8px 32px;
  }

  /* ── МЕНТОРЫ — mobile ── */
  .jr-mentors {
    border-radius: 32px;
    padding: 40px 16px;
    margin: 0 8px 16px;
  }
  .jr-mentors-header {
    margin-bottom: 24px;
  }
  .jr-mentors-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 28px;
    line-height: 58px;
    letter-spacing: 0.02em;
    text-align: center;
  }
  .jr-mentors-subtitle {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 135%;
    letter-spacing: -0.019em;
    text-align: center;
  }
  .jr-mentors-steps {
    flex-wrap: nowrap;
    padding: 12px 12px;
    gap: 4px;
    margin-bottom: 24px;
  }
  .jr-mentors-step {
    gap: 8px;
    padding: 8px;
    flex: 1 1 0;
  }
  .jr-mentors-step-icon {
    width: 36px;
    height: 36px;
    padding: 8px;
    flex-shrink: 0;
  }
  .jr-mentors-step-text {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 135%;
    letter-spacing: -0.019em;
  }
  .jr-mentors-step-arrow {
    width: 37.51px;
    flex-shrink: 0;
  }
  .jr-mentors-carousel {
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 24px;
  }
  .jr-mentors-cards-viewport {
    padding-left: 0;
    padding-right: 0;
  }
  .jr-mentor-card {
    flex: 0 0 100%;
    box-sizing: border-box;
    padding: 20px;
    gap: 16px;
  }
  .jr-mentor-photo {
    width: 100px;
    height: 100px;
  }
  .jr-mentor-name {
    font-size: 20px;
  }
  .jr-mentors-btn {
    width: 100%;
    box-sizing: border-box;
  }

  /* ── ВАШ ПУТЬ — mobile ── */
  .jr-path {
    border-radius: 32px;
    padding: 40px 16px;
    margin: 0 8px 16px;
  }
  .jr-path-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 28px;
    line-height: 58px;
    letter-spacing: 2%;
    text-align: center;
    margin-bottom: 24px;
  }
  .jr-path-cards {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .jr-path-cards .card {
    flex-direction: row;
    align-items: center;
    min-height: auto;
    padding: 0 24px 0 0;
    border-radius: 24px;
    overflow: hidden;
  }
  .jr-path-card-decor {
    position: relative;
    flex-shrink: 0;
    width: 140px;
    height: 140px;
    overflow: hidden;
  }
  .jr-path-card-decor svg {
    width: 140px;
    height: auto;
    margin-top: -10px;
    margin-left: -20px;
  }
  .jr-path-card-num {
    left: 9px;
    font-size: 47px;
  }
  .jr-path-card-body {
    flex: 1;
    padding: 16px 0;
  }
  .jr-path-card-title {
    font-size: 16px;
    line-height: 1.3;
    white-space: normal;
    margin-bottom: 8px;
  }
  .jr-path-card-desc {
    font-size: 14px;
    line-height: 1.4;
  }
  .path-title-br { display: none; }

  /* ── FAQ — mobile ── */
  .jr-faq {
    padding: 80px 60px;
  }

  /* ── КРОСС-ПРОМО — mobile ── */
  .jr-promo-right {
    flex: 1 1 0;
    border-radius: 33px;
    padding: 54px;
  }
  .jr-promo-left picture,
  .jr-promo-left img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
  .jr-promo-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 48px;
    letter-spacing: 0.02em;
  }
  .jr-promo-text {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 600;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: -0.019em;
  }

  /* ── ТЕГИ — mobile ── */
  .tags-cloud .tag:nth-child(1) { left: 14% !important; top: 53% !important; }
  .tags-cloud .tag:nth-child(2) { left: 19% !important; top: 32% !important; }
  .tags-cloud .tag:nth-child(3) { left: 65% !important; top: 104px !important; --tag-r: -52deg; }
  .tags-cloud .tag:nth-child(6) { top: 0% !important; --tag-r: -8deg !important; }
  .tags-cloud .tag:nth-child(8) { left: 70% !important; top: 52% !important; --tag-r: -11deg; }

}


@media (max-width: 1431px) and (min-width: 600px) {
  /* ── EVENTS carousel (600–1431px) ── */
  .events { overflow-x: hidden; }
  .events-header {
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
  }
  .events-list {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 16px;
    padding: 0 24px;
  }
  .events-list::-webkit-scrollbar { display: none; }
  .event-card {
    flex: 0 0 456px;
    width: 456px;
    scroll-snap-align: center;
    scroll-snap-stop: always;
  }
  .event-promo-card {
    scroll-snap-align: center;
    scroll-snap-stop: always;
    order: 0;
    position: relative;
    overflow: visible;
  }
  .event-promo-btn {
    position: absolute;
    top: 0;
    right: 0;
    width: 74px;
    height: 74px;
    flex-shrink: 0;
  }
  .event-card-image {
    height: 312px;
    border-radius: 32px;
  }
  .events-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 20px;
  }
  .events-dot {
    width: 32px;
    height: 8px;
    border-radius: 100px;
    background: rgba(75, 0, 130, 0.2);
    transition: background .3s, width .3s;
    cursor: pointer;
  }
  .events-dot.active {
    width: 48px;
    background: #4B0082;
  }
    .hero-content h1 span.tablet_nowrap { display: inline-block;  white-space: normal !important; }

  /* ── PATH (900–1431px) ── */
  .path-block {
    padding: 60px 40px;
    border-radius: 48px;
  }
  .path-top-row {
    flex-wrap: wrap;
    gap: 16px;
  }
  .path-col {
    flex: 1 1 calc(50% - 8px);
    width: auto;
  }
  .path-stages-wrap {
    order: 3;
    width: 100%;
    margin-top: 24px;
    align-self: center;
  }
  .path-stages {
    width: 100%;
    max-width: 480px;
  }
  .path-arrows-row { display: none; }
}


/* ── JR-SLIDER ADAPTIVE ── */

@media (max-width: 1400px) {
  .jr-slider-photo-unit { flex: 0 0 460px; width: 460px; }
  .jr-slider-unit-body { padding: 100px 56px 100px 80px; }
  .jr-slider-title { font-size: 26px; line-height: 48px; }
  .jr-slider-spec { bottom: 0%; left: -6%; width: 124%; }
  .jr-slider-spec--slide2 { bottom: 20%; left: -1%; width: 102%; }
  .jr-slider-spec--slide3 { bottom: 0%; left: -50%; width: 203%; }
  .jr-slider-spec--slide4 { bottom: -1%; left: -4%; width: 106%; }
}


@media (max-width: 1320px) {
  .jr-teams-bg-img--1 {
    right: -279.152px;
    top: -85px;
    transform: rotate(21deg);
  }
}

@media (max-width: 1297px) and (min-width: 1001px) {
.cust-hero-photo-bg {
    height: 64%;
}
.cust-hero-photo {
    position: absolute;
    top: 23%;
    left: 44%;
    width: 626px;
    height: 593px;
}
}


@media (max-width: 1200px) and (min-width: 900px) {
  .tag--kreativnye { left: 69% !important; top: 31px !important; }
  .tag--bas        { left: 87% !important; top: 59px !important; }
  .tag--dizayn     { left: 20% !important; top: 26px !important; }
  .tag--marketing  { left: 49% !important; top: 0%  !important; }
  .tags-cloud .tag:nth-child(6)  { left: 50% !important; top: 62% !important; --tag-r: -2deg; }
  .tags-cloud .tag:nth-child(10) { top: 255px !important; }
}


@media (max-width: 1200px) {
  .jr-slider-photo-unit { flex: 0 0 380px; width: 380px; }
  .jr-slider-unit-body { padding: 80px 48px 80px 64px; gap: 48px; }
  .jr-slider-title { font-size: 24px; line-height: 40px; }
}


/* Дуги-точки пагинации на планшетном диапазоне (1001–1170px) — должны быть
   внутри сиреневого блока (нижняя часть картинки-слайда), а не на границе
   с фото и не внизу всей карточки */
@media (max-width: 1170px) and (min-width: 1001px) {
.jr-path {
    margin: 0 0 24px;
    padding: 80px 60px;
}
.page-wrapper {
      padding: 0 16px;
}
}


@media (max-width: 1110px) and (min-width: 901px) {
  .jr-teams-bg-img--2 {
    right: -200.261px;
    transform: rotate(-4deg);
    padding: 0 42px;
    gap: 12px;
    bottom: 11px;
  }
  
  .launch {
    margin: 0 0 24px;
    padding: 80px 60px;
  }

  .md-effect {
    margin: 0 0 24px;
  }
}


@media (max-width: 1040px) {
  .modal-inputs-row { flex-direction: column; }
  .modal-phone-row { width: 100%; }
}


@media (max-width: 1000px) {
  .jr-slider-wrapper { height: auto !important; }
  .jr-slider { position: relative !important; top: auto !important; padding: 24px 0; }
  .jr-slider-photo-unit { flex: 0 0 300px; width: 300px; border-radius: 48px; }
  .jr-slider-unit-body { padding: 60px 48px 60px 56px; gap: 40px; border-radius: 48px; }
  .jr-slider-dots { margin-right: 20px; }
  .jr-slider-title { font-size: 22px; line-height: 36px; }
}


@media (max-width: 990px) and (min-width: 600px) {
  /* ── LAUNCH tablet (600–990px) ── */
  .launch {
    border-radius: 48px;
    padding: 48px 32px;
    margin: 0 16px 24px;
  }
  .launch-title {
    font-size: 20px;
    line-height: 1.4;
    letter-spacing: 0.02em;
    margin: 0 0 32px;
  }
  .launch-gold {
    font-size: 20px;
    line-height: 1.4;
    letter-spacing: 0.02em;
  }
  .launch-cards {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .launch-cards .card {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    min-height: 204px;
    padding: 24px 40px 24px 160px;
    border-radius: 28px;
  }
  .launch-card-decor svg {
    width: 220px;
    height: auto;
  }
  .launch-card-body {
    padding-left: 24%;
  }
  .launch-card-num {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 64px;
    line-height: 150%;
    letter-spacing: 0.02em;
    text-align: center;
    top: 50%;
    left: 28px;
    transform: translateY(-50%);
  }
  .launch-card-title {
    font-size: 20px;
    margin: 0 0 8px;
  }
  .launch-card-desc {
    font-size: 16px;
    line-height: 22px;
  }
  .cust-mod-contact {
    bottom: 28px;
    right: -89px;
  }
  .cust-mod-bubble {
    bottom: 120px;
    left: -117px;
  }
  .cust-mod-name {
    top: 154px;
    right: -53px;
  }
}


@media (max-width: 950px) {
  .hero-content h1 { font-size: 22px; }
  .modal-title { font-size: 22px; line-height: 40px;  }
  .modal-title em { font-size: 22px; }

  .modal-title { font-size: 22px; line-height: 40px; white-space: normal; }
  .modal-title em { font-size: 22px; }
  .modal { padding: 30px 50px; }
  .footer-main-row { flex-direction: column; gap: 24px; }
  .footer-nav { flex: none; width: 100%; gap: 24px; }
  .footer-nav-col { flex-direction: row; flex-wrap: wrap; gap: 12px 24px; }
  .footer-contact { flex: none; width: 100%; }
  .footer-socials { flex: none; }
}


@media (max-width: 900px) and (min-width: 600px) {
  .mobile-menu-btns { display: none; }
  .header-btns { display: flex; }
  .cust-hero { padding: 48px 40px; min-height: 400px; }
  .cust-hero-photo { opacity: 0.4; }
  .cust-features { grid-template-columns: repeat(2, 1fr); }
  .cust-feature:nth-child(2) { border-right: none; }
  .cust-feature:nth-child(3) { border-top: 1px solid rgba(255,255,255,0.1); }
  .cust-feature:nth-child(4) { border-top: 1px solid rgba(255,255,255,0.1); border-right: none; }

  /* ── Process carousel (600–900px) ── */
  .cust-proc {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }
  .cust-proc-photo-outer {
    width: 100%;
    height: 380px;
    align-self: auto;
    left: 0;
  }
  .cust-proc-carousel {
    border-radius: 32px 32px 0 0;
    left: 0;
  }
  .cp-slide {
    background-size: cover;
    background-position: center center;
    right: 0;
    top: 0;
    left: 0;
  }
  .cust-proc-content {
    width: 100%;
    height: auto;
    min-height: 520px;
    border-radius: 64px;
    margin-top: 0;
  }
  .cp-text {
    padding: 60px 48px 100px 60px;
    gap: 10px;
    justify-content: flex-start;
  }
  .cp-pagination {
    position: absolute;
    right: auto;
    top: auto;
    bottom: 38px;
    left: 50%;
    transform: translateX(-50%);
    flex-direction: row;
    gap: 12px;
  }
  .cust-proc[data-slide="0"] .cust-proc-photo-outer { width: 100%; height: clamp(370px, 54vw, 510px); left: 0; }
  .cust-proc[data-slide="1"] .cust-proc-photo-outer { width: 100%; height: clamp(370px, 56vw, 510px); left: 0; }
  .cust-proc[data-slide="2"] .cust-proc-photo-outer { width: 100%; height: clamp(370px, 55vw, 510px); left: 0; }
  .cust-proc[data-slide="3"] .cust-proc-photo-outer { width: 100%; height: clamp(370px, 54vw, 510px); left: 0; }
  .cust-proc[data-slide="2"] .cust-proc-content {
    height: 613px;
    margin-top: -1px;
  }
   .cust-proc[data-slide="1"] .cust-proc-content {
    margin-top: 0px;
  }
  .cust-proc[data-slide="3"] .cust-proc-content {
    margin-top: -2px;
  }
  .cust-proc[data-slide="0"] .cp-slide { background-image: url('../images/customer/slides/slide1_768.webp') !important; }
  .cust-proc[data-slide="1"] .cp-slide { background-image: url('../images/customer/slides/slide2_768.webp') !important; }
  .cust-proc[data-slide="2"] .cp-slide { background-image: url('../images/customer/slides/slide3_768.webp') !important; }
  .cust-proc[data-slide="3"] .cp-slide { background-image: url('../images/customer/slides/slide4_768.webp') !important; }

  .cust-form { padding: 56px 40px; border-radius: 40px; }
  .cust-form-stripes { border-radius: 40px; clip-path: inset(0 round 40px); }
  .cust-form-input-wrap { flex: 1 1 100%; }

  /* ── Process carousel cp-title tablet ── */
  .cp-title {
    font-size: 22px;
    line-height: 1.3;
    letter-spacing: 0.02em;
  }
  .cp-gold {
    font-size: 22px;
    line-height: 1.3;
    letter-spacing: 0.02em;
  }

  /* ── PATH (600–900px) ── */
  .path-block { padding: 40px 24px; border-radius: 40px; }
  .path-top-row {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 12px;
  }
  .path-col {
    flex: 1 1 calc(50% - 6px);
    width: auto;
  }
  .path-stages-wrap {
    order: 3;
    width: 100%;
    margin-top: 16px;
    align-self: center;
  }
  .path-stages { width: 100%; max-width: 440px; }
  .path-arrows-row { display: none; }

  /* ── TAGS (600–900px) ── */
  .tag--dizayn     { left: 20% !important; top: 17px !important; --tag-r: 14deg !important; }
  .tag--kreativnye { left: 69% !important; top: 60px !important; --tag-r: 25deg !important; }
  .tag--bas        { left: 89% !important; top: 58px !important; --tag-r: 21deg !important; }
  .tag--marketing  { left: 51% !important; top: 40px !important; --tag-r: -19deg !important; }
  .tags-cloud .tag:nth-child(11) { left: 80% !important; top: 205px !important; --tag-r: -2deg !important; }
}


@media (max-width: 900px) {
  .jr-teams-bg-img--2 { right: -280.261px; }
  .jr-hero-img { top: 37%;        width: 61%; }

  /* ── FOOTER tablet ── */
  .cust-footer { padding: 40px 32px 32px; border-radius: 40px; }
  .cust-footer-main { flex-wrap: wrap; gap: 24px; justify-content: space-between; }
  .cust-footer-nav { flex: 1; }
  .cust-footer-contact { order: 0; width: auto; }
  .cust-footer-socials { width: 100%; }
  .cust-footer-phone { font-size: 28px; }
  .cust-footer-bottom { flex-direction: column; align-items: flex-start; gap: 16px; }
  .cust-footer-legal { flex-direction: column; gap: 12px; }
}


@media (max-width: 884px) and (min-width: 769px) {
  /* ── TAGS ── */
  .tags-cloud .tag:nth-child(4)  { left: 53% !important; top: 99px !important;  --tag-r: 10deg !important; }
  .tags-cloud .tag:nth-child(6)  { left: 43% !important; top: 156px !important; --tag-r: 4deg !important;  }
  .tags-cloud .tag:nth-child(10) { left: 44% !important; top: 248px !important; --tag-r: -4deg !important; }
}


@media (max-width: 880px) {
.hero-content h1 { font-size: 22px; }
  .result-header h2 { font-size: 26px; }
  .tab-btn img { width: 32px; height: 32px; }
}


@media (max-width: 848px) {
  /* ── HERO ── */
  .hero {
  align-items: center;
  padding: 100px 32px;
  min-height: auto;
  border-radius: 64px;
  }
  .hero-content { max-width: 100%; }
  .hero-content h1 { font-size: 24px; line-height: 40px; }
  .hero-content p { font-size: 16px; margin-bottom: 24px; }
  .btn-ghost { height: 52px; font-size: 16px; padding: 0 20px; }
}


@media (max-width: 820px) {
}


@media (max-width: 800px) {
  .nowrap {
    white-space: normal !important;
  }
}


@media (max-width: 768px) {
  /* ── TAGS ── */
  .tags-cloud .tag:nth-child(8) { left: 73% !important; top: 157px !important; --tag-r: -3deg !important; }

  /* ── HEADER ── */
  .nav { display: none; }
  .header { padding: 14px 16px; }
  .btn-purple { font-size: 13px; padding: 10px 16px; }

  /* ── HERO ── */
  .hero { padding: 100px 48px; }
  .hero-content h1 { line-height: 48px; margin-bottom: 36px; }
  .hero-content h1 span:first-child { white-space: nowrap !important; }
  .hero-content h1 span.tablet_nowrap { display: inline-block;  white-space: normal !important; }
  .hero-content p { line-height: 135%; margin-bottom: 32px; }
  .hero-btns { margin-top: 0; }

  /* ── STATS ── */
  .stats {
    padding: 48px 24px 32px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
  }
  .stat-number-gradient { font-size: 36px; }
  .stat-label { font-size: 14px; line-height: 22px; white-space: normal; margin-top: 8px; }

  /* ── PLATFORM ── */
  .platform { padding: 48px 16px; }
  .tags-cloud { gap: 10px; }
  .tag { font-size: 14px; padding: 14px 20px; }
  .btn-join { font-size: 17px; padding: 18px 36px; margin-top: 32px; }

  /* ── RESULT ── */
  .result { padding: 60px; border-radius: 64px; }
  .result-tabs { gap: 8px; }
  .tab-btn img { width: 24px; height: 24px; }
  .result-stat-num { font-size: 20px; }
  .result-stat-label { font-size: 15px; }
  .result-card-text h4 { font-size: 18px; }
  .result-card-text p { font-size: 15px; }
  .result-bottom_title { font-size: 18px; }
  .result-bottom_subtitle { font-size: 15px; }
  .result-bottom_btn { font-size: 16px; padding: 16px 32px; }

  /* ── EVENTS ── */
  .events { padding: 48px 0; }
  .events-header {
    flex-direction: column;
    gap: 10px;
    margin-bottom: 20px;
  }
  .events-header h2 { font-size: 22px; line-height: 38px; width: auto; }
  .events-header p { font-size: 15px; }
  .events-carousel-track { gap: 12px; }
  .event-card-title { font-size: 18px; }

  /* ── PATH ── */
  .path-block { padding: 40px 16px; border-radius: 64px; }
  .path-step-label { font-size: 17px; }
  .path-stage-title { font-size: 17px; }
  .path-stage-desc { font-size: 15px; }

  /* ── COOPERATION ── */
  .cooperation { padding: 12px 0; }
  .coop-block {        
        padding: 60px;
        border-radius: 64px; 
        gap: 28px; 
  }
  .coop-header h2 { font-size: 20px; line-height: 40px; }
  .coop-header p { font-size: 15px; }
  .coop-form { flex-direction: column; gap: 12px; }
  .coop-input { padding: 20px; font-size: 16px; }
  .coop-phone-code-btn { padding: 20px 14px; font-size: 16px; }

  /* ── FOOTER ── */
  .footer-block { padding: 60px; border-radius: 64px; gap: 40px; }
  .footer-main-row { flex-direction: column; gap: 28px; }
  .footer-nav { flex: none; width: 100%; gap: 24px; }
  .footer-nav-col { flex-direction: row; flex-wrap: wrap; gap: 12px 24px; }
  .footer-contact { flex: none; width: 100%; gap: 6px; }
  .footer-phone { font-size: 22px; }
  .footer-socials { flex: none; }
  .footer-bottom-row { flex-direction: column; gap: 12px; align-items: flex-start; }
  .footer-legal { flex-direction: column; gap: 6px; align-items: flex-start }
  .footer-copy { font-size: 14px; }

}


@media (max-width: 765px) {
  /* ── JR-PROMO mobile ── */
  .jr-promo {
    flex-direction: column;
    margin: 0 8px 16px;
  }
  .jr-promo-left {
    border-radius: 32px 32px 0 0;
    overflow: hidden;
    flex: none;
  }
  .jr-promo-left picture,
  .jr-promo-left img { width: 100%; height: auto; object-fit: cover; }
  .jr-promo-right {
    flex: none;
    border-radius: 32px;
    padding: 24px 20px 32px;
    margin-top: 0;
    margin-left: 0;
    gap: 16px;
    align-items: center;
    text-align: center;
  }
  .jr-promo-title { font-size: 13px; line-height: 212%; letter-spacing: 0.02em; }
  .jr-promo-text { font-size: 16px; line-height: 135%; letter-spacing: -0.019em; }
  .jr-promo-btn { box-sizing: border-box; justify-content: center; padding: 16px 24px; font-size: 16px; }
}


@media (max-width: 750px) {
    .jr-hero-img {
        top: 39%;
        width: 61%;
    }
}


@media (max-width: 747px) and (min-width: 600px) {
  .cust-mod-bubble {
    width: 279px;
  }
}


@media (max-width: 730px) {
  .hero-content h1  {
  padding-top: 35px;
  }
  .path-step-item { height: auto; }

  .jr-hero-subtitle {margin: 0 0 52px;}
  .jr-hero-feature {
    padding: 16px;
  }
}


@media (max-width: 720px) {
    .jr-hero-img {
        top: 43%;
        width: 61%;
    }
  .jr-blog-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 212%;
    letter-spacing: 0.02em;
    text-align: center;
  }
  .jr-blog {
    border-radius: 32px;
    margin: 0 8px 16px;
    padding: 32px 16px 24px;
  }
  .jr-blog-header {
    justify-content: center;
  }
  .jr-blog-nav { display: none; }
  .jr-blog-card {
    flex: 0 0 100%;
    flex-direction: column;
    height: auto;
    border-radius: 24px;
    overflow: hidden;
  }
  .jr-blog-card-img {
    flex: none;
    width: 100%;
    height: 260px;
    order: -1;
    border-radius: 24px;
  }
  .jr-blog-card-body {
    border-radius: 24px;
    padding: 20px;
    gap: 8px;
  }
  .jr-blog-card-title { font-size: 18px; }
  .jr-blog-card-desc { font-size: 14px; }
  .jr-blog-btn {
    width: 100%;
    box-sizing: border-box;
    height: 56px;
    font-size: 16px;
    padding: 0 24px;
  }
  .jr-blog-card-img { order: -1; border-radius: 24px; }
  .jr-blog-card-body { border-radius: 24px; }
  .jr-blog-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin: 16px 0 0;
  }
  .jr-blog-dot {
    width: 32px;
    height: 8px;
    border-radius: 100px;
    background: rgba(255,255,255,0.35);
    transition: background 0.3s;
    cursor: pointer;
  }
  .jr-blog-dot.active { background: #fff; }
}

@media (max-width: 691px) {
  .jr-hero {
    border-radius: 40px;
    margin: 0 8px 16px;
    min-height: 680px;
  }
  .jr-hero-inner {
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    padding: 32px 24px;
    min-height: 620px;
  }
  .jr-hero-inner {
    padding-bottom: 0;
  }
  .jr-hero-text {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1;
    position: relative;
    z-index: 2;
  }
  .jr-hero-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 212%;
    letter-spacing: 0.02em;
    white-space: normal;
  }
  .jr-hero-subtitle {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 135%;
    letter-spacing: -0.019em;
    max-width: none;
  }
  .jr-hero-btn {
    margin-top: 160px;
    width: 100%;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
  }
  .jr-hero-img {
    position: absolute;
    left: 14%;
    right: 14%;
    width: 72%;
    top: 37%;
    bottom: 0;
    z-index: 1;
  }
  .jr-hero-features {
    grid-template-columns: repeat(2, 1fr);
    border-radius: 0 0 40px 40px;
    margin-top: -127px;
  }
  .jr-hero-feature:nth-child(-n+2) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }
  .jr-hero-feature:nth-child(odd) {
    border-right: 1px solid rgba(255, 255, 255, 0.12);
  }
  .jr-faq { padding: 0; }
  .jr-faq-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 212%;
    letter-spacing: 0.02em;
    margin: 32px 0 20px;
  }
  .jr-teams-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 212%;
    letter-spacing: 0.02em;
  }
  .jr-teams-subtitle {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 135%;
    letter-spacing: -0.019em;
  }
  .jr-teams { padding: 95px 20px 20px; border-radius: 32px; }
  .jr-teams-header { flex-direction: column; gap: 24px; margin-bottom: 0; }
  .jr-teams-btn { width: 100%; box-sizing: border-box; justify-content: center; }
  /* ── STORIS fix: push problem block below title ── */
  .storis-c0-problem { top: 95px; }

  .jr-teams-bg-desktop { display: none; }
  .jr-teams-bg-mobile { display: block; }
  .jr-teams-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 130px;
    overflow: hidden;
  }

  /* ── JR-SLIDER mobile layout ── */
  .jr-slider { margin: 0 8px; padding: 0; }
  .jr-slider-unit {
    flex-direction: column;
    border-radius: 32px;
    overflow: hidden;
    min-height: auto;
  }
  .jr-slider-photo-unit { flex: none; width: 100%; height: 300px; border-radius: 28px 28px 0 0; }
  .jr-slider-unit-body { padding: 28px 24px 20px; gap: 24px; border-radius: 0; background: transparent; }
  .jr-slider-dots {
    grid-area: auto;
    justify-self: center;
    margin-right: 0;
    flex-direction: row;
    gap: 12px;
    padding: 12px 0 20px;
  }
  .jr-slider-title { font-size: 22px; line-height: 32px; }
  .jr-slider-subtitle { font-size: 15px; line-height: 22px; }
  .jr-slider-btn { font-size: 14px; padding: 14px 20px; width: 100%; box-sizing: border-box; justify-content: center; }
}

@media (max-width: 680px) {
     .jr-hero-img {
        top: 21%;
        width: 80%;
  }
}


@media (max-width: 630px) {
  .hero-content h1  {
  padding-top: 20px;
  }
}


@media (max-width: 625px) {
  /* ── PATH LAYOUT mobile ── */
  .path-top-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto auto auto auto auto auto;
    gap: 0 12px;
  }
  .path-col { display: contents !important; }
  .path-col:first-child > .path-role-badge { grid-column: 1; grid-row: 1; margin-bottom: 12px; }
  .path-col:last-child > .path-role-badge  { grid-column: 2; grid-row: 1; margin-bottom: 12px; }
  .path-col:first-child > .path-steps { grid-column: 1; grid-row: 2 / 8; display: contents; }
  .path-col:last-child > .path-steps  { grid-column: 2; grid-row: 2 / 8; display: contents; }
  .path-col:first-child .path-step-item:nth-child(1) { grid-column: 1; grid-row: 2; }
  .path-col:first-child .path-step-dots:nth-child(2) { grid-column: 1; grid-row: 3; }
  .path-col:first-child .path-step-item:nth-child(3) { grid-column: 1; grid-row: 4; }
  .path-col:first-child .path-step-dots:nth-child(4) { grid-column: 1; grid-row: 5; }
  .path-col:first-child .path-step-item:nth-child(5) { grid-column: 1; grid-row: 6; }
  .path-col:last-child  .path-step-item:nth-child(1) { grid-column: 2; grid-row: 2; }
  .path-col:last-child  .path-step-dots:nth-child(2) { grid-column: 2; grid-row: 3; }
  .path-col:last-child  .path-step-item:nth-child(3) { grid-column: 2; grid-row: 4; }
  .path-col:last-child  .path-step-dots:nth-child(4) { grid-column: 2; grid-row: 5; }
  .path-col:last-child  .path-step-item:nth-child(5) { grid-column: 2; grid-row: 6; }
  .path-stages-wrap {
    grid-column: 1 / -1 !important;
    grid-row: 8 !important;
    width: 100% !important;
    margin-top: 12px;
  }
  .path-stages { width: 100% !important; }
  .path-role-badge { padding: 8px 12px; border-radius: 48px; }
  .path-role-badge span { font-size: 14px; line-height: 20px; }
  .path-step-item { flex-direction: column; align-items: flex-start;  padding: 12px 12px; gap: 8px; border-radius: 16px; background: #F2F1FF;}
  .path-step-num.customer-num,
  .path-step-num.specialist-num { width: 41px; height: 36px; border-radius: 12px; }
  .path-step-text { gap: 4px; }
  .path-step-label { font-size: 13px; line-height: 18px; }
  .path-step-label2 { font-size: 11px; line-height: 16px; }
  .path-step-dots { margin: 4px auto; }
  .path-stage { padding: 10px 12px; gap: 10px; border-radius: 16px; }
  .path-stage-icon { width: 44px; height: 44px; border-radius: 12px; flex-shrink: 0; }
  .path-stage-icon svg { width: 22px; height: 22px; }
  .path-stage-title { font-size: 13px; line-height: 20px; }
  .path-stage-desc { font-size: 11px; line-height: 16px; }
  .path-arrows-row,

  /* ── JR-MENTORS mobile 625px ── */
  .jr-mentors-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 212%;
    letter-spacing: 0.02em;
    text-align: center;
  }
  .jr-mentors-subtitle {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 135%;
    letter-spacing: -0.019em;
    text-align: center;
  }
  .jr-mentors-steps {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 16px;
  }
  .jr-mentors-step {
    flex: none;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    padding: 12px 8px;
  }
  .jr-mentors-step-arrow {
    transform: rotate(90deg);
    align-self: flex-start;
    margin-left: 11px;
  }
  .jr-mentors-step-icon {
    width: 44px;
    height: 44px;
    padding: 10px;
    flex-shrink: 0;
  }
  .jr-mentors-step-text { font-size: 14px; line-height: 135%; }
  .jr-reviews { border-radius: 32px; padding: 40px 16px 48px; }
  .jr-team-title,
  .jr-team-title em {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 212%;
    letter-spacing: 0.02em;
    text-align: center;
  }
  .development-left h2 {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 212%;
    letter-spacing: 0.02em;
  }
}


@media (max-width: 600px) {
  .jr-path { border-radius: 32px; padding: 40px 16px; margin: 124px 8px 16px; }
  .jr-hero-img { top: 43%; }
  .jr-hero-features {
    border-radius: 0 0 40px 40px;
  }
  .jr-hero-feature {
    padding: 20px 16px;
    gap: 6px;
  }
  .jr-hero-feature-label {
    font-size: 16px;
    line-height: 22px;
  }
  .jr-hero-feature-title {
    font-size: 14px;
    line-height: 18px;
  }
  /* ── ОТЗЫВЫ НОВИЧКОВ — mobile ≤600px ── */
  .jr-reviews-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 13px;
    line-height: 212%;
    letter-spacing: 0.02em;
    text-align: center;
  }
  .jr-review-item {
    flex: 0 0 100%;
  }
  .jr-review-circle-wrap {
    width: 240px;
    height: 240px;
  }
  .modal-close {
    display: none;
  }
  .jr-hero-img {
    top: 13%;
    width: 86%;
  }
  .modal-title, .modal-title em {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 12px;
    line-height: 24px;
    letter-spacing: 0.02em;
    text-align: center;
  }
  .modal-form .field,
  .modal-phone-row {
    width: 358px;
    max-width: 100%;
    height: 56px;
    border-radius: 16px;
    gap: 24px;
    padding: 16px 24px;
  }
  .modal-phone-code-btn {
    padding: 16px;
  }
  .modal-phone-input {
    padding-left: 16px;
  }
  .modal-overlay {
    align-items: flex-end;
    padding: 0;
  }
  .modal-wrapper {
    width: 100%;
  }
  .modal {
    width: 100%;
    max-width: 100%;
    border-radius: 32px 32px 0 0;
    transform: translateY(100%);
  }
  .modal-overlay.is-open .modal { transform: translateY(0); }
  .tab-btn {
    width: 146px;
    height: 44px;
    gap: 8px;
    border-radius: 16px;
    padding: 8px 16px 8px 12px;
  }
  .result-card-text h4 {
    font-family: var(--font-nunito-sans);
    font-weight: 600;
    font-style: normal;
    font-size: 20px;
    line-height: 135%;
    letter-spacing: -0.019em;
  }
  .result-card-text p {
    font-family: var(--font-nunito-sans);
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
    line-height: 135%;
    letter-spacing: -0.019em;
  }
  .result-stat-num {
    width: 111.5008773803711px;
    height: 33.999969482421875px;
    gap: 10px;
    border-top-left-radius: 16px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 16px;
    border-bottom-left-radius: 4px;
    padding: 8px 16px;
  }
  .result-stat-num img {
    width: 79.5008773803711px;
    height: 17.999969482421875px;
    opacity: 1;
  }
  .result-card-image {
    height: 159px;
    border-radius: 26px;
    opacity: 1;
  }

  .cust-stat-label {
font-weight: 600;
font-size: 14px;
line-height: 135%;
letter-spacing: -1.9%;

  }
  .storis-card[data-card="2"] .storis-step-item > span:last-child {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 12px;
    line-height: 135%;
    letter-spacing: -0.019em;
  }
  .storis-card[data-card="2"] .storis-step-highlight {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 12px;
    line-height: 135%;
    letter-spacing: -0.019em;
    color: #9747FF;
    text-decoration: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: auto;
  }
   .dev-carousel-track {
      gap: 8px;
    }
}


@media (max-width: 599px) {
  .storis-wrapper { margin-top: -100px; }
  .mobile-menu-btns { display: flex; }
  .header-btns { display: none; }
  h1, h2, h3, h4, h5, h6 { font-size: 16px; }
  .section-title { font-size: 16px; }
  .path-block_titles > .path-title,
  .path-block_titles > .path-title span {
  font-family: var(--font-onder) !important;
  font-weight: 500 !important;
  font-style: normal !important;
  font-size: 13px !important;
  line-height: 212% !important;
  letter-spacing: 0.02em !important;
  text-align: center !important;
  }
  .path-block_titles > .path-subtitle {
  font-family: "Nunito Sans", sans-serif !important;
  font-weight: 600 !important;
  font-style: normal !important;
  font-size: 16px !important;
  line-height: 135% !important;
  letter-spacing: -0.019em !important;
  text-align: center !important;
  }
  .dev-strela-desktop { display: none !important; }
  .development-left {
  position: relative !important;
  top: auto !important;
  align-self: auto !important;
  z-index: 2;
  padding-bottom: 30px;
  }
  .development-right {
  position: relative;
  z-index: 1;
  }
  .development-left h2,
  .development-left h2 em {
  font-family: var(--font-onder);
  font-weight: 500;
  font-style: normal;
  font-size: 13px;
  line-height: 212%;
  letter-spacing: 0.02em;
  }
  .result-tabs {
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  gap: 8px;
  padding-bottom: 4px;
  }
  .result-bottom_btn {
  width: 100%;
  justify-content: center;
  padding: 12px 24px;
  gap: 16px;
  border-radius: 100px;
  }
  .result-tabs::-webkit-scrollbar { display: none; }
  .tab-btn {
  flex: 0 0 auto;
  width: auto;
  white-space: nowrap;
  }
  .result-card-text h4 {
  color: #FFF;
  font-family: "Nunito Sans", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px;
  }


  /* ── STATS mobile ── */
  .stats {
  padding: 36px 16px 24px;
  grid-template-columns: 1fr;
  gap: 24px;
  align-items: center;
  }
  .stat-item {
  align-items: center;
  text-align: center;
  }
  .stat-number {
  font-size: 32px;
  line-height: 64px;
  letter-spacing: 0.02em;
  text-align: center;
  color: rgba(179, 174, 243, 1);
  }
  .stat-number-gradient {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 40px;
    line-height: 64px;
    letter-spacing: 0;
  }
  .stat-label {
  font-size: 20px;
  line-height: 135%;
  letter-spacing: -0.019em;
  text-align: center;
  color: rgba(179, 174, 243, 1);
  white-space: normal;
  margin-top: 0;
  }
  .stat-label-gradient {
  font-size: 20px;
  line-height: 135%;
  letter-spacing: -0.019em;
  text-align: center;
  margin-top: 0;
  }

  /* ── PLATFORM mobile ── */
  .platform .section-title {
  font-size: 16px;
  line-height: 36px;
  padding-bottom: 101px;
  }    
  .platform {
  margin-top: 36px;
  }
  .tags-cloud {
  height: 290px;
  }
  .tags-cloud .tag:nth-child(1)  { left: 20% !important; top: -34px !important; --tag-r: -39deg !important; }
  .tags-cloud .tag:nth-child(2)  { left: 86% !important; top: 83px !important; }
  .tags-cloud .tag:nth-child(3)  { left: 16% !important; top: 92px !important; --tag-r: -35deg !important; }
  .tags-cloud .tag:nth-child(4)  { left: 45% !important; top: 37px !important; --tag-r: 26deg !important; }
  .tags-cloud .tag:nth-child(6)  { left: 72% !important; top: -12px !important; --tag-r: -4deg !important; }
  .tags-cloud .tag:nth-child(7)  { left: 16% !important; top: 146px !important; --tag-r: -27deg !important; --td: 1.08s !important; }
  .tags-cloud .tag:nth-child(8)  { left: 67% !important; top: 161px !important; --tag-r: 5deg !important; }
  .tags-cloud .tag:nth-child(9)  { left: 19% !important; top: 205px !important; --tag-r: -9deg !important; --td: 1.44s !important; }
  .tags-cloud .tag:nth-child(10) { left: 59% !important; top: 104px !important; --tag-r: 15deg !important; }
  .tags-cloud .tag:nth-child(11) { left: 74% !important; top: 220px !important; --tag-r: -7deg !important; }

  /* ── EVENTS CAROUSEL ── */
  .events {
    overflow-x: hidden;
  }
  .events-list {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 12px;
  }
  .events-list::-webkit-scrollbar { display: none; }
  .event-card,
  .event-promo-card {
  flex: 0 0 358px;
  width: 358px;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  }
  /* .event-card {
  height: 312px;
  } */
  .event-card-image {
    height: 244px;
    overflow: hidden;
  }
  .event-join-btn {
    top: 186px !important;
    bottom: auto;
    right: 5px;
    width: 56px;
    height: 56px;
    padding: 16px;
  }
  .event-promo-card {
  height: auto;
  min-height: 400px;
  background: url('../images/index/afisha_mobile.svg') no-repeat center / cover;
  }
  .event-promo-btn {
  position: absolute;
  top: 0;
  right: 0;
  width: 56px;
  height: 56px;
  }
  .event-promo-btn svg {
  width: 20px;
  height: 20px;
  }
  .events-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 16px;
  }
  .events-dot {
  width: 32px;
  height: 8px;
  border-radius: 100px;
  background: rgba(75, 0, 130, 0.2);
  transition: background .3s, width .3s;
  cursor: pointer;
  }
  .events-dot.active {
  width: 48px;
  background: #4B0082;
  }

  .storis-wrapper { margin-top: 80px; }
  .storis-section { padding: 24px 0px; gap: 20px; }
  .storis-cards-container {
  width: 100%;
  height: clamp(380px, 60vh, 540px);
  border-radius: 16px;
  }
  .storis-card { border-radius: 16px; overflow: hidden; }
  .storis-title {
  font-family: 'Onder', sans-serif;
  font-weight: 500;
  font-size: 13px;
  line-height: 212%;
  letter-spacing: 0.02em;
  text-align: center;
  top: 0;
  left: 16px;
  right: 16px;
  margin-bottom: 32px;
  }
  /* Фото по умолчанию (Card 1–4): сразу после заголовка.
     object-position: bottom — так пустое место от несовпадения пропорций
     (contain) уходит наверх, к заголовку, а не разрывает фото и точки снизу. */
  .storis-photo {
  top: 89px;
  bottom: 0;
  height: calc(100% - 89px);
  left: 0;
  right: 0;
  transform: none;
  width: 100%;
  object-fit: contain;
  object-position: bottom center;
  padding-bottom: 16px;
  box-sizing: border-box;
  }
  /* Card 0 — problem поверх фото */
  .storis-c0-problem {
  left: 16px;
  right: 16px;
  top: 86px;
  gap: 8px;
  max-width: none;
  align-items: center;
  text-align: center;
  z-index: 2;
  }
  .storis-problem-label {
  font-size: 14px;
  line-height: 20px;
  max-width: none;
  text-align: center;
  }
  .storis-problem-text {
  font-size: 13px;
  line-height: 18px;
  max-width: none;
  text-align: center;
  }
  .storis-badge-yellow {
  font-size: 14px;
  padding: 10px 14px;
  white-space: normal;
  max-width: none;
  width: 100%;
  text-align: center;
  justify-content: center;
  transform: rotate(-2deg);
  box-sizing: border-box;
  }
  .storis-cloud--desktop { display: none; }
  .storis-cloud--mobile {
  display: block;
  left: 24%;
  right: auto;
  transform: none;
  top: 358px;
  width: 220px;
  height: auto;
  z-index: 2;
  }
  /* Card 1 — bubbles */
  .storis-bubble {
  white-space: nowrap;
  height: auto;
  min-height: 44px;
  padding: 8px 12px;
  font-size: 13px;
  width: max-content !important;
  max-width: calc(100% - 32px) !important;
  }
  .storis-c1-b1 { top: 284px; padding: 8px 12px; left: auto; right: 16px; }
  .storis-c1-b2 { top: 347px; padding: 8px 12px; left: auto; right: 16px; }
  .storis-c1-b3 { top: 410px; padding: 8px 12px; left: auto; right: 16px; }
  .storis-c1-b4 { top: 473px; padding: 8px 12px; left: auto; right: 16px; }
  /* Card 2 — steps */
  .storis-step-item {
  min-height: 54px;
  padding: 12px 14px;
  gap: 10px;
  font-size: 13px;
  line-height: 18px;
  width: fit-content;
  max-width: none;
  left: auto !important;
  right: 16px !important;
  box-sizing: border-box;
  border-radius: 24px 24px 4px 24px;
  margin-top: 0;
  }
  .storis-step-item > span:last-child { max-width: none; font-size: 13px; }
  .storis-step-num { min-width: auto; }
  .storis-step-num svg { width: auto; height: 29px; opacity: 1; }
  .storis-step--tl { top: 270px; }
  .storis-step--tr { top: 347px; }
  .storis-step--bl { top: 422px; }
  .storis-step--br { top: 483px; }
  .storis-step--tl > span:last-child,
  .storis-step--tr > span:last-child,
  .storis-step--bl > span:last-child,
  .storis-step--br > span:last-child,
  .storis-step--tl > span:last-child u,
  .storis-step--tr > span:last-child u,
  .storis-step--bl > span:last-child u,
  .storis-step--br > span:last-child u {
  font-family: 'Nunito Sans', sans-serif;
  font-weight: 600;
  font-size: 12px;
  line-height: 135%;
  letter-spacing: -0.019em;
  }
  /* Card 3 — results */
  .storis-result {
  white-space: normal;
  height: auto;
  line-height: 22px;
  font-size: 13px;
  padding: 10px 14px;
  display: block;
  }
  .storis-result--tr,
  .storis-result--br,
  .storis-result--tl,
  .storis-result--bl { width: fit-content; max-width: calc(100% - 25px); left: auto; right: 16px; border-radius: 24px 24px 4px 24px; }
  .storis-result--tr { top: 303px; white-space: nowrap; }
  .storis-result--tl { top: 362px; }
  .storis-result--br { top: 420px; }
  .storis-result--bl { top: 476px; white-space: nowrap; padding-right: 3px;}
  /* Badge inline */
  .storis-badge-inline {
  left: auto;
  right: 63px;
  top: 72px;
  width: auto;
  height: auto;
  font-size: 13px;
  padding: 8px 12px;
  }

  .cust-wrap { border-radius: 24px; }

  /* Moderator */
  .cust-moderator {
  padding: 20px;
  }
  .cust-mod-text {
  margin-bottom: 32px;
  }
  .cust-mod-title {
  font-family: 'Onder', sans-serif;
  font-weight: 500;
  font-size: 13px;
  line-height: 212%;
  letter-spacing: 0.02em;
  margin: 0 0 12px;
  }
  .cust-mod-title-gold {
  font-size: 13px;
  line-height: 212%;
  letter-spacing: 0.02em;
  }
  .cust-mod-subtitle {
  font-size: 14px;
  line-height: 1.5;
  }
  .cust-mod-visual {
  height: 440px;
  max-width: 100%;
  }
  .cust-mod-photo {
  height: 340px;
  width: auto;
  top: -45px;
  }
  .cust-mod-name {
  top: 73px;
  right: -7px;
  font-size: 9px;
  padding: 8px 16px;
  }
  .cust-mod-bubble {
  bottom: 233px;
  left: -33px;;
  font-size: 9px;
  line-height: 1.4;
  padding: 16px;
  border-radius: 24px 24px 4px 24px;
  max-width: 200px;
  }
  .cust-mod-contact {
  bottom: 101px;
  right: -14;
  min-width: auto;
  width: 200px;
  padding: 16px;
  border-radius: 16px;
  }
  .cust-mod-contact-title { font-size: 11px; margin-bottom: 10px; }
  .cust-mod-contact-label { font-size: 9px; }
  .cust-mod-contact-value { font-size: 9px; }

  /* Hero */
  .cust-hero {
  padding: 28px 20px 112px 20px;
  min-height: 520px;
  align-items: flex-start;
  flex-direction: column;
  justify-content: flex-start;
  overflow: visible;
  }
  .cust-hero-content {
  max-width: 60%;
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: static;
  }
  .cust-hero-title {
  font-family: var(--font-onder) !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  line-height: 212% !important;
  letter-spacing: 0.02em !important;
  white-space: normal;
  }
  .cust-hero-subtitle {
  font-family: 'Nunito Sans', sans-serif !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  line-height: 135% !important;
  letter-spacing: -0.019em !important;
  max-width: 100%;
  }
  .cust-hero-btn {
  position: absolute;
  bottom: 97px;
  left: 20px;
  right: 20px;
  width: auto;
  font-size: 15px;
  padding: 14px 20px;
  justify-content: center;
  border-radius: 100px;
  margin-top: 0;
  z-index: 6;
  }

  /* Show photo on mobile */
  .cust-hero-photo {
  display: block !important;
  opacity: 1;
  height: 78%;
  top: auto;
  bottom: -24px;
  left: 66%;
  transform: translateX(-50%);
  right: auto;
  }
  .cust-hero-photo-fg {
  transform: translate(0, 0);
  }
  .cust-hero-photo-bg {
  height: 70%;
  top: auto;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
  right: auto;
  }/* Stats */
  .cust-stats {
  flex-direction: column;
  align-items: center;
  gap: 32px;
  padding: 40px 20px;
  }
  .cust-stat-item {
  align-items: center;
  }
  .cust-stat-label {
  text-align: center;
  }
  .cust-stat-item:nth-child(1) .cust-stat-number {
  font-family: 'Onder', sans-serif;
  font-weight: 500;
  font-size: 40px;
  line-height: 64px;
  letter-spacing: 0%;
  }
  .cust-stat-label_2 {
  white-space: nowrap;
  }
  .cust-stat-item:nth-child(2) .cust-stat-number,
  .cust-stat-item:nth-child(3) .cust-stat-number {
  font-family: 'Onder', sans-serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 64px;
  letter-spacing: 0.02em;
  background: var(--black, rgba(57, 57, 57, 1));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  }

  /* Features */
  .cust-features {
  grid-template-columns: 1fr 1fr;
  margin-top: -70px;
  }
  .cust-feature {
  padding: 16px 12px;
  min-height: 127px;
  height: auto;
  gap: 6px;
  }
  .cust-feature-icon { margin-bottom: 0; }
  .cust-feature-icon svg { width: 32px; height: 32px; }
  .cust-feature-title { font-size: 14px; line-height: 18px; }
  .cust-feature-desc { font-size: 12px; line-height: 16px; }

  /* Partners */
  .cust-partners { padding: 20px 16px; justify-content: center; }
  .cust-partner-logo { height: 22px; }

  /* Process Carousel — mobile */
  .cust-proc-wrapper {
  height: auto !important;
  margin-top: 32px;
  }
  .cust-proc {
  position: relative !important;
  top: auto !important;
  min-height: unset !important;
  flex-direction: column;
  align-items: center;
  gap: 0;
  }
  .cust-proc-photo-outer {
  width: 100%;
  height: 348px;
  flex-shrink: 0;
  }
  .cust-proc[data-slide="0"] .cust-proc-photo-outer { width: 100%; height: 348px; left: 0; }
  .cust-proc[data-slide="1"] .cust-proc-photo-outer { width: 100%; height: 348px; left: 0; }
  .cust-proc[data-slide="2"] .cust-proc-photo-outer { width: 100%; height: 348px; left: 0; }
  .cust-proc[data-slide="3"] .cust-proc-photo-outer { width: 100%; height: 375px; left: 0; }
  .cust-proc-carousel {
  border-radius: 32px;
  left: 0;
  }
  .cp-slide {
  background-size: 100% auto;
  background-position: center top;
  right: 0;
  top: 0;
  }
  .cust-proc[data-slide="0"] .cp-slide { background-image: url('../images/customer/slides/slide1_mobile.webp') !important; }
  .cust-proc[data-slide="1"] .cp-slide { background-image: url('../images/customer/slides/slide2_mobile.webp') !important; }
  .cust-proc[data-slide="2"] .cp-slide { background-image: url('../images/customer/slides/slide3_mobile.webp') !important; }
  .cust-proc[data-slide="3"] .cp-slide { background-image: url('../images/customer/slides/slide4_mobile.webp') !important; }
  .cust-proc[data-slide="0"] .cust-proc-content,
  .cust-proc[data-slide="1"] .cust-proc-content,
  .cust-proc[data-slide="2"] .cust-proc-content,
  .cust-proc[data-slide="3"] .cust-proc-content {
  height: auto;
  margin-top: 0;
  border-radius: 32px;
  }
  .cust-proc-content {
  width: 100%;
  height: auto;
  min-height: 440px;
  border-radius: 32px;
  margin-top: 0;
  padding: 20px 20px 16px 20px;
  box-sizing: border-box;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 24px;
  text-align: left;
  }
  .cp-text {
  position: relative;
  inset: auto;
  display: none;
  padding: 0;
  opacity: 1;
  transform: none;
  transition: none;
  flex-direction: column;
  gap: 24px;
  }
  .cp-text.active {
  display: flex;
  align-items: center;
  }
  .cp-text.slide-exit-up {
  display: none;
  }
  .cp-pagination {
  position: relative;
  bottom: auto;
  right: auto;
  top: auto;
  left: auto;
  transform: none;
  flex-direction: row;
  justify-content: center;
  gap: 8px;
  margin-top: auto;
  }
  .cp-title {
  font-size: 13px !important;
  line-height: 212% !important;
  letter-spacing: 0.02em !important;
  text-align: center !important;
  margin: 0 !important;
  }
  .cp-gold {
  font-size: 13px !important;
  line-height: 212% !important;
  letter-spacing: 0.02em !important;
  }
  .cp-row {
  font-size: 16px;
  line-height: 135%;
  letter-spacing: -0.019em;
  }
  .cp-row u {
  font-family: "Nunito Sans", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 135%;
  letter-spacing: -0.019em;
  vertical-align: middle;
  text-decoration: none;
  }
  .cp-who {
  font-family: 'Onder', sans-serif;
  font-size: 13px;
  font-weight: 500;
  line-height: 212%;
  letter-spacing: 0.02em;
  color: #FFCA70;
  vertical-align: middle;
  }
  .cp-btn {
  margin-top: auto;
  padding: 14px 24px;
  font-size: 16px;
  align-self: stretch;
  justify-content: center;
  }

  /* Launch */
  .launch {
  border-radius: 32px;
  padding: 32px 16px;
  margin: 0 8px 16px;
  }
  .launch-title {
  font-family: 'Onder', sans-serif;
  font-weight: 500;
  font-size: 13px;
  line-height: 212%;
  letter-spacing: 0.02em;
  text-align: center;
  margin: 0 0 24px;
  }
  .launch-gold {
  font-family: 'Onder', sans-serif;
  font-weight: 500;
  font-size: 13px;
  line-height: 212%;
  letter-spacing: 0.02em;
  }
  .launch-cards {
  grid-template-columns: 1fr;
  gap: 12px;
  }
  .launch-cards .card {
  min-height: 380px;
  padding: 20px;
  border-radius: 24px;
  }
  .launch-card-decor svg {
  width: auto;
  height: 249px;
  }
  .launch-card-num {
  font-size: 56px;
  top: 16px;
  left: 20px;
  }
  .launch-card-body {
  padding-left: 0;
  }
  .launch-card-title {
  font-size: 18px;
  margin: 0 0 8px;
  }
  .launch-card-desc {
  font-size: 14px;
  line-height: 20px;
  }

  .cust-form { padding: 40px 24px; border-radius: 24px; margin: 0 0 16px; }
  .cust-form-stripes { border-radius: 24px; clip-path: inset(0 round 24px); }
  .cust-form-title {
  font-family: 'Onder', sans-serif;
  font-weight: 500;
  font-size: 13px;
  line-height: 212%;
  letter-spacing: 0.02em;
  }
  .cust-form-title-gold { font-size: 13px; line-height: 212%; letter-spacing: 0.02em; }
  .cust-form-subtitle { font-size: 15px; }
  .cust-form-inputs { display: flex; flex-direction: column; gap: 12px; }
  .cust-form-input-wrap { flex: 1 1 auto; width: 100%; }
  .cust-form-input {
    width: 335px;
    max-width: 100%;
    height: 60px;
    border-radius: 16px;
    gap: 24px;
    opacity: 1;
    padding: 16px 24px;
    background: rgba(255, 255, 255, 0.30);
    backdrop-filter: blur(37.07px);
    -webkit-backdrop-filter: blur(37.07px);
    font-size: 16px;
  }
  .cust-phone-code-btn { height: 60px; }
  .cust-form-btn { font-size: 16px; width: 100%; }

  .cust-footer { padding: 32px 24px 28px; border-radius: 24px; margin: 0 0 16px; }
  .cust-footer-nav { flex-direction: column; gap: 16px; flex: none; width: 100%; }
  .cust-footer-contact { width: 100%; }
  .cust-footer-phone { font-size: 22px; }
  .cust-form-error {
  min-height: 0px;
  margin-top: 0px;
  }
  /* ── JR-PATH mobile ── */
  .jr-path-title {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 212%;
    letter-spacing: 0.02em;
    text-align: center;
    margin-bottom: 16px;
  }
  .jr-path-cards { grid-template-columns: 1fr; gap: 12px; }
  .jr-path-cards .card {
    flex-direction: column;
    align-items: stretch;
    padding: 0;
    min-height: auto;
    border-radius: 24px;
  }
  .jr-path-card-decor {
    width: 100%;
    height: 160px;
    flex-shrink: 0;
    border-radius: 24px 24px 0 0;
  }
  .jr-path-card-decor svg { height: auto; margin: 0; }
  .jr-path-card-num {
    font-family: 'Onder', sans-serif;
    font-weight: 500;
    font-size: 60.41px;
    line-height: 150%;
    letter-spacing: 0.02em;
    left: 16px;
  }
  .jr-path-card-body { padding: 16px 20px 20px; flex: none; }
  .jr-path-card-title { font-size: 16px; line-height: 1.3; margin-bottom: 8px; white-space: normal; }
  .jr-path-card-desc { font-size: 14px; line-height: 1.5; }
}


@media (max-width: 590px) {
  .result-header h2 { font-size: 20px; }

  .modal-close {
  display: none;
  }

  .modal-form .field, .modal-phone-code-btn, .modal-submit {
  padding: 16px
  }
  .modal {
  padding: 30px 24px;
  }
}


@media (max-width: 540px) {
  .storis-bubble {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 14px;
    line-height: 135%;
    letter-spacing: -0.019em;
    padding: 4px 12px;
    gap: 8px;
    min-height: 0;
  }
  /* Flow layout instead of manually-tuned absolute offsets: bubbles stack
     based on their real rendered height, so wrapped text can never overlap
     the next bubble regardless of viewport width. */
  .storis-c1-b1,
  .storis-c1-b2,
  .storis-c1-b3,
  .storis-c1-b4 {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    width: calc(100% - 32px);
    margin: 0 16px 8px 16px;
  }
  .storis-c1-b1 { margin-top: 260px; }
}


@media (max-width: 500px) {
  .specialists[data-slide="0"] .spec-pagination {
    right: 13%;
    bottom: 2%;
  }
  .specialists[data-slide="1"] .spec-pagination,
  .specialists[data-slide="2"] .spec-pagination {
    right: 13%;
    bottom: 0%;
  }
    .hero-content {
        max-width: 103%;
    }
  /* ── HEADER ── */
  .header { padding: 12px 16px; }
  .logo-soyuz img { width: 159px; height: 24px; }
  .btn-purple { font-size: 12px; padding: 10px 14px; }

  /* ── jr-hero ── */
  .jr-hero-btn { margin-top: 50%; }
  .jr-hero-img { top: 26%; }

  /* ── HERO ── */
  .hero {
  padding: 28px 16px 32px;
  border-radius: 24px;
  gap: 24px;
  }
  .hero-content p { font-size: 14px; line-height: 22px; margin-bottom: 20px; }
  .hero-content h1 span:first-child { white-space: normal !important; }
  .btn-ghost { height: 48px; font-size: 14px; padding: 0 18px; }

  /* ── STATS ── */
  .stats {
  padding: 36px 16px 24px;
  grid-template-columns: 1fr;
  gap: 24px;
  align-items: center;
  }
  .stat-item { align-items: center; text-align: center; }
  .stat-number { font-size: 32px; line-height: 64px; letter-spacing: 0.02em; text-align: center; color: rgba(179, 174, 243, 1); }
    .stat-number-gradient { font-family: 'Onder', sans-serif; font-weight: 500; font-size: 40px; line-height: 64px; letter-spacing: 0; }
  .stat-label { font-size: 20px; line-height: 135%; letter-spacing: -0.019em; text-align: center; color: rgba(179, 174, 243, 1); white-space: normal; margin-top: 0; }
  .stat-label-gradient { font-size: 20px; line-height: 135%; letter-spacing: -0.019em; text-align: center; margin-top: 0; }


  /* ── PLATFORM ── */
  .platform { padding: 36px 16px; }
  .platform .section-title { font-size: 14px; line-height: 36px; padding-bottom: 112px; }
  .platform .section-title em { font-size: 14px;line-height: 36px;  }
  .tags-cloud { gap: 8px; }
  .tag { font-size: 13px; padding: 10px 16px; }
  .btn-join { font-size: 15px; padding: 16px 28px; width: 100%; justify-content: center; }

  /* ── RESULT ── */
  .result { padding: 32px 16px;  }
  .result-header h2 { font-size: 16px; line-height: 36px; }
  .result-tabs { gap: 6px; }
  .tab-btn{ font-size: 14px; gap: 6px; }
  .modal-subtitle { font-size: 14px; line-height: 20px; }
  .tab-btn img { width: 20px; height: 20px; }
  .result-card { padding: 10px; gap: 10px; }
  .result-card-image { height: 180px; }
  .result-card-stats { gap: 24px; }
  .result-stat-num { font-size: 18px; line-height: 1.2; }
  .result-stat-label { font-size: 13px; }
  .result-card-text h4 { font-size: 16px; }
  .result-card-text p { font-size: 14px; }
  .result-bottom_title { font-size: 16px; }
  .result-bottom_subtitle { font-size: 14px; margin-bottom: 20px; }
  .result-bottom_btn { font-size: 15px; padding: 14px 24px; }

  /* ── DEVELOPMENT ── */
  .development { padding: 36px 0; gap: 24px; }
  .dev-card-image { height: 160px; }
  .dev-card-body {  padding: 24px 32px 32px; }
  .dev-card-body h4 { font-size: 16px; }
  .dev-card-body p { font-size: 14px; }

  /* ── EVENTS ── */
  .events { padding: 36px 0; }
  .events-header { gap: 8px; margin-bottom: 16px; }
  .events-header h2 { font-size: 20px; line-height: 34px; }
  .events-header p { font-size: 14px; }
  .events-carousel-track { gap: 10px; }
  .event-card-image { height: 244px; border-radius: 20px; }
  .event-join-btn { top: 186px; right: 5px; width: 52px; height: 52px; padding: 14px; }
  .event-card-info { padding: 14px; border-radius: 20px; gap: 10px; }
  .event-card-title { font-size: 16px; line-height: 24px; }
  .event-meta-label { font-size: 12px; }
  .event-meta-value { font-size: 14px; }
  .event-promo-card { height: 260px; padding: 18px; }
  .event-promo-title { font-size: 13px; line-height: 22px; }
  .event-promo-btn { width: 52px; height: 52px; }

  /* ── PATH ── */
  .path-block { padding: 32px 16px; border-radius: 24px; }
  .path-block > .path-title { font-size: 20px; line-height: 36px; padding-bottom: 28px; }
  .path-role-badge { padding: 12px 18px; }
  .path-role-badge span { font-size: 16px; }
  .path-step-item { padding: 12px 16px; height: auto; }
  .path-step-label { font-size: 15px; line-height: 24px; }
  .path-step-num { font-size: 20px; }
  .path-stage { padding: 12px 16px; }
  .path-stage-title { font-size: 15px; }
  .path-stage-desc { font-size: 13px; }

  /* ── COOPERATION ── */
  .coop-block { padding: 28px 16px; border-radius: 24px; gap: 20px; }
  .coop-header h2 { font-size: 20px; line-height: 36px; }
  .coop-header p { font-size: 14px; }
  .coop-input { padding: 16px; font-size: 15px; }
  .coop-phone-code-btn { padding: 16px 12px; font-size: 15px; }

  /* ── FOOTER ── */
  .footer-block { padding: 28px 16px; border-radius: 32px; gap: 28px; }
  .footer-nav-col { gap: 8px 16px; }
  .footer-nav-col a { font-size: 14px; }
  .footer-phone { font-size: 20px; }
  .footer-email { font-size: 13px; }
  .footer-social-btn,
  .footer-social-btn svg,
  .footer-legal a { font-size: 13px; }
  .footer-copy { font-size: 13px; }
  .stat-item {
  align-items: center;
  }
  .sp-text {
  border-radius: 24px;
  }
  .sp-text h2 {
  font-size: 16px;
  }
  .nowrap {
  white-space: nowrap;
}
  /* .platform .section-title {
  font-size: 22px;
  }
  .platform .section-title em {
  font-size: 22px;
  } */
  .events-header h2 {
  font-size: 18px;
  }
  .coop-header h2 {
  font-family: var(--font-onder) !important;
  font-weight: 500 !important;
  font-style: normal !important;
  font-size: 11px !important;
  line-height: 212% !important;
  letter-spacing: 2% !important;
  }

  .sp-text h2 span, .sp-text h2,
  .sp-text h2 em, .result-header h2, .events-header h2,
  .path-block > .path-title, .path-block > .path-title span {
  font-size: 14px;
  }
  .spec-pagination {
  right: 12px;
  }
  .jr-slider-photo-unit { height: 240px; }
  .jr-slider-unit-body { padding: 20px 16px 16px; }
  .jr-slider-title { font-size: 20px; line-height: 28px; }
}


@media (max-width: 499px) {
  .storis-photo { width: 110%; }
}


@media (max-width: 430px) {
  .jr-hero-btn { margin-top: 61%; }
}


@media (max-width: 419px) {
  .sp-unit:nth-child(1) .sp-text {
  margin-top: -19px !important;
  }
  .sp-unit:nth-child(2) .sp-text, 
  .sp-unit:nth-child(3) .sp-text {
  margin-top: 0px !important;
  }
}


@media (max-width: 414px) {
  .sp-unit:nth-child(1) .sp-text {
  margin-top: -28px !important;
  }
  .sp-unit:nth-child(2) .sp-text,
  .sp-unit:nth-child(3) .sp-text {
  margin-top: 0px !important;
  }
}


@media (max-width: 406px) {
  .storis-bubble {
  white-space: normal !important;
  width: auto !important;
  max-width: calc(100% - 32px) !important;
  box-sizing: border-box;
  left: auto !important;
  right: 16px !important;
  }
}


@media (max-width: 400px) {
  .hero-btns {
    flex-direction: column;
  }
  .event-card,
  .event-promo-card {
    flex: 0 0 calc(100vw - 24px);
    width: calc(100vw - 24px);
  }
  .event-card-image {
    width: 95%;
  }
  .event-join-btn {
        right: 0px;
  }
}


@media (max-width: 396px) {
  .storis-title {
  font-size: 11px;
  line-height: 160%;
  }
  .storis-c0-problem {
  top: 52px;
  }
}


@media (max-width: 395px) {
  .sp-unit:nth-child(1) .sp-text{
  margin-top: -33px !important;
  }
  .sp-unit:nth-child(2) .sp-text {
  margin-top: 0px !important;
  }
  .sp-unit:nth-child(3) .sp-text {
  margin-top: -3px !important;
  }
  /* .counter[data-target="150"] {
  width: 271px !important;
  } */
  .jr-hero-features {
    border-radius: 0 0 40px 40px;
    margin-top: -127px;
  }
  .jr-hero-btn { margin-top: 64%; }
}


@media (max-width: 393px) {
  .sp-unit:nth-child(3) .sp-text {
  margin-top: -8px !important;
  }
}


@media (max-width: 390px) {
  .sp-unit:nth-child(3) .sp-text {
  margin-top: -14px !important;
  }
}


@media (max-width: 383px) {
  .sp-unit:nth-child(1) .sp-text {
  margin-top: -36px !important;
  }
  .sp-unit:nth-child(2) .sp-text {
  margin-top: 0px !important;
  }
  .sp-unit:nth-child(3) .sp-text {
  margin-top: -17px !important;
  }
}


