/* ===================== ПАМЯТНИКИ: МЕМОРИАЛЬНЫЙ КОМПЛЕКС — ДОПОЛНИТЕЛЬНЫЕ БЛОКИ M01–M08 =====================
   /pamjatniki/memorialnyj-kompleks. Подключается через ViewData["CssPage"] = "memorialnyj-kompleks".
   Только новые блоки (ТЗ 03.10.2026): все классы с префиксом mk-, старые секции страницы этот файл не меняет.
   Разметка — Pages/Pamjatniki/_MkM*.cshtml, тексты — MemorialnyjKompleksContent.cs. */

/* — Ритм новых секций — */
.service-page > section.mk-space,
.service-page > section.mk-project,
.service-page > section.mk-materials,
.service-page > section.mk-scope,
.service-page > section.mk-case,
.service-page > section.mk-stages,
.service-page > section.mk-start {
  padding-top: 56px !important;
  padding-bottom: 56px !important;
}
.service-page > section.mk-faq { padding-top: 8px !important; padding-bottom: 56px !important; }
.service-page > section[id^="mk-"] { scroll-margin-top: calc(var(--header-height, 70px) + 16px); }

/* — Общие элементы — */
.mk-head { max-width: 860px; margin-bottom: 28px; }
.mk-h2 {
  margin: 8px 0 0;
  font-size: 40px;
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.mk-h2--sm { font-size: 30px; margin: 0 0 18px; }
.mk-h3 { margin: 0 0 14px; font-size: 22px; line-height: 1.25; color: var(--ink); }
.mk-lead { margin: 14px 0 0; font-size: 17px; line-height: 1.55; color: var(--ink-3); }
.mk-note {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin: 20px 0 0;
  padding: 14px 16px;
  border-radius: 14px;
  background: var(--green-50);
  color: var(--ink-2);
  font-size: 14.5px;
  line-height: 1.5;
}
.mk-note [data-lucide] { width: 18px; height: 18px; flex-shrink: 0; margin-top: 2px; color: var(--green-600); }
.mk-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: var(--green-50);
  color: var(--green-600);
}
.mk-ico [data-lucide] { width: 20px; height: 20px; }
.mk-ico--sm { width: 30px; height: 30px; border-radius: 9px; margin-right: 10px; }
.mk-ico--sm [data-lucide] { width: 16px; height: 16px; }
.mk-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 22px;
  border-radius: 12px;
  background: var(--green-600);
  color: #fff;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  transition: background .2s;
}
.mk-btn:hover { background: var(--green-700); color: #fff; }
.mk-btn [data-lucide] { width: 18px; height: 18px; }
.mk-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  font-size: 15px;
  color: var(--green-600);
  text-decoration: none;
}
.mk-link:hover { color: var(--green-700); text-decoration: underline; }
.mk-link [data-lucide] { width: 16px; height: 16px; }
.mk-btn:focus-visible, .mk-link:focus-visible, .mk-pic:focus-visible, .mk-jump a:focus-visible {
  outline: 3px solid var(--green-500);
  outline-offset: 3px;
}
.mk-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 24px; }

/* Картинка блока: кадр по ширине своей колонки */
.mk-pic {
  position: relative;
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 16px;
  overflow: hidden;
  background: var(--line-2);
}
button.mk-pic { width: 100%; cursor: zoom-in; }
.mk-pic img { display: block; width: 100%; height: 100%; object-fit: cover; }
.mk-tag {
  position: absolute;
  left: 10px;
  bottom: 10px;
  padding: 3px 8px;
  border-radius: 6px;
  background: rgba(20, 24, 26, .55);
  color: #fff;
  font-size: 11px;
  line-height: 1.3;
}
.mk-tag--light { left: 12px; top: 12px; bottom: auto; background: var(--card); color: var(--muted); border: 1px solid var(--line); }

.mk-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--card);
}
.mk-card__title { margin: 4px 0 0; font-size: 17px; line-height: 1.3; color: var(--ink); }
.mk-card__text { margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--ink-3); }

.mk-points { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.mk-points li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 14px; align-items: start; }
.mk-points b { display: block; font-size: 16px; color: var(--ink); }
.mk-points p { margin: 4px 0 0; font-size: 14.5px; line-height: 1.5; color: var(--ink-3); }

.mk-checks { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.mk-checks li { position: relative; padding-left: 28px; font-size: 15px; line-height: 1.45; color: var(--ink-2); }
.mk-checks li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--green-600) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 12px no-repeat;
}
.mk-checks--soft li::before { background-color: var(--muted); }

.mk-flow__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--green-600);
  color: #fff;
  font-weight: 700;
  font-size: 14px;
}

