/*
 * Neat Popups — окно на сайте и в превью админки.
 * Каждое правило компонента начинается с .neatpop — иначе сбросы ниже
 * и стили темы под button/a/p перебивают одиночные классы.
 */

.neatpop {
	--neatpop-accent: #0e7c56;
	--neatpop-on: #ffffff;
	--neatpop-radius: 18px;
	--neatpop-bg: #ffffff;
	--neatpop-fg: #17181c;
	--neatpop-muted: #5f636b;
	--neatpop-line: rgba(17, 24, 39, .08);
	--neatpop-soft: rgba(17, 24, 39, .05);
	--neatpop-field: rgba(17, 24, 39, .16);
	--neatpop-error: #c4320a;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2147483000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	pointer-events: none;
	font-size: 16px;
	line-height: 1.5;
	text-align: left;
	-webkit-font-smoothing: antialiased;
}

.neatpop.neatpop--dark {
	--neatpop-bg: #1b1c20;
	--neatpop-fg: #f3f4f6;
	--neatpop-muted: #a4a8b0;
	--neatpop-line: rgba(255, 255, 255, .09);
	--neatpop-soft: rgba(255, 255, 255, .07);
	--neatpop-field: rgba(255, 255, 255, .2);
	--neatpop-error: #ff9c85;
}

.neatpop.neatpop--inline { position: absolute; z-index: 5; }

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

/* Сброс стилей темы */
.neatpop button {
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: inherit;
	font: inherit;
	letter-spacing: normal;
	text-transform: none;
	text-shadow: none;
	line-height: inherit;
	min-height: 0;
	min-width: 0;
	width: auto;
	height: auto;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
}
.neatpop a { box-shadow: none; text-shadow: none; }
.neatpop img { display: block; max-width: 100%; margin: 0; padding: 0; border: 0; box-shadow: none; }
.neatpop p { margin: 0 0 .65em; padding: 0; font-size: inherit; line-height: inherit; color: inherit; }
.neatpop p:last-child { margin-bottom: 0; }

/* Положение */
.neatpop.neatpop--slide { padding: 20px; align-items: flex-end; }
.neatpop.neatpop--slide.neatpop--pos-br { justify-content: flex-end; }
.neatpop.neatpop--slide.neatpop--pos-bl { justify-content: flex-start; }
.neatpop.neatpop--bar { padding: 12px; }
.neatpop.neatpop--bar.neatpop--pos-bottom { align-items: flex-end; }
.neatpop.neatpop--bar.neatpop--pos-top { align-items: flex-start; }
.admin-bar .neatpop.neatpop--bar.neatpop--pos-top:not(.neatpop--inline) { padding-top: 44px; }
@media (max-width: 782px) {
	.admin-bar .neatpop.neatpop--bar.neatpop--pos-top:not(.neatpop--inline) { padding-top: 58px; }
}

/* Фон */
.neatpop .neatpop-overlay {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(12, 13, 16, .5);
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
	opacity: 0;
	transition: opacity .3s ease;
}
.neatpop.is-open .neatpop-overlay { opacity: 1; pointer-events: auto; }

/* Карточка */
.neatpop .neatpop-box {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 460px;
	max-width: 100%;
	max-height: 100%;
	overflow: hidden;
	background: var(--neatpop-bg);
	color: var(--neatpop-fg);
	border-radius: var(--neatpop-radius);
	box-shadow: 0 30px 70px -20px rgba(0, 0, 0, .35), 0 0 0 1px var(--neatpop-line);
	outline: none;
	opacity: 0;
	transition: opacity .28s ease, transform .42s cubic-bezier(.2, .9, .25, 1);
}
.neatpop.is-open .neatpop-box { opacity: 1; pointer-events: auto; }
.neatpop.neatpop--anim-zoom:not(.is-open) .neatpop-box { transform: scale(.94); }
.neatpop.neatpop--anim-rise:not(.is-open) .neatpop-box { transform: translateY(28px); }
.neatpop.neatpop--anim-rise.neatpop--pos-top:not(.is-open) .neatpop-box { transform: translateY(-28px); }

