/* ============================================================================
   Nocturne — тёмная flat-тема для сервисного блога.
   Всё на CSS-переменных, без внешних зависимостей: CSP пускает только свои
   файлы, поэтому ни шрифтов с CDN, ни иконочных библиотек здесь нет.
   Иконки услуг — CSS-маски (см. блок «Иконки категорий»).
   ========================================================================= */

:root {
  --nc-bg:        #05070c;
  --nc-bg-soft:   #080b13;
  --nc-card:      #0c111c;
  --nc-card-2:    #111827;
  --nc-line:      rgba(255, 255, 255, .07);
  --nc-line-2:    rgba(255, 255, 255, .14);
  --nc-text:      #e9edf7;
  --nc-dim:       #aab3c5;
  --nc-muted:     #7c869c;
  --nc-accent:    #2b6cff;
  --nc-accent-2:  #5b8dff;
  --nc-radius:    16px;
  --nc-radius-sm: 10px;
  --nc-wrap:      1180px;
  --nc-gap:       22px;
  --nc-shadow:    0 24px 60px rgba(0, 0, 0, .55);
  --nc-ease:      cubic-bezier(.22, .61, .36, 1);

  /* Палитра неоновых акцентов — по кругу для карточек и рекламы */
  --nc-c1: #3b82f6;
  --nc-c2: #22c55e;
  --nc-c3: #f5b301;
  --nc-c4: #a855f7;
  --nc-c5: #2dd4bf;
  --nc-c6: #fb7185;
  --nc-c7: #38bdf8;
  --nc-c8: #f97316;
}

/* Тема всегда тёмная: светлого варианта у неё нет, поэтому фиксируем схему,
   чтобы браузер рисовал системные контролы (скроллы, поля) в тон. */
body.nocturne { color-scheme: dark; }

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