/* ===== M01. Единое пространство ===== */
.mk-space__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}
.mk-scheme {
  position: relative;
  margin: 0;
  padding: 18px 18px 14px;
  border-radius: 18px;
  border: 1px solid var(--line);
  background: var(--card);
}
.mk-scheme__svg { display: block; width: 100%; height: auto; }
.mk-scheme__border { fill: none; stroke: var(--ink-3); stroke-width: 8; }
.mk-scheme__paving { fill: var(--line-2); stroke: var(--line); stroke-width: 1; }
.mk-scheme__stone { fill: var(--ink-2); }
.mk-scheme__bed { fill: var(--green-50); stroke: var(--green-600); stroke-width: 2; }
.mk-scheme__bench { fill: var(--card); stroke: var(--ink-3); stroke-width: 2; stroke-dasharray: 5 4; }
.mk-scheme__gap { fill: var(--card); }
.mk-scheme__path, .mk-scheme__arrow { fill: none; stroke: var(--green-600); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.mk-scheme__path { stroke-dasharray: 6 6; }
.mk-scheme__label { fill: var(--muted); font-size: 12px; }
.mk-scheme__nums circle { fill: var(--green-600); stroke: var(--card); stroke-width: 2; }
.mk-scheme__nums text { fill: #fff; font-size: 12px; font-weight: 700; }
.mk-scheme__note { margin-top: 10px; font-size: 13px; line-height: 1.45; color: var(--muted); }
.mk-zones { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.mk-zone { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 14px; align-items: start; }
.mk-zone__num {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--green-600);
  color: #fff;
  font-weight: 700;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mk-zone__title { margin: 3px 0 2px; font-size: 16px; color: var(--ink); }
.mk-zone__text { margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--ink-3); }
.mk-space__visit {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 28px;
  align-items: center;
  margin-top: 32px;
}
.mk-space__visit--nopic { grid-template-columns: minmax(0, 1fr); }
.mk-space__pic { aspect-ratio: 4 / 3; }
.mk-scenarios {
  list-style: none;
  margin: 32px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

/* ===== M02. Проект и согласование ===== */
.mk-project__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}
.mk-project__layout--nopic { grid-template-columns: minmax(0, 1fr); }
.mk-project__pic { aspect-ratio: 4 / 3; }
.mk-sees { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; }
.mk-project__layout--nopic .mk-sees { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mk-sees li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; align-items: start; }
.mk-sees b { display: block; font-size: 15.5px; color: var(--ink); }
.mk-sees p { margin: 3px 0 0; font-size: 14px; line-height: 1.5; color: var(--ink-3); }
.mk-project__viz { margin: 16px 0 0; font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.mk-flow { margin-top: 32px; }
.mk-flow__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  background: var(--card);
}
.mk-flow__list li { display: grid; align-content: start; gap: 6px; padding: 18px; border-left: 1px solid var(--line); }
.mk-flow__list li:first-child { border-left: 0; }
.mk-flow__list b { font-size: 15.5px; color: var(--ink); }
.mk-flow__list p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--ink-3); }

/* ===== M03. Материалы ===== */
.mk-combos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.mk-combo {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--card);
  overflow: hidden;
}
.mk-combo__pics { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 8px; padding: 8px 8px 0; align-items: stretch; }
.mk-combo__pics--one { grid-template-columns: minmax(0, 1fr); }
.mk-combo__main { aspect-ratio: 4 / 3; border-radius: 12px; }
.mk-combo__detail { aspect-ratio: auto; min-height: 100%; border-radius: 12px; }
.mk-combo__pics--one .mk-combo__detail { aspect-ratio: 1 / 1; }
.mk-combo__body { display: grid; gap: 8px; padding: 18px 20px 20px; }
.mk-combo__mat { font-size: 12.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--green-700); font-weight: 700; }
.mk-combo__consider {
  display: flex;
  gap: 8px;
  margin: 4px 0 0;
  padding-top: 10px;
  border-top: 1px dashed var(--line);
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--ink-2);
}
.mk-combo__consider [data-lucide] { width: 15px; height: 15px; flex-shrink: 0; margin-top: 2px; color: var(--green-600); }
.mk-moods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 24px; }
.mk-mood { padding: 18px 20px; border-radius: 16px; background: var(--green-50); }
.mk-mood b { font-size: 16px; color: var(--ink); }
.mk-mood p { margin: 6px 0 0; font-size: 14.5px; line-height: 1.5; color: var(--ink-2); }
.mk-moods__note { margin: 12px 0 0; font-size: 14px; line-height: 1.5; color: var(--ink-3); }
.mk-jump { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-top: 20px; }
.mk-jump__label { font-size: 14px; color: var(--muted); }
.mk-jump a {
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--card);
  font-size: 14px;
  font-weight: 600;
  color: var(--green-700);
  text-decoration: none;
}
.mk-jump a:hover { border-color: var(--green-600); }

