*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --bg:      #08090a;
      --s1:      #0d0e0f;
      --s2:      #111214;
      --s3:      #161819;
      --border:  rgba(255,255,255,.065);
      --border2: rgba(255,255,255,.11);
      --lime:    #e4f222;
      --lime-d:  #c5d41a;
      --lime-g:  rgba(228,242,34,.12);
      --lime-gg: rgba(228,242,34,.05);
      --snow:    #f4f6f7;
      --mist:    #c2cad4;
      --fog:     #737c88;
      --font:    'DM Sans', system-ui, sans-serif;
    }
    html { scroll-behavior: smooth; color-scheme: dark; }
    body {
      font-family: var(--font);
      background: var(--bg);
      color: var(--snow);
      line-height: 1.65;
      -webkit-font-smoothing: antialiased;
      overflow-x: hidden;
    }
    ::-webkit-scrollbar { width: 6px; }
    ::-webkit-scrollbar-track { background: var(--s1); }
    ::-webkit-scrollbar-thumb { background: #2a2d32; border-radius: 3px; }
    ::-webkit-scrollbar-thumb:hover { background: #383c43; }
    a { color: inherit; text-decoration: none; }
    svg { display: block; flex-shrink: 0; }

    /* ── REVEAL ── */
    [data-reveal] {
      opacity: 0;
      transform: translateY(28px);
      transition: opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1);
    }
    [data-reveal].visible { opacity: 1; transform: none; }

    /* ── NAV ── */
    nav {
      position: fixed; top: 0; left: 0; right: 0; z-index: 200;
      display: flex; align-items: center; justify-content: space-between;
      padding: 0 32px; height: 64px;
      background: rgba(8,9,10,.75);
      backdrop-filter: blur(20px) saturate(160%);
      -webkit-backdrop-filter: blur(20px) saturate(160%);
      border-bottom: 1px solid var(--border);
    }
    .nav-logo { display: flex; align-items: center; }
    .nav-logo img { height: 38px; }
    .nav-links { display: flex; gap: 28px; }
    .nav-links a {
      font-size: .875rem; font-weight: 500; color: var(--fog);
      transition: color .2s; cursor: pointer;
    }
    .nav-links a:hover { color: var(--snow); }
    .nav-cta {
      display: inline-flex; align-items: center; gap: 7px;
      padding: 9px 20px; border-radius: 8px;
      background: var(--lime); color: #050600; font-weight: 700; font-size: .85rem;
      transition: background .15s, box-shadow .15s; cursor: pointer;
    }
    .nav-cta:hover {
      background: var(--lime-d);
      box-shadow: 0 0 24px rgba(228,242,34,.35);
    }
    /* Действия в шапке: мессенджеры, вход, целевая кнопка. */
    .nav-actions { display: flex; align-items: center; gap: 10px; }
    .nav-icon {
      display: inline-flex; align-items: center; justify-content: center;
      width: 36px; height: 36px; border-radius: 8px;
      border: 1px solid var(--border2); color: var(--mist);
      transition: border-color .15s, color .15s, background .15s;
    }
    .nav-icon:hover { border-color: var(--lime); color: var(--snow); background: var(--lime-gg); }
    @media (max-width: 900px) {
      .nav-links { display: none; }
      nav { padding: 0 20px; }
      .nav-actions { gap: 8px; }
    }
    /* На узких экранах кнопка съедает всю ширину — оставляем иконки и короткий
       призыв, полноразмерная кнопка есть в конце страницы. */
    /* Кнопка не должна переноситься на вторую строку: шапка фиксированной
       высоты, перенос её ломает. */
    .nav-cta { white-space: nowrap; }
    @media (max-width: 560px) {
      .nav-cta { padding: 8px 14px; font-size: .8rem; }
      .nav-cta svg { display: none; }
    }
    /* Узкие экраны: кнопка «Открыть систему» и логотип делят ширину, поэтому
       логотипу даём меньше, но не возвращаемся к прежним 30px. */
    @media (max-width: 420px) {
      .nav-logo img { height: 32px; }
    }

    /* ── HERO ── */
    .hero {
      position: relative; overflow: hidden;
      min-height: 100vh;
      display: flex; align-items: center;
      padding: 120px 32px 80px;
    }
    #particles-canvas {
      position: absolute; inset: 0; pointer-events: none; z-index: 0;
    }
    .hero-orb {
      position: absolute; border-radius: 50%; pointer-events: none;
      filter: blur(80px);
    }
    .hero-orb-1 {
      width: 700px; height: 500px;
      background: radial-gradient(circle, rgba(228,242,34,.08), transparent 70%);
      top: -150px; left: -150px;
      animation: orb-drift 8s ease-in-out infinite;
    }
    .hero-orb-2 {
      width: 500px; height: 500px;
      background: radial-gradient(circle, rgba(228,242,34,.05), transparent 70%);
      bottom: -100px; right: -100px;
      animation: orb-drift 10s ease-in-out infinite reverse;
    }
    @keyframes orb-drift {
      0%, 100% { transform: translate(0,0) scale(1); }
      50% { transform: translate(40px,30px) scale(1.08); }
    }
    .hero-inner {
      position: relative; z-index: 1;
      max-width: 1200px; margin: 0 auto; width: 100%;
      display: grid; grid-template-columns: 1fr 1fr;
      gap: 60px; align-items: center;
    }
    .hero-badge {
      display: inline-flex; align-items: center; gap: 7px;
      padding: 5px 14px 5px 6px; border-radius: 999px;
      border: 1px solid rgba(228,242,34,.3);
      background: rgba(228,242,34,.06);
      margin-bottom: 24px;
    }
    .hero-badge-dot {
      width: 20px; height: 20px; border-radius: 50%;
      background: var(--lime); display: flex; align-items: center; justify-content: center;
    }
    .hero-badge-dot svg { width: 10px; height: 10px; stroke: #050600; }
    .hero-badge span {
      font-size: .75rem; font-weight: 700; letter-spacing: .05em;
      text-transform: uppercase; color: var(--lime);
    }
    .hero-title {
      font-size: clamp(2.2rem, 5vw, 3.8rem);
      font-weight: 800; line-height: 1.1; letter-spacing: -.02em;
      margin-bottom: 20px;
    }
    .hero-title em {
      font-style: normal;
      background: linear-gradient(90deg, #e4f222 0%, #a8b810 100%);
      -webkit-background-clip: text; -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .hero-sub {
      font-size: 1.1rem; color: var(--fog); max-width: 480px;
      line-height: 1.75; margin-bottom: 36px;
    }
    .hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
    .btn-lime {
      display: inline-flex; align-items: center; gap: 8px;
      padding: 14px 28px; border-radius: 9px;
      background: var(--lime); color: #050600; font-weight: 700; font-size: .95rem;
      transition: background .15s, box-shadow .2s, transform .15s; cursor: pointer;
    }
    .btn-lime:hover {
      background: var(--lime-d); transform: translateY(-2px);
      box-shadow: 0 8px 32px rgba(228,242,34,.3);
    }
    .btn-ghost {
      display: inline-flex; align-items: center; gap: 8px;
      padding: 14px 28px; border-radius: 9px;
      border: 1px solid var(--border2); color: var(--mist); font-size: .95rem; font-weight: 500;
      transition: border-color .2s, color .2s, background .2s; cursor: pointer;
    }
    .btn-ghost:hover { border-color: rgba(255,255,255,.25); color: var(--snow); background: rgba(255,255,255,.04); }

    /* Hero App Mock */
    .hero-visual { display: flex; align-items: center; justify-content: center; }
    .app-mock {
      width: 100%; max-width: 400px;
      background: rgba(17,18,20,.9);
      border: 1px solid rgba(228,242,34,.2);
      border-radius: 20px;
      box-shadow: 0 0 60px rgba(228,242,34,.1), 0 40px 80px rgba(0,0,0,.6);
      overflow: hidden;
      animation: app-float 5s ease-in-out infinite;
    }
    @keyframes app-float {
      0%, 100% { transform: translateY(0px) rotate(0deg); }
      50% { transform: translateY(-10px) rotate(.3deg); }
    }
    .app-topbar {
      padding: 14px 16px; border-bottom: 1px solid var(--border);
      display: flex; align-items: center; justify-content: space-between;
    }
    .app-title { font-weight: 700; font-size: .9rem; display: flex; align-items: center; gap: 8px; }
    .app-title-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--lime); animation: pulse-dot 2s ease-in-out infinite; }
    @keyframes pulse-dot { 0%,100%{box-shadow:0 0 0 0 rgba(228,242,34,.4)} 50%{box-shadow:0 0 0 6px rgba(228,242,34,0)} }
    .app-date-tag {
      font-size: .75rem; font-weight: 600; color: var(--fog);
      background: var(--s3); border: 1px solid var(--border); border-radius: 6px; padding: 3px 9px;
    }
    .app-subbar {
      padding: 10px 16px; display: flex; justify-content: space-between; align-items: center;
      background: var(--s2); border-bottom: 1px solid var(--border);
    }
    .app-brigade { font-size: .78rem; font-weight: 600; color: var(--mist); }
    .app-count-badge {
      font-size: .72rem; font-weight: 800; padding: 2px 9px; border-radius: 999px;
      background: rgba(228,242,34,.12); color: var(--lime); border: 1px solid rgba(228,242,34,.25);
    }
    .app-row {
      display: flex; align-items: center; gap: 12px;
      padding: 11px 16px; border-bottom: 1px solid var(--border);
      transition: background .15s;
    }
    .app-row:last-of-type { border-bottom: none; }
    .app-row:hover { background: rgba(255,255,255,.02); }
    .app-av {
      width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0;
      display: flex; align-items: center; justify-content: center;
      font-size: .65rem; font-weight: 700;
    }
    .app-av-1 { background: rgba(228,242,34,.15); color: var(--lime); }
    .app-av-2 { background: rgba(99,179,237,.15); color: #63b3ed; }
    .app-av-3 { background: rgba(154,122,210,.15); color: #9a7ad2; }
    .app-av-4 { background: rgba(72,187,120,.15); color: #48bb78; }
    .app-av-5 { background: rgba(245,101,101,.15); color: #f56565; }
    .app-info { flex: 1; min-width: 0; }
    .app-name { font-size: .82rem; font-weight: 600; }
    .app-role { font-size: .72rem; color: var(--fog); }
    .app-st {
      width: 28px; height: 28px; border-radius: 7px; flex-shrink: 0;
      display: flex; align-items: center; justify-content: center;
      font-size: .7rem; font-weight: 800;
    }
    .app-st.yes { background: rgba(228,242,34,.12); color: var(--lime); border: 1px solid rgba(228,242,34,.25); }
    .app-st.no { background: rgba(245,101,101,.1); color: #f56565; border: 1px solid rgba(245,101,101,.2); }
    .app-footer {
      padding: 12px 16px; display: flex; align-items: center; justify-content: space-between;
      border-top: 1px solid var(--border); background: var(--s2);
    }
    .app-save {
      padding: 7px 16px; border-radius: 7px; border: none;
      background: var(--lime); color: #050600; font-weight: 700; font-size: .78rem;
      cursor: pointer; transition: background .15s;
    }
    .app-save:hover { background: var(--lime-d); }
    .app-stats-text { font-size: .78rem; color: var(--fog); }
    .app-stats-text strong { color: var(--snow); font-weight: 700; }

    /* Floating mini card */
    .mini-card {
      position: absolute; bottom: -20px; left: -30px;
      background: rgba(17,18,20,.95); border: 1px solid var(--border2);
      border-radius: 14px; padding: 14px 16px; width: 200px;
      box-shadow: 0 20px 40px rgba(0,0,0,.5);
      animation: app-float 6s ease-in-out infinite reverse;
    }
    .mini-card-label { font-size: .7rem; font-weight: 600; color: var(--fog); margin-bottom: 10px; letter-spacing: .03em; text-transform: uppercase; }
    .mini-bars { display: flex; align-items: flex-end; gap: 5px; height: 40px; }
    .mini-bar {
      flex: 1; border-radius: 3px 3px 0 0;
      background: rgba(228,242,34,.2);
      animation: bar-grow .8s cubic-bezier(.22,1,.36,1) forwards;
      transform-origin: bottom;
    }
    .mini-bar.accent { background: var(--lime); }
    @keyframes bar-grow { from { transform: scaleY(0); opacity: 0; } to { transform: scaleY(1); opacity: 1; } }
    .mini-bar:nth-child(1) { height: 65%; animation-delay: .1s; }
    .mini-bar:nth-child(2) { height: 80%; animation-delay: .15s; }
    .mini-bar:nth-child(3) { height: 55%; animation-delay: .2s; }
    .mini-bar:nth-child(4) { height: 90%; animation-delay: .25s; accent: true; }
    .mini-bar:nth-child(5) { height: 70%; animation-delay: .3s; }
    .mini-bar:nth-child(6) { height: 100%; animation-delay: .35s; }
    .mini-bar:nth-child(7) { height: 85%; animation-delay: .4s; }
    .mini-stat { font-size: .82rem; font-weight: 700; margin-top: 8px; }
    .mini-stat span { color: var(--lime); }
    .hero-visual-wrap { position: relative; }

    @media (max-width: 900px) {
      .hero { min-height: auto; padding: 88px 20px 56px; }
      .hero-inner { grid-template-columns: 1fr; }
      .hero-visual { display: none; }
    }

    /* ── STATS ── */
    .stats-bar {
      border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);
      background: var(--s1);
    }
    .stats-inner {
      max-width: 1200px; margin: 0 auto;
      display: grid; grid-template-columns: repeat(4, minmax(0,1fr));
    }
    /* Ячейки одинаковой высоты: подписи разной длины («Секунды» в одну строку,
       «Один экран» в две) иначе делают плитки разного размера. */
    .stat {
      padding: 36px 24px; text-align: center;
      border-right: 1px solid var(--border);
      display: flex; flex-direction: column; align-items: center; justify-content: center;
      min-height: 150px;
    }
    .stat-label { max-width: 190px; }
    .stat:last-child { border-right: none; }
    .stat-num {
      font-size: 2.4rem; font-weight: 800; line-height: 1;
      color: var(--lime); font-feature-settings: 'tnum';
      margin-bottom: 6px; letter-spacing: -.02em;
    }
    .stat-label { font-size: .8rem; color: var(--fog); font-weight: 500; }
    @media (max-width: 640px) {
      /* minmax(0,1fr), а не 1fr: иначе длинная подпись растягивает колонку
         и плитки получаются разной ширины. */
      .stats-inner { grid-template-columns: repeat(2, minmax(0,1fr)); grid-auto-rows: 1fr; }
      .stat { min-height: 170px; padding: 28px 16px; }
      .stat-num { font-size: 2rem; }
      .stat:nth-child(2) { border-right: none; }
      .stat:nth-child(3) { border-right: 1px solid var(--border); border-top: 1px solid var(--border); }
      .stat:nth-child(4) { border-top: 1px solid var(--border); }
    }

    /* ── SECTIONS ── */
    section { padding: 100px 32px; }
    .section-inner { max-width: 1200px; margin: 0 auto; }
    .section-head { margin-bottom: 60px; }
    .section-tag {
      display: inline-block; font-size: .72rem; font-weight: 800;
      letter-spacing: .1em; text-transform: uppercase;
      color: var(--lime); margin-bottom: 14px;
    }
    .section-title {
      font-size: clamp(1.9rem,4vw,2.8rem); font-weight: 800;
      letter-spacing: -.02em; line-height: 1.15; margin-bottom: 16px;
    }
    .section-sub { font-size: 1.05rem; color: var(--fog); max-width: 520px; line-height: 1.75; }
    @media (max-width: 640px) { section { padding: 70px 20px; } }

    /* ── BENTO FEATURES ── */
    .bento {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      gap: 14px;
    }
    .bc { grid-column: span 4; }
    .bc-lg { grid-column: span 8; }
    .bc-md { grid-column: span 6; }
    @media (max-width: 1024px) {
      .bc-lg { grid-column: span 12; }
      .bc-md { grid-column: span 6; }
      .bc { grid-column: span 6; }
    }
    @media (max-width: 640px) {
      .bc-lg, .bc-md, .bc { grid-column: span 12; }
    }

    .feat-card {
      background: var(--s2); border: 1px solid var(--border);
      border-radius: 20px; padding: 28px; overflow: hidden;
      transition: border-color .25s, box-shadow .25s, transform .25s;
      cursor: default; position: relative;
    }
    .feat-card:hover {
      border-color: rgba(228,242,34,.2);
      box-shadow: 0 0 40px rgba(228,242,34,.06), 0 20px 60px rgba(0,0,0,.3);
      transform: translateY(-2px);
    }
    .feat-card::before {
      content: '';
      position: absolute; inset: 0; border-radius: 20px;
      background: radial-gradient(600px circle at var(--mx,50%) var(--my,50%), rgba(228,242,34,.04), transparent 40%);
      opacity: 0; transition: opacity .3s;
    }
    .feat-card:hover::before { opacity: 1; }
    .feat-icon {
      width: 44px; height: 44px; border-radius: 11px;
      background: rgba(228,242,34,.08); border: 1px solid rgba(228,242,34,.15);
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 18px;
    }
    .feat-icon svg { width: 20px; height: 20px; stroke: var(--lime); fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
    .feat-title { font-size: 1.05rem; font-weight: 700; margin-bottom: 8px; }
    .feat-desc { font-size: .875rem; color: var(--fog); line-height: 1.7; }

    /* Large card specific */
    .feat-card-lg .feat-title { font-size: 1.35rem; margin-bottom: 10px; }
    .feat-card-lg .feat-desc { max-width: 400px; margin-bottom: 24px; }

    /* Mini table inside large feature card */
    .feat-mini-table { border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
    .fmt-head { display: grid; grid-template-columns: 1fr 80px 60px; padding: 8px 12px; background: var(--s3); border-bottom: 1px solid var(--border); }
    .fmt-head span { font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--fog); }
    .fmt-row { display: grid; grid-template-columns: 1fr 80px 60px; padding: 9px 12px; border-bottom: 1px solid var(--border); align-items: center; }
    .fmt-row:last-child { border-bottom: none; }
    .fmt-name { font-size: .8rem; font-weight: 600; }
    .fmt-pos { font-size: .75rem; color: var(--fog); }
    .fmt-badge { display: inline-flex; align-items: center; gap: 4px; font-size: .72rem; font-weight: 700; padding: 2px 8px; border-radius: 5px; }
    .fmt-badge.y { background: rgba(228,242,34,.1); color: var(--lime); }
    .fmt-badge.n { background: rgba(245,101,101,.1); color: #f56565; }

    /* Chart inside analytics card */
    .feat-chart { display: flex; align-items: flex-end; gap: 6px; height: 70px; margin-top: 20px; }
    .feat-bar {
      flex: 1; border-radius: 4px 4px 0 0;
      background: rgba(228,242,34,.15);
      animation: bar-grow .9s cubic-bezier(.22,1,.36,1) both;
    }
    .feat-bar.hi { background: var(--lime); }
    .feat-bar:nth-child(1) { height: 55%; animation-delay: .05s; }
    .feat-bar:nth-child(2) { height: 72%; animation-delay: .1s; }
    .feat-bar:nth-child(3) { height: 48%; animation-delay: .15s; }
    .feat-bar:nth-child(4) { height: 88%; animation-delay: .2s; }
    .feat-bar:nth-child(5) { height: 65%; animation-delay: .25s; }
    .feat-bar:nth-child(6) { height: 94%; animation-delay: .3s; }
    .feat-bar:nth-child(7) { height: 79%; animation-delay: .35s; }

    /* ── HOW IT WORKS ── */
    .how-bg { background: var(--s1); }
    .steps { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 0; position: relative; }
    .steps::before {
      content: ''; position: absolute;
      top: 24px; left: calc(12.5% + 12px); right: calc(12.5% + 12px); height: 1px;
      background: linear-gradient(90deg, transparent, var(--border2) 20%, var(--border2) 80%, transparent);
    }
    .step { padding: 0 16px; position: relative; }
    .step-num {
      width: 48px; height: 48px; border-radius: 50%;
      border: 1px solid var(--border2); background: var(--s2);
      display: flex; align-items: center; justify-content: center;
      font-size: .9rem; font-weight: 800; color: var(--lime);
      margin-bottom: 20px; position: relative; z-index: 1;
    }
    .step h3 { font-size: 1rem; font-weight: 700; margin-bottom: 8px; }
    .step p { font-size: .875rem; color: var(--fog); line-height: 1.7; }
    @media (max-width: 720px) {
      .steps { grid-template-columns: 1fr 1fr; }
      .steps::before { display: none; }
      .step { padding: 0 0 32px; }
    }
    @media (max-width: 460px) {
      .steps { grid-template-columns: 1fr; }
    }

    /* ── ROLES ── */
    .roles-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
    .role-card {
      background: var(--s2); border: 1px solid var(--border);
      border-radius: 16px; padding: 24px;
      transition: border-color .2s, transform .2s; cursor: default;
    }
    .role-card:hover { border-color: var(--border2); transform: translateY(-2px); }
    .role-icon {
      width: 40px; height: 40px; border-radius: 10px;
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 14px;
    }
    .role-icon svg { width: 18px; height: 18px; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
    .ri-lime { background: rgba(228,242,34,.1); } .ri-lime svg { stroke: var(--lime); }
    .ri-blue { background: rgba(99,179,237,.1); } .ri-blue svg { stroke: #63b3ed; }
    .ri-purple { background: rgba(154,122,210,.1); } .ri-purple svg { stroke: #9a7ad2; }
    .ri-green { background: rgba(72,187,120,.1); } .ri-green svg { stroke: #48bb78; }
    .ri-orange { background: rgba(251,146,60,.1); } .ri-orange svg { stroke: #fb923c; }
    .ri-pink { background: rgba(236,72,153,.1); } .ri-pink svg { stroke: #ec4899; }
    .role-name { font-size: .95rem; font-weight: 700; margin-bottom: 6px; }
    .role-desc { font-size: .825rem; color: var(--fog); line-height: 1.65; }
    @media (max-width: 720px) { .roles-grid { grid-template-columns: repeat(2,1fr); } }
    @media (max-width: 460px) { .roles-grid { grid-template-columns: 1fr; } }

    /* ── CTA ── */
    .cta-section {
      text-align: center;
      background:
        radial-gradient(ellipse 70% 70% at 50% 50%, rgba(228,242,34,.07) 0%, transparent 60%),
        var(--bg);
      border-top: 1px solid var(--border);
    }
    .cta-section h2 { font-size: clamp(2rem,4vw,3rem); font-weight: 800; letter-spacing: -.02em; margin-bottom: 14px; }
    .cta-section p { font-size: 1.05rem; color: var(--fog); max-width: 480px; margin: 0 auto 36px; line-height: 1.7; }

    /* ── FOOTER ── */
    footer {
      padding: 40px 32px;
      border-top: 1px solid var(--border); background: var(--s1);
      display: flex; flex-direction: column; align-items: center; gap: 20px;
      text-align: center;
    }
    footer img { height: 20px; opacity: .4; }
    /* Пять ссылок в один ряд не помещаются на телефоне и уезжали за оба края
       экрана (2026-07-28). Перенос + центрирование вместо строки фиксированной
       ширины; на узких экранах ещё и подвал компактнее. */
    .footer-links {
      display: flex; flex-wrap: wrap; justify-content: center;
      gap: 12px 22px; max-width: 100%;
    }
    .footer-links a { font-size: .8rem; color: var(--fog); transition: color .15s; cursor: pointer; }
    .footer-links a:hover { color: var(--snow); }
    .footer-copy { font-size: .78rem; color: #3a3f48; }
    @media (max-width: 640px) {
      footer { padding: 32px 20px; gap: 16px; }
      .footer-links { gap: 10px 18px; }
    }

    /* ── MISC ── */
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
      [data-reveal] { opacity: 1 !important; transform: none !important; }
    }

    /* Якорные переходы: шапка зафиксирована на 64px, без этого отступа
       заголовок целевой секции уезжает под неё. */
    section[id] { scroll-margin-top: 84px; }

    /* ── ФОРМА ЗАЯВКИ ── */
    .lead-form { max-width: 720px; margin: 32px auto 0; text-align: left; }
    .lead-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
    .lead-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
    .lead-field--wide { grid-column: 1 / -1; }
    .lead-field > span { font-size: .8rem; color: var(--fog); }
    .lead-field > span i { color: var(--lime); font-style: normal; margin-left: 2px; }
    .lead-field input, .lead-field textarea {
      width: 100%; padding: 11px 13px; border-radius: 10px;
      background: var(--s2); border: 1px solid var(--border2); color: var(--snow);
      font-family: var(--font); font-size: .92rem; transition: border-color .15s, background .15s;
    }
    .lead-field input::placeholder, .lead-field textarea::placeholder { color: #4b535e; }
    .lead-field input:focus, .lead-field textarea:focus {
      outline: none; border-color: var(--lime); background: var(--s3);
    }
    .lead-field textarea { resize: vertical; min-height: 84px; }
    /* Ловушка для ботов: убрана из потока, но остаётся в DOM. display:none
       часть роботов пропускает, поэтому прячем позиционированием. */
    .lead-trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
    .lead-actions { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 18px; }
    .lead-actions .btn-lime { display: inline-flex; }
    .lead-actions .btn-lime[disabled] { opacity: .6; cursor: default; }
    .lead-alt { display: flex; align-items: center; gap: 10px; color: var(--fog); font-size: .85rem; }
    .lead-note { margin-top: 14px; font-size: .78rem; color: var(--fog); line-height: 1.5; }
    .lead-note a { color: var(--mist); text-decoration: underline; text-underline-offset: 2px; }
    .lead-msg { margin-top: 12px; font-size: .88rem; min-height: 1.2em; }
    .lead-msg.ok { color: var(--lime); }
    .lead-msg.err { color: #ff8f6b; }
    @media (max-width: 640px) {
      .lead-grid { grid-template-columns: 1fr; }
      .lead-actions { gap: 14px; }
    }