body.nocturne {
  margin: 0;
  background: var(--nc-bg);
  color: var(--nc-text);
  font: 400 16px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

/* Базовая типографика — через :where(), чтобы компонентные классы
   перебивали её без !important. */
:where(body.nocturne) a { color: var(--nc-accent-2); text-decoration: none; }
:where(body.nocturne) a:hover { color: #8fb4ff; }
:where(body.nocturne) h1, :where(body.nocturne) h2,
:where(body.nocturne) h3, :where(body.nocturne) h4 {
  margin: 0 0 .5em;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -.02em;
}
:where(body.nocturne) p { margin: 0 0 1em; }
:where(body.nocturne) img { max-width: 100%; height: auto; }
:where(body.nocturne) hr { border: 0; border-top: 1px solid var(--nc-line); margin: 32px 0; }

body.nocturne [hidden] { display: none !important; }

.nc-wrap { width: 100%; max-width: var(--nc-wrap); margin: 0 auto; padding: 0 20px; }

.nc-skip {
  position: absolute; left: -9999px; top: 0; z-index: 100;
  background: var(--nc-accent); color: #fff; padding: 10px 16px; border-radius: 0 0 8px 0;
}
.nc-skip:focus { left: 0; }

/* ---------------------------------------------------------------- шапка --- */

.nc-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(5, 7, 12, .82);
  backdrop-filter: saturate(140%) blur(14px);
  border-bottom: 1px solid var(--nc-line);
}

.nc-header__in {
  display: flex; align-items: center; gap: 26px;
  min-height: 72px;
}

.nc-logo { display: inline-flex; align-items: center; gap: 12px; color: var(--nc-text); font-weight: 800; }
.nc-logo:hover { color: var(--nc-text); }
.nc-logo__mark {
  width: 38px; height: 38px; flex: none;
  display: grid; place-items: center;
  border-radius: 11px;
  background: linear-gradient(140deg, var(--nc-accent), #7c3aed);
  color: #fff; font-size: 20px; font-weight: 800; letter-spacing: -.04em;
  box-shadow: 0 8px 22px rgba(43, 108, 255, .38);
}
.nc-logo__text { font-size: 20px; letter-spacing: .14em; text-transform: uppercase; }

.nc-nav { display: flex; align-items: center; gap: 6px; margin-left: auto; }
.nc-nav__link {
  position: relative;
  padding: 10px 14px;
  border-radius: 10px;
  color: var(--nc-dim);
  font-size: 15px;
  transition: color .2s var(--nc-ease), background .2s var(--nc-ease);
}
.nc-nav__link::after {
  content: ""; position: absolute; left: 14px; right: 14px; bottom: 4px; height: 2px;
  border-radius: 2px; background: var(--nc-accent);
  transform: scaleX(0); transform-origin: center; transition: transform .25s var(--nc-ease);
}
.nc-nav__link:hover { color: var(--nc-text); background: rgba(255, 255, 255, .04); }
.nc-nav__link:hover::after,
.nc-nav__link.is-active::after { transform: scaleX(1); }
.nc-nav__link.is-active { color: var(--nc-text); }

.nc-btn {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 11px 20px;
  border: 1px solid transparent;
  border-radius: 12px;
  font-size: 15px; font-weight: 600;
  cursor: pointer;
  transition: transform .2s var(--nc-ease), box-shadow .25s var(--nc-ease),
              background .2s var(--nc-ease), border-color .2s var(--nc-ease), color .2s var(--nc-ease);
}
.nc-btn--primary {
  background: var(--nc-accent); color: #fff;
  box-shadow: 0 10px 26px rgba(43, 108, 255, .32);
}
.nc-btn--primary:hover { background: #3b7bff; color: #fff; transform: translateY(-2px); box-shadow: 0 16px 34px rgba(43, 108, 255, .42); }
.nc-btn--ghost { background: transparent; border-color: var(--nc-line-2); color: var(--nc-text); }
.nc-btn--ghost:hover { border-color: var(--nc-accent); color: #fff; transform: translateY(-2px); }
.nc-btn--sm { padding: 8px 14px; font-size: 14px; border-radius: 10px; }
.nc-btn__ico { width: 18px; height: 18px; flex: none; }

.nc-burger {
  display: none; width: 42px; height: 42px; flex: none;
  border: 1px solid var(--nc-line-2); border-radius: 11px;
  background: transparent; color: var(--nc-text); cursor: pointer;
  align-items: center; justify-content: center;
}
.nc-burger__bar, .nc-burger__bar::before, .nc-burger__bar::after {
  content: ""; display: block; width: 18px; height: 2px; border-radius: 2px; background: currentColor;
  transition: transform .25s var(--nc-ease), opacity .2s var(--nc-ease);
}
.nc-burger__bar::before { transform: translateY(-6px); }
.nc-burger__bar::after  { transform: translateY(4px); }
.nc-header.is-open .nc-burger__bar { background: transparent; }
.nc-header.is-open .nc-burger__bar::before { transform: rotate(45deg); }
.nc-header.is-open .nc-burger__bar::after  { transform: rotate(-45deg) translateY(-1px); }

/* --------------------------------------------------------------- секции --- */

.nc-sec { padding: 68px 0; }
.nc-sec--tight { padding: 10px 0 56px; }
.nc-sec--first { padding-top: 78px; }

.nc-head { text-align: center; margin-bottom: 38px; }
.nc-head__title { font-size: clamp(30px, 4.4vw, 46px); margin: 0; }
.nc-head__title em { font-style: normal; color: var(--nc-accent-2); }
.nc-head__sub { color: var(--nc-muted); margin: 14px auto 0; max-width: 640px; font-size: 16px; }
.nc-head__rule {
  width: 74px; height: 3px; border-radius: 3px; margin: 18px auto 0;
  background: linear-gradient(90deg, transparent, var(--nc-accent), transparent);
}
.nc-head--left { text-align: left; }
.nc-head--left .nc-head__rule { margin-left: 0; }

.nc-kicker {
  display: inline-block; font-size: 12px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--nc-muted);
}

/* ------------------------------------------------------- реклама партнёров */

.nc-pn { margin: 0; }
.nc-pn__head { text-align: center; margin-bottom: 22px; }
.nc-pn__title { font-size: 20px; margin: 0; }
.nc-pn__rule { width: 54px; height: 2px; background: var(--nc-line-2); border-radius: 2px; margin: 12px auto 0; }

/* Ключевое требование: сколько баннеров активно — столько колонок и будет.
   auto-fit схлопывает пустые треки, поэтому 3 карточки встают в 3 колонки,
   4 — в 4, и всё это без единого JS. */
.nc-pn__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: var(--nc-gap);
}

.nc-pncard {
  --nc-pncard-accent: var(--nc-accent);
  position: relative; overflow: hidden;
  display: flex; flex-direction: column; justify-content: space-between;
  min-height: 246px; padding: 20px;
  border: 1px solid var(--nc-line);
  border-radius: var(--nc-radius);
  background:
    radial-gradient(120% 100% at 100% 0%, color-mix(in srgb, var(--nc-pncard-accent) 26%, transparent) 0%, transparent 62%),
    var(--nc-card);
  color: var(--nc-text);
  transition: transform .3s var(--nc-ease), border-color .3s var(--nc-ease), box-shadow .3s var(--nc-ease);
}
.nc-pncard:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--nc-pncard-accent) 55%, transparent);
  box-shadow: 0 22px 46px rgba(0, 0, 0, .5);
  color: var(--nc-text);
}
.nc-pncard__badge {
  align-self: flex-start;
  font-size: 10px; letter-spacing: .14em; text-transform: uppercase;
  padding: 5px 10px; border-radius: 7px;
  border: 1px solid var(--nc-line-2);
  background: rgba(255, 255, 255, .05);
  color: var(--nc-dim);
}
.nc-pncard__title { font-size: 19px; margin: 14px 0 0; text-transform: uppercase; letter-spacing: -.01em; max-width: 78%; }
.nc-pncard__sub { color: var(--nc-dim); font-size: 14px; margin: 10px 0 0; max-width: 74%; }
.nc-pncard__cta {
  align-self: flex-start; margin-top: 18px;
  padding: 9px 16px; border-radius: 9px;
  background: var(--nc-pncard-accent); color: #fff;
  font-size: 14px; font-weight: 600;
  transition: transform .25s var(--nc-ease), filter .25s var(--nc-ease);
}
.nc-pncard:hover .nc-pncard__cta { transform: translateY(-1px); filter: brightness(1.08); }
.nc-pncard__img {
  position: absolute; right: -6px; bottom: -6px;
  width: 54%; max-width: 210px; height: auto;
  object-fit: contain;
  opacity: .95;
  transition: transform .45s var(--nc-ease);
  pointer-events: none;
}
.nc-pncard:hover .nc-pncard__img { transform: scale(1.06) translateY(-4px); }
.nc-pncard__glow {
  position: absolute; inset: auto -30% -60% auto; width: 260px; height: 260px;
  background: radial-gradient(circle, color-mix(in srgb, var(--nc-pncard-accent) 45%, transparent), transparent 70%);
  filter: blur(18px); opacity: .5; pointer-events: none;
}

