/* ═══════════════════════════════════════════════════════════════
   Мир 2 — ИИ, n8n, GenAI.
   Своя система токенов, объявленная НА ЭЛЕМЕНТЕ МИРА: оба мира
   присутствуют на экране одновременно, и бумажный обязан остаться
   бумажным, пока активен неон.
   Всё, чего в аудиторском мире нет по принципу: скругления,
   свечения, градиенты, крупный гротеск, движение.
   ═══════════════════════════════════════════════════════════════ */

.world--ai{
  --void:#07070a;
  --void-2:#0c0c12;
  --haze:#12101c;
  --panel:#0f0f16;
  --line:#30303d;
  --line-2:#3d3d4c;   /* рамки карточек были неразличимы: 1.28 */

  --acid:#c9ff2e;
  --magenta:#ff2bd1;
  --cyan:#26f5ff;

  --fg:#f2f2f5;
  --fg-2:#a8a8b8;
  --fg-3:#8d8da0;   /* 6.18 на фоне, 5.86 на карточке — WCAG AA */

  --wrap:1240px;
  --pad:26px;
  --gutter:152px;
  --gap:44px;

  background:var(--void);
  color:var(--fg);
  font:400 17px/1.6 var(--mono);
  -webkit-font-smoothing:antialiased;
}
@media(max-width:420px){.world--ai{--pad:20px}}

.world--ai::selection,
.world--ai ::selection{background:var(--acid);color:var(--void)}
.world--ai :focus-visible{outline:2px solid var(--acid);outline-offset:3px}

.nwrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}