/* ===== M04. Состав и расчёт ===== */
.mk-scope__map { padding: 24px; border-radius: 20px; border: 1px solid var(--line); background: var(--card); }
.mk-scope__head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  font-weight: 700;
  font-size: 17px;
  color: var(--ink);
}
.mk-scope__head > span:first-child { display: inline-flex; align-items: center; gap: 8px; }
.mk-scope__head [data-lucide] { width: 20px; height: 20px; color: var(--green-600); }
.mk-scope__badge {
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--line-2);
  color: var(--muted);
  font-size: 12.5px;
  font-weight: 600;
}
.mk-scope__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.mk-scope__group { padding: 16px; border-radius: 14px; background: var(--line-2); }
.mk-scope__gname { display: flex; align-items: center; margin-bottom: 10px; font-weight: 700; font-size: 15px; color: var(--ink); }
.mk-scope__group ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.mk-scope__group li { position: relative; padding-left: 14px; font-size: 13.5px; line-height: 1.45; color: var(--ink-2); }
.mk-scope__group li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 7px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--green-600);
}
.mk-scope__turnkey { margin-top: 18px; padding: 16px 18px; border-radius: 14px; border-left: 4px solid var(--green-600); background: var(--green-50); }
.mk-scope__turnkey b { font-size: 16px; color: var(--ink); }
.mk-scope__turnkey p { margin: 6px 0 0; font-size: 14.5px; line-height: 1.5; color: var(--ink-2); }
.mk-scope__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; margin-top: 32px; }
.mk-kinds { list-style: none; margin: 0; padding: 0; counter-reset: mk-kinds; display: grid; gap: 12px; }
.mk-kinds li {
  counter-increment: mk-kinds;
  position: relative;
  display: grid;
  gap: 2px;
  padding: 14px 16px 14px 54px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--card);
  font-size: 14.5px;
  line-height: 1.45;
}
.mk-kinds li::before {
  content: counter(mk-kinds);
  position: absolute;
  left: 16px;
  top: 14px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--green-50);
  color: var(--green-700);
  font-weight: 700;
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mk-kinds b, .mk-levers b { color: var(--ink); font-size: 15.5px; }
.mk-kinds span, .mk-levers span { color: var(--ink-3); }
.mk-levers { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 12px; }
.mk-levers li { display: grid; gap: 2px; padding-left: 14px; border-left: 3px solid var(--green-600); font-size: 14.5px; line-height: 1.45; }

/* ===== M05. Кейс ===== */
.mk-case__strip {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  counter-reset: none;
}
.mk-case__step { position: relative; display: grid; gap: 8px; align-content: start; }
.mk-case__stage { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; letter-spacing: .05em; text-transform: uppercase; font-weight: 700; color: var(--green-700); }
.mk-case__stage b {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--green-600);
  color: #fff;
  font-size: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.mk-case__pic { aspect-ratio: 4 / 3; }
.mk-case__cap { font-size: 13.5px; line-height: 1.4; color: var(--ink-3); }
.mk-case__facts {
  margin: 24px 0 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--card);
}
.mk-case__facts > div { padding: 16px 18px; border-left: 1px solid var(--line); }
.mk-case__facts > div:first-child { border-left: 0; }
.mk-case__facts dt { font-size: 12.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); font-weight: 700; }
.mk-case__facts dd { margin: 6px 0 0; font-size: 14.5px; line-height: 1.5; color: var(--ink); }
.mk-case__note { margin: 12px 0 0; font-size: 13.5px; line-height: 1.5; color: var(--ink-3); }

/* ===== M06. Этапы ===== */
.mk-stages__layout { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(280px, 1fr); gap: 28px; align-items: start; }
.mk-stages__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.mk-stage {
  display: grid;
  grid-template-columns: minmax(160px, 38%) minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--card);
}
.mk-stage--nopic { grid-template-columns: minmax(0, 1fr); padding: 18px; }
.mk-stage__pic { aspect-ratio: 4 / 3; border-radius: 12px; }
.mk-stage__head { display: flex; align-items: center; gap: 10px; }
.mk-stage__title { margin: 0; font-size: 17px; color: var(--ink); }
.mk-stage__body p { margin: 8px 0 0; font-size: 14.5px; line-height: 1.5; color: var(--ink-3); }
.mk-control { padding: 22px; border-radius: 18px; background: var(--green-50); }
.mk-control .mk-ico { background: var(--card); }
.mk-control .mk-link { margin-top: 20px; }

/* ===== M07. С чего начать ===== */
.mk-start__card {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
  padding: 24px;
  border-radius: 20px;
  border: 1px solid var(--line);
  background: var(--card);
}
.mk-start__card--nopic { grid-template-columns: minmax(0, 1fr); }
.mk-start__pic { aspect-ratio: 3 / 4; border-radius: 14px; }
.mk-start__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.mk-start__label { margin-bottom: 12px; font-weight: 700; font-size: 15px; color: var(--ink); }
.mk-start__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 24px;
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px dashed var(--line);
}
.mk-start__foot p { margin: 0; flex: 1 1 320px; font-size: 14.5px; line-height: 1.5; color: var(--ink-2); }

/* ===================== Планшет ===================== */

/* ===================== Телефон ===================== */

@media (prefers-reduced-motion: reduce) {
  .mk-btn { transition: none; }
}

/* Заголовки — фирменный шрифт сайта, как на главной (Lora 600). Владелец 04.10.2026: «это один сайт». */
.mk-h2,
.mk-h3,
.mk-card__title,
.mk-stage__title,
.mk-zone__title {
  font-family: 'Lora', Georgia, serif;
  font-weight: 600;
  letter-spacing: -.01em;
}

/* Телефон (2026-10-19): этапы — лентой (m-swipe); карточка без фото не растягивает текст на всю высоту ряда. */