/* Цвет по порядку карточки, если рекламодатель не задал свой */
.nc-pncard--0 { --nc-pncard-accent: var(--nc-c1); }
.nc-pncard--1 { --nc-pncard-accent: var(--nc-c2); }
.nc-pncard--2 { --nc-pncard-accent: var(--nc-c4); }
.nc-pncard--3 { --nc-pncard-accent: var(--nc-c3); }
.nc-pncard--4 { --nc-pncard-accent: var(--nc-c5); }
.nc-pncard--5 { --nc-pncard-accent: var(--nc-c6); }
.nc-pncard--6 { --nc-pncard-accent: var(--nc-c7); }
.nc-pncard--7 { --nc-pncard-accent: var(--nc-c8); }

/* ---------------------------------------------------------------- услуги --- */

.nc-services {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--nc-gap);
}

.nc-svc {
  --nc-svc-accent: var(--nc-c1);
  position: relative; overflow: hidden;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: 34px 26px 30px;
  border: 1px solid var(--nc-line);
  border-radius: var(--nc-radius);
  background: var(--nc-card);
  color: var(--nc-text);
  transition: transform .3s var(--nc-ease), border-color .3s var(--nc-ease), background .3s var(--nc-ease);
}
.nc-svc::before {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(100% 70% at 50% 0%, color-mix(in srgb, var(--nc-svc-accent) 16%, transparent), transparent 70%);
  opacity: 0; transition: opacity .35s var(--nc-ease); pointer-events: none;
}
.nc-svc:hover {
  transform: translateY(-5px);
  border-color: color-mix(in srgb, var(--nc-svc-accent) 45%, transparent);
  color: var(--nc-text);
}
.nc-svc:hover::before { opacity: 1; }

.nc-svc__ico {
  width: 54px; height: 54px; margin-bottom: 18px;
  background-color: var(--nc-svc-accent);
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-size: contain; mask-size: contain;
  filter: drop-shadow(0 0 10px color-mix(in srgb, var(--nc-svc-accent) 55%, transparent));
  transition: transform .35s var(--nc-ease), filter .35s var(--nc-ease);
}
.nc-svc:hover .nc-svc__ico {
  transform: translateY(-3px) scale(1.06);
  filter: drop-shadow(0 0 18px color-mix(in srgb, var(--nc-svc-accent) 75%, transparent));
}

.nc-svc__title { font-size: 19px; margin: 0; }
.nc-svc__rule {
  width: 42px; height: 2px; border-radius: 2px; margin: 12px 0 14px;
  background: var(--nc-svc-accent); opacity: .75;
  transition: width .35s var(--nc-ease);
}
.nc-svc:hover .nc-svc__rule { width: 72px; }
.nc-svc__text { color: var(--nc-muted); font-size: 14.5px; margin: 0; }
.nc-svc__count {
  margin-top: 14px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--nc-muted);
}

.nc-svc:nth-child(8n+1) { --nc-svc-accent: var(--nc-c1); }
.nc-svc:nth-child(8n+2) { --nc-svc-accent: var(--nc-c2); }
.nc-svc:nth-child(8n+3) { --nc-svc-accent: var(--nc-c3); }
.nc-svc:nth-child(8n+4) { --nc-svc-accent: var(--nc-c4); }
.nc-svc:nth-child(8n+5) { --nc-svc-accent: var(--nc-c5); }
.nc-svc:nth-child(8n+6) { --nc-svc-accent: var(--nc-c6); }
.nc-svc:nth-child(8n+7) { --nc-svc-accent: var(--nc-c7); }
.nc-svc:nth-child(8n+8) { --nc-svc-accent: var(--nc-c8); }

/* ---------------------------------------------------- иконки категорий ----
   Класс карточки собирается из slug категории: nc-ico-{slug}. Совпал slug —
   встала тематическая иконка, не совпал — осталась базовая «папка».
   Ни поля в базе, ни JavaScript для этого не нужны: админ просто даёт
   категории понятный адрес. Список поддерживаемых адресов — ниже. */

