/* ============================================================
   Продвижение на картах — надстройка над sv2026.css
   ============================================================ */

/* фоновые приёмы по секциям */
.maps-scope::before, .maps-start::before {
  content: ""; position: absolute; z-index: 0; pointer-events: none;
  right: 0; top: 0; width: 340px; height: 320px;
  color: rgba(21,24,27,.22);
  background-image: radial-gradient(currentColor 1.15px, transparent 1.3px);
  background-size: 17px 17px;
  -webkit-mask-image: radial-gradient(125% 125% at 100% 0, #000 26%, transparent 72%);
          mask-image: radial-gradient(125% 125% at 100% 0, #000 26%, transparent 72%);
}
.maps-exp::before, .maps-formats::before {
  content: ""; position: absolute; z-index: 0; pointer-events: none;
  left: 0; bottom: 0; width: 320px; height: 280px;
  color: rgba(21,24,27,.18);
  background-image: radial-gradient(currentColor 1.15px, transparent 1.3px);
  background-size: 17px 17px;
  -webkit-mask-image: radial-gradient(125% 125% at 0 100%, #000 24%, transparent 70%);
          mask-image: radial-gradient(125% 125% at 0 100%, #000 24%, transparent 70%);
}
.maps-why::before, .maps-formats::after {
  content: ""; position: absolute; z-index: 0; pointer-events: none;
  left: 0; right: 0; top: 0; height: 9px;
  background-image: repeating-linear-gradient(90deg, var(--line) 0 1px, transparent 1px 13px);
  -webkit-mask-image: linear-gradient(90deg, #000 0 58%, transparent 100%);
          mask-image: linear-gradient(90deg, #000 0 58%, transparent 100%);
}
.maps-scope::after, .maps-start::after {
  content: ""; position: absolute; z-index: 0; pointer-events: none;
  width: 340px; height: 430px; background-repeat: no-repeat; background-size: contain;
}
.maps-scope::after { background-image: url("../images/trace-a.svg"); left: 0; bottom: 20px; }
.maps-start::after { background-image: url("../images/technical-field.svg"); right: -40px; bottom: -30px; width: 360px; height: 360px; }
.maps-scope, .maps-start, .maps-exp, .maps-formats, .maps-why { overflow: clip; }

/* первый экран: сравнение карточек */
.maps-hero__shot img { aspect-ratio: 1 / 1; object-fit: cover; object-position: center top; }

/* два столбца «снимок + текст» */
.maps-split { display: grid; gap: 24px; align-items: center; }
.maps-shot, .maps-portrait { padding: 10px; margin: 0; }
.maps-shot img, .maps-portrait img { display: block; width: 100%; height: auto; }
/* портрет не обрезаем */
.maps-portrait img { aspect-ratio: 649 / 600; object-fit: contain; background: var(--paper-2); }
.maps-copy {
  position: relative;
  background: rgba(255,255,255,.62);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  box-shadow: inset 0 0 0 1px rgba(21,24,27,.09), 0 18px 40px -34px rgba(21,24,27,.4);
  padding: 24px 24px 26px;
  clip-path: polygon(var(--ch) 0, 100% 0, 100% calc(100% - var(--ch)), calc(100% - var(--ch)) 100%, 0 100%, 0 var(--ch));
  display: grid; gap: 12px;
}
.maps-copy p { font-size: 15.5px; line-height: 1.6; color: var(--body); }
.maps-copy .sv-btn { justify-self: start; margin-top: 6px; }

/* карточки форматов */
.maps-formats .sv-scard h3 { margin-top: 0; }
.maps-formats .sv-scard__idx { margin-bottom: 14px; }

@media (min-width: 1000px) {
  .maps-why .sv-steps { grid-template-columns: 1fr; }
  .maps-why .sv-steps__row { border-right: 0; border-bottom: 1px solid var(--line-soft); }
  .maps-why .sv-steps__row:last-child { border-bottom: 0; }
  .maps-split { grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr); gap: 44px; }
  .maps-split--rev { grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr); }
  .maps-copy { padding: 32px 34px 34px; }
  .maps-portrait { max-width: 460px; margin-left: auto; }
}


/* тёмный блок «запуск с нуля» */
.sv-launch { margin-block: clamp(52px, 9vw, 104px); }


/* три карточки в тёмном блоке */
@media (min-width: 700px) { .sv-launch__cards--3 { grid-template-columns: repeat(3, 1fr); } }
.sv-launch__cards--3 .sv-dcard__in { padding: 18px 16px; }
.sv-launch__cards--3 .sv-dcard__kicker { color: var(--orange-hot); }
.sv-launch__cards--3 .sv-dcard__in p { font-size: 13.5px; }
.sv-launch__copy > .sv-btn { margin-top: 22px; }


/* иллюстрации в карточках форматов */
.sv-scard { overflow: hidden; }
.sv-scard > *:not(.sv-card__art) { position: relative; z-index: 1; }
.sv-scard .sv-card__art {
  position: absolute; right: 0; bottom: 0; z-index: 0; pointer-events: none;
  width: auto; height: 50%; max-width: 58%;
  object-fit: contain; object-position: right bottom; opacity: .46;
  -webkit-mask-image: linear-gradient(300deg, #000 0 46%, transparent 100%);
          mask-image: linear-gradient(300deg, #000 0 46%, transparent 100%);
}



/* поле телефона не шире соседних, когда полей чётное число */
.sv-form input[type="tel"] { grid-column: auto; }
.sv-form input:nth-last-of-type(1):nth-of-type(odd) { grid-column: span 2; }


/* портрет меньше */
.maps-portrait { max-width: 320px; }




/* тёмный рендер: тянем на всю высоту колонки, как на главной, со срезанным углом */
.sv-launch__grid { align-items: stretch; }
.sv-launch__visual { position: relative; display: flex; align-self: stretch; }
.sv-launch__visual img {
  width: 100%; height: 100%; aspect-ratio: auto !important;
  object-fit: cover !important; object-position: center;
  background: var(--dark);
  clip-path: polygon(var(--ch) 0, 100% 0, 100% calc(100% - var(--ch)), calc(100% - var(--ch)) 100%, 0 100%, 0 var(--ch));
}
@media (max-width: 999px) {
  .sv-launch__visual img { height: auto; aspect-ratio: 16 / 9 !important; }
}
@media (min-width: 1000px) {
  .sv-launch .sv-callouts { position: absolute; inset: 0; display: block; margin: 0; }
  .sv-launch .sv-callout { position: absolute; width: max-content; max-width: 190px; }
  .sv-launch .sv-callout--1 { left: -12px; top: 30%; }
  .sv-launch .sv-callout--2 { right: 2%; top: 8%; }
  .sv-launch .sv-callout--3 { right: -14px; top: 54%; }
  .sv-launch .sv-callout--4 { left: 22%; bottom: 5%; }
}