/* ───────────────────────────────── шапка ── */
.nbar{
  position:sticky;top:0;z-index:30;
  background:color-mix(in srgb,var(--void) 82%,transparent);
  backdrop-filter:saturate(160%) blur(12px);
  border-bottom:1px solid var(--line);
}
html[data-swapping] .nbar{backdrop-filter:none;background:var(--void)}
.nbar__in{display:flex;align-items:center;justify-content:space-between;height:56px;gap:24px}
.nbar__name{
  font-family:var(--display);font-weight:800;font-size:12px;
  letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;
  color:var(--acid);
}
.nbar__dot{color:var(--fg-3);margin:0 .55em;font-weight:600}
.nbar__topic{color:var(--fg-3);font-weight:500}
.nbar__nav{display:flex;gap:22px;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.nbar__nav a{color:var(--fg-2);padding-block:6px;border-bottom:1px solid transparent;transition:color .18s ease,border-color .18s ease}
.nbar__nav a:hover{color:var(--acid);border-bottom-color:var(--acid)}
/* обратный переход: зеркало «ИИ →» на бумажной стороне */
.nbar__cross{color:var(--acid);font-weight:600;white-space:nowrap}
.nbar__cross:hover{color:var(--void);background:var(--acid);border-bottom-color:var(--acid)}
@media(max-width:1100px){.nbar__topic{display:none}}
@media(max-width:900px){
  .nbar__nav a{display:none}
  .nbar__cross{display:inline}
}

/* ───────────────────────────────── герой ── */
.neon{position:relative}
.neon > .nwrap{position:relative;z-index:1}

.nhero{position:relative;padding:82px 0 64px}

/* световые пятна: единственное «мягкое» место во всём проекте.
   Живут на всю ширину панели, а не внутри колонки контента —
   иначе фон обрезается по .nwrap и читается как рамка.
   Строго в границах панели: отрицательные инсеты раздували
   scrollWidth скроллера и давали горизонтальную прокрутку. */
.nglow{
  position:absolute;top:-140px;left:0;right:0;height:1120px;
  pointer-events:none;z-index:0;
  background:
    radial-gradient(48% 40% at 12% 18%, rgba(201,255,46,.16), transparent 68%),
    radial-gradient(42% 38% at 82% 8%,  rgba(255,43,209,.17), transparent 70%),
    radial-gradient(52% 46% at 62% 76%, rgba(38,245,255,.11), transparent 72%);
  filter:blur(6px);
}

.nhero__eyebrow{
  font-size:11.5px;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;color:var(--acid);
  margin:0 0 30px;
}
.nhero__h1{
  font-family:var(--display);font-weight:800;
  font-size:clamp(34px,7.2vw,88px);
  line-height:.98;letter-spacing:-.045em;
  margin:0 0 32px;
  text-wrap:balance;
}
.nhero__h1 em{
  font-style:normal;
  background:linear-gradient(96deg,var(--acid),var(--cyan) 52%,var(--magenta));
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.nhero__lede{
  font-size:clamp(16.5px,1.8vw,19px);line-height:1.62;
  max-width:62ch;margin:0 0 40px;color:var(--fg-2);
}
.nhero__lede b{color:var(--fg);font-weight:500}

/* ─── портрет: та же двухколоночная сетка, что в аудиторском мире ── */
.nhero__top{
  display:grid;grid-template-columns:minmax(0,1fr) 248px;
  gap:0 56px;align-items:start;margin-bottom:46px;
}
.nhero__text{min-width:0}
.nhero__text > :last-child{margin-bottom:0}
.nportrait{margin:0;padding-top:6px}
.nportrait img{
  display:block;width:100%;height:auto;
  aspect-ratio:640/930;object-fit:cover;
  border:1px solid var(--line-2);border-radius:14px;
  filter:saturate(1.06) contrast(1.04);
  box-shadow:0 0 0 1px rgba(201,255,46,.09), 0 26px 64px rgba(0,0,0,.55);
}
.nportrait figcaption{
  margin-top:13px;
  font-size:11.5px;font-weight:600;line-height:1.5;
  letter-spacing:.1em;text-transform:uppercase;color:var(--fg-2);
}
.nportrait__role{
  display:block;margin-top:7px;padding-top:7px;
  border-top:1px solid var(--line);
  font-weight:500;letter-spacing:.12em;color:var(--acid);
}
@media(max-width:900px){
  .nhero__top{grid-template-columns:1fr;gap:0;margin-bottom:36px}
  .nportrait{max-width:180px;margin-top:34px;padding-top:0}
}

.nfacts{
  display:flex;flex-wrap:wrap;gap:24px 46px;
  margin:0;padding:26px 0 0;list-style:none;
  border-top:1px solid var(--line);
}
.nfacts li{display:flex;flex-direction:column;gap:5px}
/* четыре пункта, два из них — пары «было → стало», поэтому кегль ниже
   и переносов внутри числа быть не должно */
.nfacts b{
  font-family:var(--display);font-weight:800;
  font-size:clamp(24px,3.1vw,38px);line-height:1;letter-spacing:-.04em;
  color:var(--acid);font-variant-numeric:tabular-nums;white-space:nowrap;
}
.nfacts span{font-size:12px;letter-spacing:.07em;text-transform:uppercase;color:var(--fg-3)}

/* ───────────────────────────────── секции ── */
.nsec{
  display:grid;grid-template-columns:var(--gutter) minmax(0,1fr);gap:0 var(--gap);
  padding:66px 0;border-top:1px solid var(--line);scroll-margin-top:70px;
}
.nsec__label{
  font-size:11.5px;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:var(--acid);
  position:sticky;top:82px;align-self:start;margin:0;
}
.nsec__body > :first-child{margin-top:0}
.nsec__h{
  font-family:var(--display);font-weight:600;
  font-size:clamp(21px,2.6vw,31px);line-height:1.16;letter-spacing:-.035em;
  margin:0 0 22px;max-width:26ch;text-wrap:balance;
}
.ndim{color:var(--fg-2);max-width:64ch;margin:0 0 18px;font-size:16px;line-height:1.62}
@media(max-width:820px){
  .nsec{grid-template-columns:1fr;gap:0}
  .nsec__label{position:static;margin-bottom:22px}
}

/* ─── четыре фильтра ──
   Явные две колонки, а не auto-fit: четыре карточки в auto-fit
   раскладываются 3 + 1 и ряд выглядит обрубленным */
.ngates{
  display:grid;gap:14px;margin:30px 0 0;padding:0;list-style:none;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
@media(max-width:620px){.ngates{grid-template-columns:1fr}}
.ngate{
  position:relative;
  padding:24px 22px 22px;
  background:linear-gradient(168deg,var(--panel),var(--void-2));
  border:1px solid var(--line);border-radius:14px;
  transition:border-color .22s ease,transform .22s ease;
}
.ngate:hover{border-color:var(--line-2);transform:translateY(-2px)}
.ngate__num{
  display:block;
  font-family:var(--display);font-weight:800;font-size:12px;
  letter-spacing:.14em;color:var(--magenta);margin-bottom:12px;
}
.ngate h4{
  font-family:var(--display);font-weight:600;font-size:16px;letter-spacing:-.02em;
  margin:0 0 10px;color:var(--fg);
}
.ngate p{margin:0;font-size:14.5px;line-height:1.58;color:var(--fg-2)}
.ngate b{color:var(--acid);font-weight:500}

/* ─── кейсы ── */
.ncase{
  margin:0 0 14px;padding:26px 24px;
  background:var(--panel);
  border:1px solid var(--line);border-radius:16px;
  transition:border-color .22s ease;
}
.ncase:hover{border-color:var(--line-2)}
.ncase--lead{
  background:
    radial-gradient(120% 140% at 0% 0%, rgba(201,255,46,.07), transparent 58%),
    var(--panel);
  border-color:#33361f;
}
.ncase__head{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-bottom:18px}
.ncase__title{
  font-family:var(--display);font-weight:600;font-size:clamp(17px,2vw,21px);
  letter-spacing:-.03em;line-height:1.2;margin:0;flex:1 1 auto;
}
.ntag{
  font-size:10.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  padding:5px 10px;border-radius:999px;white-space:nowrap;
}
.ntag--live{color:var(--acid);background:rgba(201,255,46,.1);border:1px solid rgba(201,255,46,.32)}
.ntag--pilot{color:var(--cyan);background:rgba(38,245,255,.08);border:1px solid rgba(38,245,255,.28)}

.ncase__body{margin:0;display:grid;grid-template-columns:11ch minmax(0,1fr);gap:0 22px}
.ncase__body dt{
  font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--fg-3);
  padding:13px 0;border-top:1px solid var(--line);
}
.ncase__body dd{
  margin:0;padding:13px 0;border-top:1px solid var(--line);
  font-size:15px;line-height:1.58;color:var(--fg-2);
}
.ncase__body dd b{color:var(--fg);font-weight:500}
.ncase__body dt:first-of-type,
.ncase__body dd:first-of-type{border-top:0;padding-top:0}
@media(max-width:640px){
  .ncase__body{grid-template-columns:1fr;gap:0}
  .ncase__body dt{padding-bottom:3px;border-top:1px solid var(--line)}
  .ncase__body dd{padding-top:0;border-top:0}
  .ncase__body dd:first-of-type{padding-top:0}
}

.nmetrics{margin:0;padding:0;list-style:none;display:grid;gap:7px}
.nmetrics li{
  position:relative;padding-left:18px;
  font-size:14.5px;line-height:1.5;color:var(--fg-2);
}
.nmetrics li::before{
  content:"";position:absolute;left:0;top:.62em;
  width:7px;height:7px;border-radius:2px;background:var(--acid);
}
.nmetrics b{
  color:var(--acid);font-weight:600;
  font-variant-numeric:tabular-nums;letter-spacing:-.01em;
}

.nalso{
  margin:26px 0 0;padding:20px 22px;
  border:1px dashed var(--line-2);border-radius:14px;
  font-size:14.5px;line-height:1.6;color:var(--fg-3);
}

/* ─── цитата ── */
.nquote{
  margin:28px 0;padding:24px 26px;
  border:0;border-left:2px solid var(--magenta);border-radius:0 14px 14px 0;
  background:linear-gradient(96deg,rgba(255,43,209,.09),transparent 62%);
}
.nquote p{
  margin:0;font-size:clamp(16.5px,2vw,20px);line-height:1.48;
  letter-spacing:-.02em;color:var(--fg);
}
.nquote cite{
  display:block;margin-top:14px;font-style:normal;
  font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--fg-3);
}
.nquote--soft{border-left-color:var(--acid);background:linear-gradient(96deg,rgba(201,255,46,.08),transparent 62%)}

/* ─── границы ── */
.nlimits{margin:26px 0 0}
.nlimit{padding:20px 0;border-top:1px solid var(--line)}
.nlimit:last-child{border-bottom:1px solid var(--line)}
.nlimit dt{
  font-family:var(--display);font-weight:600;font-size:15.5px;letter-spacing:-.02em;
  color:var(--fg);margin-bottom:8px;
}
.nlimit dd{margin:0;font-size:15px;line-height:1.6;color:var(--fg-2);max-width:70ch}

/* ─── инструмент ── */
.ncraft{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:26px 0 0}
.ncraft__item{
  padding:24px 22px;border:1px solid var(--line);border-radius:14px;
  background:linear-gradient(168deg,var(--panel),var(--void-2));
}
.ncraft__item h4{
  font-family:var(--display);font-weight:600;font-size:16px;letter-spacing:-.02em;
  margin:0 0 10px;color:var(--acid);
}
.ncraft__item p{margin:0;font-size:14.5px;line-height:1.58;color:var(--fg-2)}
.ncraft__item b{color:var(--fg);font-weight:500}

/* ─── регистр мер безопасности ── */
.nreg{margin:26px 0 0}
.nreg__row{
  display:grid;grid-template-columns:20ch minmax(0,1fr);gap:0 24px;
  padding:15px 0;border-top:1px solid var(--line);
}
.nreg__row:last-child{border-bottom:1px solid var(--line)}
.nreg dt{font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--acid);padding-top:3px}
.nreg dd{margin:0;font-size:15px;line-height:1.56;color:var(--fg-2)}
@media(max-width:640px){
  .nreg__row{grid-template-columns:1fr;gap:6px}
  .nreg dt{padding-top:0}
}