.nc-svc__ico {
  -webkit-mask-image: url("icons/default.svg");
  mask-image: url("icons/default.svg");
}

.nc-ico-documents,
.nc-ico-dokumenty,
.nc-ico-dokumenti,
.nc-ico-docs,
.nc-ico-document,
.nc-ico-dokumenty-ukrainy {
  -webkit-mask-image: url("icons/documents.svg");
  mask-image: url("icons/documents.svg");
}

.nc-ico-visa,
.nc-ico-visas,
.nc-ico-vizy,
.nc-ico-vizi,
.nc-ico-viza {
  -webkit-mask-image: url("icons/visa.svg");
  mask-image: url("icons/visa.svg");
}

.nc-ico-insurance,
.nc-ico-strahovanie,
.nc-ico-strakhovanie,
.nc-ico-pension,
.nc-ico-pensiya,
.nc-ico-strahovka {
  -webkit-mask-image: url("icons/insurance.svg");
  mask-image: url("icons/insurance.svg");
}

.nc-ico-residence,
.nc-ico-vnzh,
.nc-ico-vnj,
.nc-ico-legalization,
.nc-ico-legalizaciya,
.nc-ico-permit,
.nc-ico-rezidentstvo {
  -webkit-mask-image: url("icons/residence.svg");
  mask-image: url("icons/residence.svg");
}

.nc-ico-attorney,
.nc-ico-doverennosti,
.nc-ico-doverennost,
.nc-ico-power-of-attorney,
.nc-ico-poa {
  -webkit-mask-image: url("icons/attorney.svg");
  mask-image: url("icons/attorney.svg");
}

.nc-ico-certificate,
.nc-ico-certificates,
.nc-ico-spravki,
.nc-ico-svidetelstva,
.nc-ico-svidetelstvo,
.nc-ico-spravka {
  -webkit-mask-image: url("icons/certificate.svg");
  mask-image: url("icons/certificate.svg");
}

.nc-ico-consult,
.nc-ico-consulting,
.nc-ico-consultation,
.nc-ico-consultations,
.nc-ico-konsultacii,
.nc-ico-konsultaciya {
  -webkit-mask-image: url("icons/consult.svg");
  mask-image: url("icons/consult.svg");
}

.nc-ico-travel,
.nc-ico-tickets,
.nc-ico-bilety,
.nc-ico-flights,
.nc-ico-tours,
.nc-ico-poezdki {
  -webkit-mask-image: url("icons/travel.svg");
  mask-image: url("icons/travel.svg");
}

.nc-ico-work,
.nc-ico-jobs,
.nc-ico-rabota,
.nc-ico-employment,
.nc-ico-vakansii {
  -webkit-mask-image: url("icons/work.svg");
  mask-image: url("icons/work.svg");
}

.nc-ico-health,
.nc-ico-medicine,
.nc-ico-medicina,
.nc-ico-zdorovye,
.nc-ico-med {
  -webkit-mask-image: url("icons/health.svg");
  mask-image: url("icons/health.svg");
}

.nc-ico-education,
.nc-ico-obrazovanie,
.nc-ico-courses,
.nc-ico-kursy,
.nc-ico-school {
  -webkit-mask-image: url("icons/education.svg");
  mask-image: url("icons/education.svg");
}

.nc-ico-housing,
.nc-ico-zhilyo,
.nc-ico-realty,
.nc-ico-nedvizhimost,
.nc-ico-rent,
.nc-ico-arenda {
  -webkit-mask-image: url("icons/housing.svg");
  mask-image: url("icons/housing.svg");
}

.nc-ico-money,
.nc-ico-finance,
.nc-ico-finansy,
.nc-ico-banking,
.nc-ico-credit,
.nc-ico-kredity {
  -webkit-mask-image: url("icons/money.svg");
  mask-image: url("icons/money.svg");
}

.nc-ico-law,
.nc-ico-legal,
.nc-ico-yuridicheskie,
.nc-ico-pravo,
.nc-ico-lawyer,
.nc-ico-yurist {
  -webkit-mask-image: url("icons/law.svg");
  mask-image: url("icons/law.svg");
}

.nc-ico-translate,
.nc-ico-translation,
.nc-ico-perevody,
.nc-ico-perevod,
.nc-ico-apostille,
.nc-ico-apostil {
  -webkit-mask-image: url("icons/translate.svg");
  mask-image: url("icons/translate.svg");
}

.nc-ico-family,
.nc-ico-semya,
.nc-ico-children,
.nc-ico-deti,
.nc-ico-brak {
  -webkit-mask-image: url("icons/family.svg");
  mask-image: url("icons/family.svg");
}

.nc-ico-transport,
.nc-ico-avto,
.nc-ico-auto,
.nc-ico-cars,
.nc-ico-driving,
.nc-ico-prava {
  -webkit-mask-image: url("icons/transport.svg");
  mask-image: url("icons/transport.svg");
}