.neatpop.neatpop--size-s .neatpop-box { width: 380px; }
.neatpop.neatpop--size-l .neatpop-box { width: 600px; }
.neatpop.neatpop--slide .neatpop-box { width: 360px; }
.neatpop.neatpop--slide.neatpop--size-s .neatpop-box { width: 310px; }
.neatpop.neatpop--slide.neatpop--size-l .neatpop-box { width: 420px; }
.neatpop.neatpop--img-side .neatpop-box { flex-direction: row; width: 660px; }
.neatpop.neatpop--img-side.neatpop--size-s .neatpop-box { width: 560px; }
.neatpop.neatpop--img-side.neatpop--size-l .neatpop-box { width: 800px; }
.neatpop.neatpop--bar .neatpop-box { flex-direction: row; align-items: center; width: 100%; max-width: 1180px; }

/* Картинка */
.neatpop .neatpop-media { position: relative; flex: none; overflow: hidden; background: var(--neatpop-soft); }
.neatpop .neatpop-media img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; }
.neatpop.neatpop--img-top .neatpop-media { aspect-ratio: 16 / 9; max-height: 40vh; }
.neatpop.neatpop--img-side .neatpop-media { width: 44%; }

/* Закрыть */
.neatpop .neatpop-close {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	color: var(--neatpop-muted);
	transition: background-color .15s, color .15s;
}
.neatpop .neatpop-close:hover { background: var(--neatpop-soft); color: var(--neatpop-fg); }
.neatpop .neatpop-close svg { display: block; width: 18px; height: 18px; }
.neatpop.neatpop--img-top .neatpop-close { background: rgba(255, 255, 255, .92); color: #17181c; box-shadow: 0 2px 8px rgba(0, 0, 0, .15); }
.neatpop.neatpop--img-top .neatpop-close:hover { background: #ffffff; color: #17181c; }

.neatpop .neatpop-close:focus-visible,
.neatpop .neatpop-btn:focus-visible,
.neatpop .neatpop-code-copy:focus-visible,
.neatpop .neatpop-dismiss:focus-visible { outline: 2px solid var(--neatpop-accent); outline-offset: 2px; }

/* Текст */
.neatpop .neatpop-body {
	flex: 1 1 auto;
	min-width: 0;
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: 34px 30px 26px;
}
.neatpop.neatpop--size-s .neatpop-body { padding: 28px 24px 22px; }
.neatpop.neatpop--slide .neatpop-body { padding: 26px 22px 20px; }
.neatpop.neatpop--img-top .neatpop-body { padding-top: 24px; }

.neatpop.neatpop--align-center .neatpop-copy { text-align: center; }
.neatpop.neatpop--align-center:not(.neatpop--img-top) .neatpop-copy { padding: 0 20px; }
.neatpop.neatpop--align-left:not(.neatpop--img-top) .neatpop-copy { padding-right: 24px; }

.neatpop .neatpop-eyebrow {
	display: inline-block;
	margin: 0 0 12px;
	padding: 4px 11px 4px 9px;
	border-radius: 999px;
	background: var(--neatpop-soft);
	color: var(--neatpop-fg);
	font-size: 12px;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: .01em;
}
.neatpop .neatpop-eyebrow::before {
	content: '';
	display: inline-block;
	width: 6px;
	height: 6px;
	margin: 0 7px 1px 0;
	border-radius: 50%;
	background: var(--neatpop-accent);
	vertical-align: middle;
}

.neatpop .neatpop-title {
	margin: 0 0 8px;
	color: var(--neatpop-fg);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.18;
	letter-spacing: -.015em;
}
.neatpop.neatpop--size-s .neatpop-title,
.neatpop.neatpop--slide .neatpop-title { font-size: 20px; }
.neatpop.neatpop--size-l .neatpop-title { font-size: 28px; }
.neatpop.neatpop--slide.neatpop--size-l .neatpop-title { font-size: 22px; }

.neatpop .neatpop-text { color: var(--neatpop-muted); font-size: 15.5px; line-height: 1.55; }
.neatpop.neatpop--size-s .neatpop-text,
.neatpop.neatpop--slide .neatpop-text { font-size: 14.5px; }
.neatpop .neatpop-text a { color: var(--neatpop-accent); text-decoration: underline; text-underline-offset: 2px; }
.neatpop .neatpop-text b,
.neatpop .neatpop-text strong { color: var(--neatpop-fg); font-weight: 650; }

.neatpop .neatpop-extra { margin-top: 18px; text-align: left; }
.neatpop .neatpop-extra-stub {
	margin-top: 18px;
	padding: 18px 14px;
	border: 1.5px dashed currentColor;
	border-radius: max(8px, calc(var(--neatpop-radius) * .6));
	color: var(--neatpop-muted);
	font-size: 13px;
	text-align: center;
	opacity: .8;
}

/* Действия */
.neatpop .neatpop-actions { display: flex; flex-direction: column; align-items: stretch; gap: 10px; margin-top: 22px; }
.neatpop.neatpop--slide .neatpop-actions { margin-top: 18px; }

.neatpop .neatpop-code {
	display: flex;
	align-items: stretch;
	min-height: 52px;
	overflow: hidden;
	border: 1.5px dashed var(--neatpop-accent);
	border-radius: max(8px, calc(var(--neatpop-radius) * .65));
	background: var(--neatpop-soft);
}
.neatpop .neatpop-code-text {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 8px 14px;
	color: var(--neatpop-fg);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 19px;
	font-weight: 700;
	letter-spacing: .08em;
	word-break: break-all;
	-webkit-user-select: all;
	user-select: all;
}
.neatpop.neatpop--align-left .neatpop-code-text { justify-content: flex-start; }
.neatpop .neatpop-code-copy {
	flex: none;
	padding: 0 16px;
	border-left: 1.5px dashed var(--neatpop-accent);
	color: var(--neatpop-accent);
	font-size: 13.5px;
	font-weight: 600;
	transition: background-color .15s, color .15s;
}
.neatpop .neatpop-code-copy:hover { background: var(--neatpop-soft); }
.neatpop .neatpop-code.is-copied .neatpop-code-copy { background: var(--neatpop-accent); color: var(--neatpop-on); }

.neatpop .neatpop-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 50px;
	padding: 12px 22px;
	border-radius: max(8px, calc(var(--neatpop-radius) * .65));
	background: var(--neatpop-accent);
	box-shadow: 0 10px 22px -12px var(--neatpop-accent);
	color: var(--neatpop-on);
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: transform .15s ease, filter .15s ease;
}
.neatpop .neatpop-btn:hover,
.neatpop .neatpop-btn:focus,
.neatpop .neatpop-btn:visited { color: var(--neatpop-on); text-decoration: none; }
.neatpop .neatpop-btn:hover { filter: brightness(1.07); transform: translateY(-1px); }
.neatpop .neatpop-btn:active { transform: scale(.99); }
.neatpop.neatpop--align-left .neatpop-btn { align-self: flex-start; }

.neatpop .neatpop-dismiss {
	align-self: center;
	padding: 4px 8px;
	border-radius: 6px;
	color: var(--neatpop-muted);
	font-size: 13.5px;
	transition: color .15s;
}
.neatpop .neatpop-dismiss:hover { color: var(--neatpop-fg); text-decoration: underline; text-underline-offset: 3px; }
.neatpop.neatpop--align-left .neatpop-dismiss { align-self: flex-start; padding-left: 0; }

/*
 * Встроенная форма. Поля и кнопка отправки — с тройным префиксом (0,3,0):
 * темы стилизуют их селекторами вроде body[data-form-style] input[type="text"] (0,2,2).
 */
.neatpop .neatpop-form { position: relative; display: flex; flex-direction: column; gap: 10px; margin-top: 20px; text-align: left; }
.neatpop.neatpop--has-form .neatpop-actions { margin-top: 12px; }

.neatpop .neatpop-choices { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 4px; }
.neatpop.neatpop--align-center .neatpop-choices { justify-content: center; }
.neatpop .neatpop-form .neatpop-choice {
	padding: 8px 14px;
	border: 1.5px solid var(--neatpop-field);
	border-radius: 999px;
	background: var(--neatpop-bg);
	color: var(--neatpop-fg);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.3;
	text-align: left;
	transition: background-color .15s, border-color .15s, color .15s, transform .1s;
}
.neatpop .neatpop-form .neatpop-choice:hover { border-color: var(--neatpop-accent); }
.neatpop .neatpop-form .neatpop-choice:active { transform: scale(.97); }
.neatpop .neatpop-form .neatpop-choice.is-on { border-color: var(--neatpop-accent); background: var(--neatpop-accent); color: var(--neatpop-on); }
.neatpop .neatpop-form .neatpop-choice:focus-visible { outline: 2px solid var(--neatpop-accent); outline-offset: 2px; }

.neatpop .neatpop-form .neatpop-field {
	display: block;
	width: 100%;
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 12px 14px;
	border: 1.5px solid var(--neatpop-field);
	border-radius: max(8px, calc(var(--neatpop-radius) * .55));
	background: var(--neatpop-bg);
	box-shadow: none;
	color: var(--neatpop-fg);
	font: inherit;
	font-size: 15px;
	line-height: 1.4;
	letter-spacing: normal;
	text-transform: none;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
	transition: border-color .15s, box-shadow .15s;
}
.neatpop .neatpop-form textarea.neatpop-field { min-height: 88px; resize: vertical; }
.neatpop .neatpop-form .neatpop-field::placeholder { color: var(--neatpop-muted); opacity: .85; }
.neatpop .neatpop-form .neatpop-field:focus { border-color: var(--neatpop-accent); box-shadow: 0 0 0 3px var(--neatpop-soft); }
.neatpop .neatpop-form .neatpop-field.is-invalid { border-color: var(--neatpop-error); }

/* Галочки согласия. Подпись лежит в <span> внутри <label>: типографику
   ему задаём отдельно, иначе правило темы вида `form span { … }` перебьёт
   наследование от label и согласие вылезет капсом и чужим цветом. */
.neatpop .neatpop-form .neatpop-consents { display: flex; flex-direction: column; gap: 9px; margin: 2px 0; }
.neatpop .neatpop-form .neatpop-consent,
.neatpop .neatpop-form .neatpop-consent span {
	color: var(--neatpop-muted);
	font-family: inherit;
	font-size: 12.5px;
	font-weight: 400;
	line-height: 1.45;
	letter-spacing: normal;
	text-transform: none;
	text-align: left;
}
.neatpop .neatpop-form .neatpop-consent {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin: 0;
	padding: 0;
	cursor: pointer;
}
.neatpop .neatpop-form .neatpop-consent input[type="checkbox"] {
	flex: none;
	width: 16px;
	height: 16px;
	margin: 1px 0 0;
	padding: 0;
	position: static;
	opacity: 1;
	accent-color: var(--neatpop-accent);
	-webkit-appearance: checkbox;
	appearance: auto;
}
.neatpop .neatpop-form .neatpop-consent input[type="checkbox"]:focus-visible { outline: 2px solid var(--neatpop-accent); outline-offset: 2px; }
.neatpop .neatpop-form .neatpop-consent .neatpop-plink { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.neatpop .neatpop-form .neatpop-consent.is-invalid,
.neatpop .neatpop-form .neatpop-consent.is-invalid span { color: var(--neatpop-error); }
.neatpop .neatpop-form .neatpop-consent input[type="checkbox"].is-invalid { outline: 2px solid var(--neatpop-error); outline-offset: 2px; }

.neatpop .neatpop-form .neatpop-trap { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.neatpop .neatpop-form-error { color: var(--neatpop-error); font-size: 13.5px; line-height: 1.4; }
.neatpop .neatpop-form-error[hidden] { display: none; }

.neatpop .neatpop-form .neatpop-submit {
	width: 100%;
	height: auto;
	min-height: 50px;
	margin: 4px 0 0;
	padding: 12px 22px;
	border: 0;
	border-radius: max(8px, calc(var(--neatpop-radius) * .65));
	background: var(--neatpop-accent);
	color: var(--neatpop-on);
	font-size: 15.5px;
	font-weight: 600;
	letter-spacing: normal;
	text-transform: none;
}
.neatpop .neatpop-form .neatpop-submit:hover { background: var(--neatpop-accent); color: var(--neatpop-on); }
.neatpop .neatpop-form .neatpop-submit.is-busy { opacity: .7; cursor: progress; transform: none; }
.neatpop .neatpop-privacy { color: var(--neatpop-muted); font-size: 12px; line-height: 1.45; text-align: center; }
.neatpop .neatpop-privacy a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

.neatpop .neatpop-thanks { padding-top: 6px; text-align: center; outline: none; }
.neatpop .neatpop-thanks-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	margin: 0 auto 16px;
	border-radius: 50%;
	background: var(--neatpop-accent);
	color: var(--neatpop-on);
	animation: neatpop-pop .5s cubic-bezier(.2, .9, .3, 1.35);
}
.neatpop .neatpop-thanks-icon svg { display: block; width: 28px; height: 28px; }
.neatpop.is-done .neatpop-actions { margin-top: 22px; }
.neatpop .neatpop-btn.neatpop-btn--soft,
.neatpop .neatpop-btn.neatpop-btn--soft:hover,
.neatpop .neatpop-btn.neatpop-btn--soft:focus { background: var(--neatpop-soft); box-shadow: none; color: var(--neatpop-fg); }

@keyframes neatpop-pop {
	from { opacity: 0; transform: scale(.4); }
}

/* Полоса */
.neatpop.neatpop--bar .neatpop-body {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 20px;
	padding: 14px 60px 14px 22px;
	overflow: visible;
}
.neatpop.neatpop--bar .neatpop-copy { flex: 1 1 280px; min-width: 0; }
.neatpop.neatpop--bar .neatpop-title { margin: 0; font-size: 16px; font-weight: 650; letter-spacing: 0; }
.neatpop.neatpop--bar .neatpop-text { margin-top: 2px; font-size: 14px; }
.neatpop.neatpop--bar .neatpop-actions { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0; }
.neatpop.neatpop--bar .neatpop-btn { min-height: 40px; padding: 8px 18px; font-size: 14px; box-shadow: none; }
.neatpop.neatpop--bar .neatpop-code { min-height: 40px; }
.neatpop.neatpop--bar .neatpop-code-text { padding: 6px 12px; font-size: 15px; }
.neatpop.neatpop--bar .neatpop-code-copy { padding: 0 12px; font-size: 13px; }
.neatpop.neatpop--bar .neatpop-close { top: 50%; margin-top: -16px; }

/* Узкий экран — класс ставит frontend.js по ширине окна, в превью — режим «Телефон» */
.neatpop.neatpop--narrow { padding: 12px; }
.neatpop.neatpop--narrow.neatpop--slide .neatpop-box { width: 100%; }
.neatpop.neatpop--narrow.neatpop--img-side .neatpop-box { flex-direction: column; width: 100%; }
.neatpop.neatpop--narrow.neatpop--img-side .neatpop-media { width: auto; aspect-ratio: 16 / 9; }
.neatpop.neatpop--narrow.neatpop--img-side .neatpop-body { padding-top: 24px; }
.neatpop.neatpop--narrow.neatpop--img-side .neatpop-close { background: rgba(255, 255, 255, .92); color: #17181c; }
.neatpop.neatpop--narrow.neatpop--img-top .neatpop-media { max-height: 30vh; }
.neatpop.neatpop--narrow .neatpop-body { padding: 30px 20px 20px; }
.neatpop.neatpop--narrow .neatpop-title { font-size: 21px; }
.neatpop.neatpop--narrow .neatpop-text { font-size: 15px; }
.neatpop.neatpop--narrow.neatpop--bar { padding: 8px; }
.neatpop.neatpop--narrow.neatpop--bar .neatpop-body { padding: 12px 48px 12px 16px; gap: 10px; }
.neatpop.neatpop--narrow.neatpop--bar .neatpop-title { font-size: 15px; }
.neatpop.neatpop--narrow.neatpop--bar .neatpop-text { font-size: 13.5px; }
.neatpop.neatpop--narrow.neatpop--bar .neatpop-actions { width: 100%; }
.neatpop.neatpop--narrow.neatpop--bar .neatpop-btn { flex: 1; }
.neatpop.neatpop--narrow.neatpop--bar .neatpop-close { top: 10px; margin-top: 0; }

/* Без анимации */
.neatpop.neatpop--instant .neatpop-box,
.neatpop.neatpop--instant .neatpop-overlay { transition: none; }
@media (prefers-reduced-motion: reduce) {
	.neatpop .neatpop-box,
	.neatpop .neatpop-overlay { transition-duration: .01ms !important; }
	.neatpop .neatpop-thanks-icon { animation: none; }
}

html.neatpop-lock { overflow: hidden; padding-right: var(--neatpop-sb, 0px); }