/* ─── стек ── */
.nstack{display:flex;flex-wrap:wrap;gap:9px;margin:0;padding:0;list-style:none}
.nstack li{
  padding:8px 14px;border:1px solid var(--line-2);border-radius:999px;
  font-size:12.5px;letter-spacing:.03em;color:var(--fg-2);
  transition:color .18s ease,border-color .18s ease;
}
.nstack li:hover{color:var(--acid);border-color:var(--acid)}

/* ───────────────────────────────── подвал ── */
.nfoot{
  position:relative;overflow:hidden;
  padding:76px 0 88px;border-top:1px solid var(--line);
  background:
    radial-gradient(60% 120% at 8% 0%, rgba(255,43,209,.13), transparent 66%),
    radial-gradient(56% 120% at 92% 100%, rgba(38,245,255,.1), transparent 68%),
    var(--void-2);
}
.nfoot h3{
  font-family:var(--display);font-weight:800;
  font-size:clamp(26px,4.4vw,50px);letter-spacing:-.045em;line-height:1.02;
  margin:0 0 16px;
}
.nfoot p{margin:0;color:var(--fg-2);max-width:54ch;font-size:16px;line-height:1.6}
.nfoot__cta{display:flex;flex-wrap:wrap;gap:12px;margin:32px 0 0}
.nbtn{
  display:inline-block;padding:14px 24px;border-radius:999px;
  font-size:13.5px;letter-spacing:.03em;
  border:1px solid var(--line-2);color:var(--fg);
  transition:border-color .2s ease,color .2s ease,background .2s ease,box-shadow .2s ease;
}
.nbtn:hover{border-color:var(--fg-2);color:var(--fg)}
.nbtn--primary{
  background:var(--acid);color:var(--void);border-color:var(--acid);font-weight:500;
}
.nbtn--primary:hover{
  background:var(--acid);color:var(--void);
  box-shadow:0 0 0 4px rgba(201,255,46,.18), 0 0 28px rgba(201,255,46,.35);
}
.nfoot__fine{
  margin-top:40px;padding-top:20px;border-top:1px solid var(--line);
  font-size:11.5px;line-height:1.7;letter-spacing:.03em;
  color:var(--fg-3);max-width:72ch;
}

/* ───────────────────────────────── движение ──
   Анимации объявлены внутри no-preference, а не глушатся !important-ом */
@media (prefers-reduced-motion: no-preference){
  @keyframes ndrift{
    0%   {transform:translate3d(0,0,0) scale(1)}
    50%  {transform:translate3d(1.5%,-2%,0) scale(1.06)}
    100% {transform:translate3d(0,0,0) scale(1)}
  }
  .nglow{animation:ndrift 19s ease-in-out infinite}

  @keyframes npulse{
    0%,100%{opacity:.34}
    50%    {opacity:1}
  }
  .ntag--live::before{
    content:"";display:inline-block;vertical-align:middle;
    width:5px;height:5px;border-radius:50%;background:var(--acid);
    margin-right:7px;margin-top:-1px;
    animation:npulse 2.4s ease-in-out infinite;
  }
}