.nc-ico-more,
.nc-ico-other,
.nc-ico-drugie,
.nc-ico-other-services,
.nc-ico-extra,
.nc-ico-extra-services,
.nc-ico-dopolnitelnye,
.nc-ico-misc,
.nc-ico-prochee {
  -webkit-mask-image: url("icons/more.svg");
  mask-image: url("icons/more.svg");
}

/* ------------------------------------------------------------ публикации --- */

.nc-feed {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--nc-gap);
}
.nc-feed--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.nc-post {
  position: relative; display: flex; flex-direction: column; overflow: hidden;
  border: 1px solid var(--nc-line);
  border-radius: var(--nc-radius);
  background: var(--nc-card);
  color: var(--nc-text);
  transition: transform .3s var(--nc-ease), border-color .3s var(--nc-ease), box-shadow .3s var(--nc-ease);
}
.nc-post:hover {
  transform: translateY(-4px); border-color: var(--nc-line-2);
  box-shadow: 0 20px 44px rgba(0, 0, 0, .48); color: var(--nc-text);
}
.nc-post__media { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--nc-card-2); }
.nc-post__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--nc-ease); }
.nc-post:hover .nc-post__media img { transform: scale(1.05); }
.nc-post__media--empty {
  background:
    linear-gradient(135deg, rgba(59, 130, 246, .28), transparent 58%),
    repeating-linear-gradient(45deg, rgba(255, 255, 255, .055) 0 10px, transparent 10px 20px),
    var(--nc-card-2);
}
.nc-post__cat {
  position: absolute; left: 12px; top: 12px; z-index: 2;
  font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
  padding: 5px 10px; border-radius: 8px;
  background: rgba(5, 7, 12, .72); border: 1px solid var(--nc-line-2); color: var(--nc-dim);
  backdrop-filter: blur(6px);
}
.nc-post__body { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.nc-post__title { font-size: 18px; margin: 0; line-height: 1.35; }
.nc-post__text { color: var(--nc-muted); font-size: 14.5px; margin: 0; flex: 1; }
.nc-post__meta {
  display: flex; align-items: center; gap: 14px;
  font-size: 12.5px; color: var(--nc-muted);
  border-top: 1px solid var(--nc-line); padding-top: 12px; margin-top: 4px;
}
.nc-post__meta span { display: inline-flex; align-items: center; gap: 6px; }
.nc-post__arrow {
  margin-left: auto; width: 26px; height: 26px; border-radius: 50%;
  display: grid; place-items: center;
  border: 1px solid var(--nc-line-2); color: var(--nc-dim);
  transition: transform .3s var(--nc-ease), border-color .3s var(--nc-ease), color .3s var(--nc-ease);
}
.nc-post:hover .nc-post__arrow { transform: translateX(3px); border-color: var(--nc-accent); color: var(--nc-accent-2); }

.nc-post--row { flex-direction: row; align-items: stretch; }
.nc-post--row .nc-post__media { width: 240px; flex: none; aspect-ratio: auto; }
.nc-post--row .nc-post__body { flex: 1; }

/* ------------------------------------------------------------- статья ----- */

.nc-article { padding: 46px 0 60px; }
.nc-article__grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 40px; align-items: start; }
.nc-article__head { margin-bottom: 26px; }
.nc-article__title { font-size: clamp(28px, 3.6vw, 42px); }
.nc-article__meta { display: flex; flex-wrap: wrap; gap: 16px; color: var(--nc-muted); font-size: 14px; }
.nc-article__cover { margin: 24px 0 30px; border-radius: var(--nc-radius); overflow: hidden; border: 1px solid var(--nc-line); }
.nc-article__cover img { width: 100%; display: block; }

.nc-prose { font-size: 17px; color: #d7dded; }
.nc-prose h2 { font-size: 27px; margin: 1.6em 0 .6em; }
.nc-prose h3 { font-size: 22px; margin: 1.4em 0 .5em; }
.nc-prose img { border-radius: var(--nc-radius-sm); border: 1px solid var(--nc-line); }
.nc-prose blockquote {
  margin: 1.4em 0; padding: 14px 20px;
  border-left: 3px solid var(--nc-accent);
  background: var(--nc-card); border-radius: 0 var(--nc-radius-sm) var(--nc-radius-sm) 0;
  color: var(--nc-dim);
}
.nc-prose code {
  background: var(--nc-card-2); border: 1px solid var(--nc-line);
  border-radius: 6px; padding: 2px 6px; font-size: .92em;
}
.nc-prose pre {
  background: var(--nc-card-2); border: 1px solid var(--nc-line);
  border-radius: var(--nc-radius-sm); padding: 16px 18px; overflow-x: auto;
}
.nc-prose pre code { background: none; border: 0; padding: 0; }
.nc-prose ul, .nc-prose ol { padding-left: 22px; }
.nc-prose li { margin: .35em 0; }
.nc-prose table { width: 100%; border-collapse: collapse; }
.nc-prose th, .nc-prose td { border: 1px solid var(--nc-line); padding: 9px 12px; text-align: left; }
.nc-prose-wrap { overflow-x: auto; }

.nc-aside { position: sticky; top: 96px; display: flex; flex-direction: column; gap: 22px; }
.nc-panel { border: 1px solid var(--nc-line); border-radius: var(--nc-radius); background: var(--nc-card); padding: 20px; }
.nc-panel__title { font-size: 15px; letter-spacing: .08em; text-transform: uppercase; color: var(--nc-muted); margin: 0 0 14px; }
.nc-panel__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.nc-panel__list a { color: var(--nc-text); font-size: 15px; line-height: 1.4; display: block; }
.nc-panel__list a:hover { color: var(--nc-accent-2); }
.nc-panel__list small { display: block; color: var(--nc-muted); font-size: 12px; margin-top: 3px; }

.nc-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.nc-chip {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 7px 13px; border-radius: 999px;
  border: 1px solid var(--nc-line-2); background: var(--nc-card);
  color: var(--nc-dim); font-size: 13.5px;
  transition: border-color .25s var(--nc-ease), color .25s var(--nc-ease), transform .25s var(--nc-ease);
}
.nc-chip:hover, .nc-chip.is-active { border-color: var(--nc-accent); color: #fff; transform: translateY(-1px); }

/* ------------------------------------------------------------- формы ------ */

.nc-field { display: flex; flex-direction: column; gap: 7px; margin-bottom: 16px; }
.nc-field label { font-size: 13.5px; color: var(--nc-dim); }
.nc-input, .nc-textarea, .nc-select {
  width: 100%; padding: 12px 14px;
  border: 1px solid var(--nc-line-2); border-radius: var(--nc-radius-sm);
  background: var(--nc-bg-soft); color: var(--nc-text);
  font: inherit; font-size: 15px;
  transition: border-color .2s var(--nc-ease), box-shadow .2s var(--nc-ease);
}
.nc-input:focus, .nc-textarea:focus, .nc-select:focus {
  outline: none; border-color: var(--nc-accent);
  box-shadow: 0 0 0 3px rgba(43, 108, 255, .18);
}
.nc-textarea { min-height: 120px; resize: vertical; }
.nc-form-note { color: var(--nc-muted); font-size: 13px; }
.nc-alert {
  padding: 12px 16px; border-radius: var(--nc-radius-sm);
  border: 1px solid var(--nc-line-2); background: var(--nc-card); margin-bottom: 18px;
}
.nc-alert--error { border-color: rgba(244, 63, 94, .5); color: #ffb4bf; }
.nc-alert--ok { border-color: rgba(34, 197, 94, .45); color: #9ff0bd; }

/* ---------------------------------------------------------- пагинация ----- */

.nc-pager { display: flex; justify-content: center; gap: 8px; margin-top: 42px; flex-wrap: wrap; }
.nc-pager a, .nc-pager span {
  min-width: 42px; height: 42px; padding: 0 12px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--nc-line); border-radius: var(--nc-radius-sm);
  background: var(--nc-card); color: var(--nc-dim); font-size: 15px;
  transition: border-color .2s var(--nc-ease), color .2s var(--nc-ease), transform .2s var(--nc-ease);
}
.nc-pager a:hover { border-color: var(--nc-accent); color: #fff; transform: translateY(-2px); }
.nc-pager .is-current { background: var(--nc-accent); border-color: var(--nc-accent); color: #fff; }

/* ------------------------------------------------------------- подвал ----- */

.nc-footer {
  margin-top: 40px; padding: 54px 0 28px;
  border-top: 1px solid var(--nc-line);
  background: var(--nc-bg-soft);
}
.nc-footer__grid {
  display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 34px;
}
.nc-footer__title { font-size: 14px; letter-spacing: .1em; text-transform: uppercase; color: var(--nc-muted); margin: 0 0 14px; }
.nc-footer__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.nc-footer__list a { color: var(--nc-dim); font-size: 15px; }
.nc-footer__list a:hover { color: #fff; }
.nc-footer__about { color: var(--nc-muted); font-size: 14.5px; max-width: 320px; }
.nc-footer__bottom {
  margin-top: 34px; padding-top: 18px; border-top: 1px solid var(--nc-line);
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between;
  color: var(--nc-muted); font-size: 13.5px;
}
.nc-social { display: flex; gap: 10px; }
.nc-social a {
  width: 40px; height: 40px; border-radius: 12px;
  display: grid; place-items: center;
  border: 1px solid var(--nc-line-2); color: var(--nc-dim);
  transition: transform .25s var(--nc-ease), border-color .25s var(--nc-ease), color .25s var(--nc-ease);
}
.nc-social a:hover { transform: translateY(-3px); border-color: var(--nc-accent); color: #fff; }
.nc-social svg { width: 19px; height: 19px; }

/* ------------------------------------------------------------ 404, пусто -- */

.nc-empty { text-align: center; padding: 60px 20px; color: var(--nc-muted); }
.nc-404 { text-align: center; padding: 90px 0; }
.nc-404__code {
  font-size: clamp(84px, 18vw, 190px); line-height: .9; font-weight: 800; letter-spacing: -.05em;
  background: linear-gradient(120deg, var(--nc-accent), #a855f7 60%, #22d3ee);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ---------------------------------------------------------- появление ----- */

.nc-reveal { opacity: 0; transform: translateY(14px); transition: opacity .55s var(--nc-ease), transform .55s var(--nc-ease); }
.nc-reveal.is-in { opacity: 1; transform: none; }

/* ------------------------------------------------------------- адаптив ---- */

@media (max-width: 1024px) {
  .nc-services { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nc-feed { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nc-article__grid { grid-template-columns: minmax(0, 1fr); }
  .nc-aside { position: static; }
  .nc-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
  .nc-burger { display: inline-flex; }
  .nc-nav {
    position: fixed; inset: 72px 0 auto; z-index: 49;
    flex-direction: column; align-items: stretch; gap: 2px;
    margin: 0; padding: 14px 20px 22px;
    background: rgba(5, 7, 12, .98);
    border-bottom: 1px solid var(--nc-line);
    transform: translateY(-12px); opacity: 0; pointer-events: none;
    transition: opacity .25s var(--nc-ease), transform .25s var(--nc-ease);
  }
  .nc-header.is-open .nc-nav { transform: none; opacity: 1; pointer-events: auto; }
  .nc-nav__link { padding: 13px 12px; font-size: 16px; }
  .nc-nav__link::after { display: none; }
  .nc-header__cta { display: none; }
  .nc-nav .nc-btn { margin-top: 10px; justify-content: center; }
}

@media (max-width: 720px) {
  .nc-sec { padding: 48px 0; }
  .nc-services { grid-template-columns: 1fr; }
  .nc-feed, .nc-feed--2 { grid-template-columns: 1fr; }
  .nc-post--row { flex-direction: column; }
  .nc-post--row .nc-post__media { width: 100%; aspect-ratio: 16 / 9; }
  .nc-pncard { min-height: 210px; }
  .nc-pncard__title, .nc-pncard__sub { max-width: 100%; }
  .nc-pncard__img { width: 42%; opacity: .5; }
  .nc-footer__grid { grid-template-columns: 1fr; gap: 26px; }
}

@media (prefers-reduced-motion: reduce) {
  .nc-reveal { opacity: 1; transform: none; transition: none; }
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ------------------------------------------------- меню из админки -------- */
/* MenuTag отдаёт <ul class="nc-menu"><li class="menu-item"><a>…, поэтому
   пункты стилизуются здесь, а не классами в шаблоне. */

.nc-menu, .nc-cta { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 6px; }
.nc-menu > li { position: relative; }
.nc-menu > li > a {
  display: block; padding: 10px 14px; border-radius: 10px;
  color: var(--nc-dim); font-size: 15px;
  transition: color .2s var(--nc-ease), background .2s var(--nc-ease);
}
.nc-menu > li > a::after {
  content: ""; display: block; height: 2px; margin-top: 5px; border-radius: 2px;
  background: var(--nc-accent); transform: scaleX(0);
  transition: transform .25s var(--nc-ease);
}
.nc-menu > li > a:hover { color: var(--nc-text); background: rgba(255, 255, 255, .04); }
.nc-menu > li > a:hover::after,
.nc-menu > li.is-active > a::after { transform: scaleX(1); }
.nc-menu > li.is-active > a { color: var(--nc-text); }

.nc-menu__sub {
  list-style: none; margin: 0; padding: 8px;
  position: absolute; left: 0; top: calc(100% + 6px); min-width: 210px; z-index: 5;
  background: var(--nc-card); border: 1px solid var(--nc-line); border-radius: var(--nc-radius-sm);
  box-shadow: var(--nc-shadow);
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .2s var(--nc-ease), transform .2s var(--nc-ease), visibility .2s;
}
.nc-menu > li:hover > .nc-menu__sub,
.nc-menu > li:focus-within > .nc-menu__sub { opacity: 1; visibility: visible; transform: none; }
.nc-menu__sub a {
  display: block; padding: 9px 12px; border-radius: 8px;
  color: var(--nc-dim); font-size: 14.5px;
}
.nc-menu__sub a:hover { background: rgba(255, 255, 255, .05); color: var(--nc-text); }

/* Кнопка призыва в шапке — это меню «cta» из админки: первый пункт становится
   синей кнопкой с иконкой Telegram, остальные — обычными ссылками. */
.nc-cta { margin-left: 10px; }
.nc-cta > li:first-child > a {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 11px 20px; border-radius: 12px;
  background: var(--nc-accent); color: #fff; font-size: 15px; font-weight: 600;
  box-shadow: 0 10px 26px rgba(43, 108, 255, .32);
  transition: transform .2s var(--nc-ease), box-shadow .25s var(--nc-ease), background .2s var(--nc-ease);
}
.nc-cta > li:first-child > a::before {
  content: ""; width: 18px; height: 18px; flex: none;
  background-color: currentColor;
  -webkit-mask: url("icons/telegram.svg") center / contain no-repeat;
  mask: url("icons/telegram.svg") center / contain no-repeat;
}
.nc-cta > li:first-child > a:hover {
  background: #3b7bff; color: #fff; transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(43, 108, 255, .42);
}
.nc-cta > li + li > a { padding: 10px 14px; color: var(--nc-dim); font-size: 15px; }
.nc-cta > li + li > a:hover { color: var(--nc-text); }

@media (max-width: 860px) {
  .nc-menu, .nc-cta { flex-direction: column; align-items: stretch; gap: 2px; width: 100%; margin-left: 0; }
  .nc-menu > li > a { padding: 13px 12px; font-size: 16px; }
  .nc-menu > li > a::after { display: none; }
  .nc-menu__sub { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; background: transparent; border: 0; padding: 0 0 0 12px; }
  .nc-cta > li:first-child > a { justify-content: center; margin-top: 10px; }
}

.nc-footer__list--soc { flex-direction: row; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.nc-footer__list--soc li a {
  display: inline-flex; padding: 7px 13px; border-radius: 999px;
  border: 1px solid var(--nc-line-2); font-size: 13.5px; color: var(--nc-dim);
  transition: border-color .25s var(--nc-ease), color .25s var(--nc-ease), transform .25s var(--nc-ease);
}
.nc-footer__list--soc li a:hover { border-color: var(--nc-accent); color: #fff; transform: translateY(-2px); }
.nc-footer__legal a { color: var(--nc-muted); }
.nc-footer__legal a:hover { color: var(--nc-dim); }

/* --------------------------------------------------------- комментарии --- */

.nc-comments { margin-top: 48px; padding-top: 30px; border-top: 1px solid var(--nc-line); }
.nc-comments__title { font-size: 22px; }
.nc-comments__n { color: var(--nc-muted); font-weight: 400; font-size: 16px; }
.nc-comm { list-style: none; margin: 22px 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.nc-comm__item {
  border: 1px solid var(--nc-line); border-radius: var(--nc-radius-sm);
  background: var(--nc-card); padding: 14px 16px;
}
.nc-comm__head { display: flex; gap: 12px; align-items: baseline; margin-bottom: 6px; }
.nc-comm__head b { font-size: 15px; }
.nc-comm__head span { color: var(--nc-muted); font-size: 12.5px; }
.nc-comm__body { color: var(--nc-dim); font-size: 15px; white-space: pre-line; }
.nc-comm__form { margin-top: 22px; }
.nc-comm__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.nc-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 620px) {
  .nc-comm__row { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------------- поиск ----- */

.nc-search { display: flex; gap: 12px; max-width: 640px; margin-top: 8px; }
.nc-search .nc-input { flex: 1; }

.nc-results { list-style: none; margin: 26px 0 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.nc-result a {
  display: block; padding: 18px 20px;
  border: 1px solid var(--nc-line); border-radius: var(--nc-radius);
  background: var(--nc-card); color: var(--nc-text);
  transition: transform .25s var(--nc-ease), border-color .25s var(--nc-ease);
}
.nc-result a:hover { transform: translateY(-2px); border-color: var(--nc-accent); color: var(--nc-text); }
.nc-result__kind { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--nc-muted); }
.nc-result__title { font-size: 18px; margin: 6px 0 0; }
.nc-result__text { color: var(--nc-muted); font-size: 14.5px; margin: 8px 0 0; }
.nc-result__date { display: block; margin-top: 10px; font-size: 12.5px; color: var(--nc-muted); }

@media (max-width: 560px) {
  .nc-search { flex-direction: column; }
}

/* ------------------------------------------ мини-лента в кабинете -------- */

.nc-briefs { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.nc-briefs__item { display: flex; gap: 14px; align-items: center; }
.nc-briefs__media { width: 74px; height: 52px; flex: none; border-radius: 10px; overflow: hidden; background: var(--nc-card-2); display: block; }
.nc-briefs__media img { width: 100%; height: 100%; object-fit: cover; }
.nc-ph { display: block; width: 100%; height: 100%; background: linear-gradient(135deg, rgba(59,130,246,.25), transparent); }
.nc-briefs__title { display: block; color: var(--nc-text); font-size: 15px; line-height: 1.35; }
.nc-briefs__title:hover { color: var(--nc-accent-2); }
.nc-briefs__date { display: block; margin-top: 4px; color: var(--nc-muted); font-size: 12.5px; }

/* Пустых блоков на странице не бывает: рекламу рисует inline-тег
   {ads_zone} (без баннеров он не выводит ничего), а лента скрыта
   условием [if {news}] в шаблоне. Отдельные CSS-костыли не нужны. */
